我想要一个类似于示例图像的布局,但我不想使用 Spark Form。实现这一目标的最佳方法是什么?
- 每个标签都右对齐
- 每个项目左对齐
- 标签和项目水平居中。
- 项目可以是任何项目,而不仅仅是文本。
我不想使用FormLayout
,因为在不为Form
. 此外,它实际上并不是一个表格。
我想要一个类似于示例图像的布局,但我不想使用 Spark Form。实现这一目标的最佳方法是什么?
我不想使用FormLayout
,因为在不为Form
. 此外,它实际上并不是一个表格。
如果您对表单布局的唯一关注是对表单进行蒙皮,请注意,您可以完全使用样式属性来实现所需的结果:
示例表单指定fx:Style
:
<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark">
<fx:Style>
@namespace s "library://ns.adobe.com/flex/spark";
s|FormItem s|Label#labelDisplay {
textAlign: right;
fontSize: 24px;
}
s|Label {
fontSize: 24px;
}
</fx:Style>
<s:Form>
<s:layout>
<s:FormLayout gap="-12" />
</s:layout>
<s:FormItem label="Label">
<s:Label text="Item 1" />
</s:FormItem>
<s:FormItem label="Another Label">
<s:Label text="Item 2" />
</s:FormItem>
<s:FormItem label="Even Longer Label">
<s:Label text="Another Item" />
</s:FormItem>
</s:Form>
</s:Application>
您可以使用VBox组件轻松实现此布局:
<mx:VBox>
<mx:Canvas>
<mx:Label text="Label:Item 1"/>
</mx:Canvas>
<mx:Canvas>
<mx:Label text="Label:Item 2"/>
</mx:Canvas>
</mx:VBox>
API 参考链接:http: //help.adobe.com/en_US/FlashPlatform/reference/actionscript/3/mx/containers/VBox.html