Flex & form小技巧

最近在用Flex配合Net开发程序，自然要经常用到Form这个超级方便的东西了，只要写很少的代码就能实现那些烦人的操作，真的很好~

特别是验证控件，我觉得不错，而且因为我公司开发的是英文版，所以连默认显示的提示语句都不用修改， O(∩_∩)O哈哈~

以下方法让你的form更好用：

1.一行有多个控件

默认是一个label+一个控件，如

< mx:FormItem label = " Company registration number " >
  < s:TextInput id = " tRegNum " />
</ mx:FormItem >

如果要一行多个控件的话，这样写：

代码

< mx:FormItem label = " Financial period ended "  direction = " horizontal " >             
  < mx:DateField id = " dFin "  formatString = " DD/MM/YYYY "  yearNavigationEnabled = " true " />             
  < s:TextInput id = " tRegNum " />             
</ mx:FormItem >

但是这样你会发现控件直接的对齐有问题，默认是水平左对齐，垂直方向top对齐，所以还需要修改：

代码

< mx:FormItem label = " Company registration number " >
  < mx:FormItem >
   < s:TextInput id = " tCompany "  width = " 300 " />
  </ mx:FormItem >  
  < mx:FormItem >
   < s:TextInput id = " tRegNum " />
  </ mx:FormItem >             
</ mx:FormItem >

 

看出有什么不同了么？对了，就是在FormItem里嵌套另外一个FormItem.

看看，现在是不是整齐多了，现在，垂直方向上的对齐ok了，但是发现第一个控件与前面的Label直接有个很大的空隙，这个事FormItem的Label造成的，继续修改：

 

代码

< mx:FormItem label = " Financial period ended "  direction = " horizontal " >             
  < mx:DateField id = " dFin "  formatString = " DD/MM/YYYY "  yearNavigationEnabled = " true " />             
  < mx:FormItem label = " (DD/MM/YYYY) " />             
</ mx:FormItem >

原来把第一个FormItem去掉就好了，直接暴露控件，不过貌似不是很和谐。

呵呵，现在看看你的Form，效果还不错吧。

2.Form的Head

给Form设置一个Head吧，就不需要再将Form嵌套在另外一个Panel中了。

< mx:FormHeading label = " Load Word " />

 

======华丽的分割线 03/Nov/2010 =======

以下内容来自：http://xiejiangbo.javaeye.com/blog/506518

 

Form重点属性：

①Form

1.verticalGap:2;控制同一个Form中两个FormItem之间的垂直距离

②FormItem

1.direction="vertical|horizontal" 控制子项排布为垂直或水平

2.verticalGap：垂直方向上各子项间的像素数目。默认值取决于组件类；

如果未覆盖类的默认值，则默认值为 6。

3.horizontalGap：水平方向上各子项间的像素数目。默认值取决于组件类；

如果未覆盖类的默认值，则默认值为 8。

4.这个属性找得最辛苦，其控制FormItem的lable和子组件之间的间距

indicatorGap：表单项的标签和子组件之间的像素数目。 默认值为  14.

 

转载于:https://www.cnblogs.com/4kapple/archive/2010/10/25/1860656.html