3.8.使用约束条件为文本创建排版流程(Layout Flows)
3.8.1 问题
你要为多段文字创建一个排版流程(layout flow)。
3.8.2 解决办法
创建并添加一个ConstraintColumn 和ConstraintRow 对象到Canvas 组件，然后使用它们为子组件设置约束条件。
3.8.3 讨论
所有支持约束条件的容器都具有两个数组来存储加到该Canvas 的行和列的轨迹。只需为各自数组添加现成的约束条件即可保证所有的子组件可以存取约束条件到它的属性。本节的例子就是用约束条件来控制排版流程(layout flow)。首先，创建多个ConstraintColumn 和ConstraintRow 对象，然后将这些对象添加到Canvas 的constraintRows 和constraintColumns 属性。使用setStyle 方法动态的将约束条件设置到现成的UIComponent对象来约束之。这个例子使用text.setStyle("left", constraintColumn.id+":10"); 从ConstraintColumn 对象的数组中动态地存取约束条件，或者使用下面这样稍微复杂的句式以保证访问到正确的列。如：
在接下来的清单里，生成ConstraintColumn 对象并且基于这些对象来设置新子组件的样式属性。当添加新的行时，相关的子组件会使用新的行重新设置样式来改变自己的位置，并且所有未使用过的ConstraintColumn 对象会从容器中移除，constraintColumns 即是这些数组的缩写。
你要为多段文字创建一个排版流程(layout flow)。
3.8.2 解决办法
创建并添加一个ConstraintColumn 和ConstraintRow 对象到Canvas 组件，然后使用它们为子组件设置约束条件。
3.8.3 讨论
所有支持约束条件的容器都具有两个数组来存储加到该Canvas 的行和列的轨迹。只需为各自数组添加现成的约束条件即可保证所有的子组件可以存取约束条件到它的属性。本节的例子就是用约束条件来控制排版流程(layout flow)。首先，创建多个ConstraintColumn 和ConstraintRow 对象，然后将这些对象添加到Canvas 的constraintRows 和constraintColumns 属性。使用setStyle 方法动态的将约束条件设置到现成的UIComponent对象来约束之。这个例子使用text.setStyle("left", constraintColumn.id+":10"); 从ConstraintColumn 对象的数组中动态地存取约束条件，或者使用下面这样稍微复杂的句式以保证访问到正确的列。如：
+展开
-ActionScript
child.setStyle("left",(constraintColumns[i-
(constraintColumns.length/2)-2] as ConstraintColumn).id+":10");
(constraintColumns.length/2)-2] as ConstraintColumn).id+":10");
在接下来的清单里，生成ConstraintColumn 对象并且基于这些对象来设置新子组件的样式属性。当添加新的行时，相关的子组件会使用新的行重新设置样式来改变自己的位置，并且所有未使用过的ConstraintColumn 对象会从容器中移除，constraintColumns 即是这些数组的缩写。
+展开
-XML
<mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml" width="1000"
height="800">
<mx:Script>
<![CDATA[
import mx.core.UIComponent;
import mx.controls.TextArea;
import mx.containers.utilityClasses.ConstraintColumn;
[Bindable]
public var txt:String = "Cort¨￠zar is highly regarded
as a master of short stories of a fantastic bent,
with the collections Bestiario (1951)" +
" and Final de Juego (1956) containing many of his
best examples in the genre, including the remarkable
\"Continuidad de los Parques\"" +
" and \"Axolotl.\"";
private function addText(event:Event):void
{
var text:TextArea = new TextArea();
addChild(text);
text.text = txt;
var constraintColumn:ConstraintColumn =
new ConstraintColumn();
constraintColumn.id =
"column"+numChildren.toString();
constraintColumns.push(constraintColumn);
if(constraintColumns.length > 1)
{
for each(var col:ConstraintColumn in
constraintColumns){
col.width = (width / (numChildren-2));
}
}c
onstraintColumn.width = (width / (numChildren-2));
text.setStyle("top", "row:30");
text.setStyle("bottom", "row:30");
text.setStyle("left", constraintColumn.id+":10");
text.setStyle("right", constraintColumn.id+":10");
}
private function addRow(event:Event):void
{
var constraintRow:ConstraintRow =
new ConstraintRow();
constraintRows.push(constraintRow);
constraintRow.id = "row"+constraintRows.length;
for each(var row:ConstraintRow in constraintRows){
row.height = (height / (constraintRows.length-1));
}
var i:int = Math.round(numChildren - (numChildren-
2)/constraintRows.length);
while(i < numChildren){
var child:UIComponent = (getChildAt(i) as
UIComponent);
child.setStyle("top",
"row"+constraintRows.length+":30");
child.setStyle("bottom",
"row"+constraintRows.length+":30");
child.setStyle("left", (constraintColumns[i-
(constraintColumns.length/2)-2] as
ConstraintColumn).id+":10");
child.setStyle("right", (constraintColumns[i-
(constraintColumns.length/2)-2] as
ConstraintColumn).id+":10");
i++;
}c
onstraintColumns.length = constraintColumns.length
/ constraintRows.length;
}
]]>
</mx:Script>
<mx:constraintRows>
<mx:ConstraintRow id="row" height="100%"/>
</mx:constraintRows>
<mx:Button click="addText(event)" label="add text"/>
<mx:Button click="addRow(event)" label="add row" x="150"/>
</mx:Canvas>
height="800">
<mx:Script>
<![CDATA[
import mx.core.UIComponent;
import mx.controls.TextArea;
import mx.containers.utilityClasses.ConstraintColumn;
[Bindable]
public var txt:String = "Cort¨￠zar is highly regarded
as a master of short stories of a fantastic bent,
with the collections Bestiario (1951)" +
" and Final de Juego (1956) containing many of his
best examples in the genre, including the remarkable
\"Continuidad de los Parques\"" +
" and \"Axolotl.\"";
private function addText(event:Event):void
{
var text:TextArea = new TextArea();
addChild(text);
text.text = txt;
var constraintColumn:ConstraintColumn =
new ConstraintColumn();
constraintColumn.id =
"column"+numChildren.toString();
constraintColumns.push(constraintColumn);
if(constraintColumns.length > 1)
{
for each(var col:ConstraintColumn in
constraintColumns){
col.width = (width / (numChildren-2));
}
}c
onstraintColumn.width = (width / (numChildren-2));
text.setStyle("top", "row:30");
text.setStyle("bottom", "row:30");
text.setStyle("left", constraintColumn.id+":10");
text.setStyle("right", constraintColumn.id+":10");
}
private function addRow(event:Event):void
{
var constraintRow:ConstraintRow =
new ConstraintRow();
constraintRows.push(constraintRow);
constraintRow.id = "row"+constraintRows.length;
for each(var row:ConstraintRow in constraintRows){
row.height = (height / (constraintRows.length-1));
}
var i:int = Math.round(numChildren - (numChildren-
2)/constraintRows.length);
while(i < numChildren){
var child:UIComponent = (getChildAt(i) as
UIComponent);
child.setStyle("top",
"row"+constraintRows.length+":30");
child.setStyle("bottom",
"row"+constraintRows.length+":30");
child.setStyle("left", (constraintColumns[i-
(constraintColumns.length/2)-2] as
ConstraintColumn).id+":10");
child.setStyle("right", (constraintColumns[i-
(constraintColumns.length/2)-2] as
ConstraintColumn).id+":10");
i++;
}c
onstraintColumns.length = constraintColumns.length
/ constraintRows.length;
}
]]>
</mx:Script>
<mx:constraintRows>
<mx:ConstraintRow id="row" height="100%"/>
</mx:constraintRows>
<mx:Button click="addText(event)" label="add text"/>
<mx:Button click="addRow(event)" label="add row" x="150"/>
</mx:Canvas>
加支付宝好友偷能量挖...
