| { "type": "class", | |
| "qname": "mx.containers.Grid", | |
| "baseClassname": "mx.containers.Box" | |
| , | |
| "description": "A Grid container lets you arrange children as rows and columns of cells, similar to an HTML table. The Grid container contains one or more rows, and each row can contain one or more cells, or items. You use the following tags to define a Grid control: <ul> <li>The <code><mx:Grid></code> tag defines a Grid container.</li> <li>The <code><mx:GridRow></code> tag defines a grid row, which has one or more cells. The grid row must be a child of the <code><Grid></code> tag.</li> <li>The <code><mx:GridItem></code> tag defines a grid cell, and must be a child of the <code><GridRow></code> tag. The <code><mx:GridItem></code> tag can contain any number of children.</li> </ul> <p>The height of all the cells in a single row is the same, but each row can have a different height. The width of all cells in a single column is the same, but each column can have a different width. You can define a different number of cells for each row or each column of the Grid container. In addition, a cell can span multiple columns or multiple rows of the container.</p> <p>The Grid, GridRow, and GridItem containers have the following default sizing characteristics:</p> <table class="innertable"> <tr> <th>Characteristic</th> <th>Description</th> </tr> <tr> <td>Grid height</td> <td>The sum of the default or explicit heights of all rows plus the gaps between rows.</td> </tr> <tr> <td>Grid width</td> <td>The sum of the default or explicit width of all columns plus the gaps between columns.</td> </tr> <tr> <td>Height of each row and each cell</td> <td>The default or explicit height of the tallest item in the row. If a GridItem container does not have an explicit size, its default height is the default or explicit height of the child in the cell.</td> </tr> <tr> <td>Width of each column and each cell</td> <td>The default or explicit width of the widest item in the column. If a GridItem container does not have an explicit width, its default width is the default or explicit width of the child in the cell.</td> </tr> <tr> <td>Gap between rows and columns</td> <td>Determined by the horizontalGap and verticalGap styles of the Grid class. The default value for both gaps is 6 pixels.</td> </tr> <tr> <td>Default padding</td> <td>0 pixels for the top, bottom, left, and right values, for all three container classes.</td> </tr> </table> <p>The <code><mx:Grid></code> tag inherits all of the tag attributes of its superclass, except the <code>Box.direction</code> property, and adds the following tag attributes:</p> <pre>\\n <mx:Grid\\n <strong>Styles</strong>\\n horizontalGap="8"\\n verticalGap="6"\\n >\\n ...\\n <i>These child tags are examples only:</i>\\n <mx:GridRow id="row1">\\n <mx:GridItem\\n rowSpan="1"\\n colSpan="1">\\n <mx:Button label="Button 1"/>\\n </mx:GridItem>\\n ...\\n </mx:GridRow>\\n ...\\n </mx:Grid>\\n </pre>", | |
| "tags": [ | |
| { "tagName": "includeExample", | |
| "values": ["examples/GridLayoutExample.mxml"]}, | |
| { "tagName": "see", | |
| "values": ["mx.containers.GridRow", "mx.containers.GridItem"]}, | |
| { "tagName": "mxml", | |
| "values": []}, | |
| { "tagName": "playerversion", | |
| "values": ["Flash 9", "AIR 1.1"]}, | |
| { "tagName": "productversion", | |
| "values": ["Flex 3"]}, | |
| { "tagName": "langversion", | |
| "values": ["3.0"]} ], | |
| "members": [ | |
| { "type": "method", | |
| "qname": "mx.containers.Grid", | |
| "namespace": "", | |
| "bindable": [], | |
| "details": [], | |
| "deprecated": {}, | |
| "description": "Constructor.", | |
| "tags": [ | |
| { "tagName": "playerversion", | |
| "values": ["Flash 9", "AIR 1.1"]}, | |
| { "tagName": "productversion", | |
| "values": ["Flex 3"]}, | |
| { "tagName": "langversion", | |
| "values": ["3.0"]} ], | |
| "return": "", | |
| "params": []} | |
| , | |
| { "type": "method", | |
| "qname": "measure", | |
| "namespace": "protected", | |
| "bindable": [], | |
| "details": ["override"], | |
| "deprecated": {}, | |
| "description": "Calculates the preferred, minimum, and maximum sizes of the Grid. <p>You should not call this method directly; it is an advanced method for use in subclassing. The Flex LayoutManger calls the <code>measure()</code> method at the appropriate time. At application startup, the Flex LayoutManager attempts to measure all components from the children to the parents before setting them to their final sizes.</p> <p>To understand how the Grid container calculates its measurements, assume that every GridItem container has its <code>rowSpan</code> property and <code>colSpan</code> property set to 1. The measured width of the first column of the Grid container is equal to the maximum among of the measured widths of all GridItem containers in the first column. Similarly, the measured width of the second column is the maximum of all measured widths among the GridItem containers in the second column, and so on. The <code>measuredWidth</code> of the entire Grid container is the sum of all columns' measured widths, plus the thickness of the border, plus the left and right padding, plus room for the horizontal gap between adjacent grid cells.</p> <p>The <code>measuredHeight</code>, <code>minWidth</code>, <code>minHeight</code>, <code>maxWidth</code>, and <code>maxHeight</code> properties' values are all calculated in a similar manner, by adding together the values of the GridItem containers' <code>measuredHeight</code> properties, <code>minWidth</code> properties, and so on.</p> <p>If a GridItem container's <code>colSpan</code> property is 3, that GridItem container's <code>measuredWidth</code> is divided among 3 columns. If the <code>measuredWidth</code> is divided equally, each of the three columns calculates its measured width as if the GridItem container were only in that column and the GridItem container's <code>measuredWidth</code> were one-third of its actual value.</p> <p>However, the GridItem container's <code>measuredWidth</code> property is not always divided equally among all the columns it spans. If some of the columns have a property with a percentage value of <code>width</code>, the GridItem container's <code>measuredWidth</code> property is divided accordingly, attempting to give each column the requested percentage of the Grid container.</p> <p>All of the values described previously are the <i>measured</i> widths and heights of Grid. The user can override the measured values by explicitly supplying a value for the following properties:</p> <ul> <li><code>minHeight</code></li> <li><code>minWidth</code></li> <li><code>maxHeight</code></li> <li><code>maxWidth</code></li> <li><code>height</code></li> <li><code>width</code></li> </ul> <p>If you override this method, your implementation must call the <code>super.measure()</code> method or set the <code>measuredHeight</code> and <code>measuredWidth</code> properties. You may also optionally set the following properties:</p> <ul> <li><code>measuredMinWidth</code></li> <li><code>measuredMinHeight</code></li> </ul> <p>These properties correspond to the layout properties listed previously and, therefore, are not documented separately.</p>", | |
| "tags": [ | |
| { "tagName": "playerversion", | |
| "values": ["Flash 9", "AIR 1.1"]}, | |
| { "tagName": "productversion", | |
| "values": ["Flex 3"]}, | |
| { "tagName": "langversion", | |
| "values": ["3.0"]} ], | |
| "return": "void", | |
| "params": []} | |
| , | |
| { "type": "method", | |
| "qname": "updateDisplayList", | |
| "namespace": "protected", | |
| "bindable": [], | |
| "details": ["override"], | |
| "deprecated": {}, | |
| "description": "Sets the size and position of each child of the Grid. <p>You should not call this method directly; it is an advanced method for use in subclassing. The Flex LayoutManager calls the <code>updateDisplayList</code> method at the appropriate time. At application startup, the Flex LayoutManager calls the <code>updateDisplayList()</code> method on every component, starting with the root and working downward.</p> <p>The Grid container follows the same layout rules as the VBox container. The positions and sizes of the GridRow containers are calculated the same way that a VBox container determines the positions and sizes of its children. Similarly, a GridRow container positions its GridItem containers using a similar layout algorithm of an HBox container.</p> <p>The only difference is that the GridRow containers all coordinate with one another, so they all choose the same positions and sizes for their children (so that the columns of the Grid container align). </p> <p>If you override this method, your implementation should call the <code>super.updateDisplayList()</code> method and call the <code>move()</code> and the <code>setActualSize()</code> methods on each of the children. For the purposes of performing layout, you should get the size of this container from the <code>unscaledWidth</code> and <code>unscaledHeight</code> properties, not the <code>width</code> and <code>height</code> properties. The <code>width</code> and <code>height</code> properties do not take into account the values of the <code>scaleX</code> and <code>scaleY</code> properties for this container.</p> in the component's coordinates, regardless of the value of the <code>scaleX</code> property of the component. in the component's coordinates, regardless of the value of the <code>scaleY</code> property of the component.", | |
| "tags": [ | |
| { "tagName": "param", | |
| "values": ["unscaledWidth Specifies the width of the component, in pixels,", "unscaledHeight Specifies the height of the component, in pixels,"]}, | |
| { "tagName": "playerversion", | |
| "values": ["Flash 9", "AIR 1.1"]}, | |
| { "tagName": "productversion", | |
| "values": ["Flex 3"]}, | |
| { "tagName": "langversion", | |
| "values": ["3.0"]} ], | |
| "return": "void", | |
| "params": [{ "name": "unscaledWidth", "type": "Number"}, | |
| { "name": "unscaledHeight", "type": "Number"}]} | |
| ] | |
| } |