无风无影

   ::  :: 新随笔  ::  ::  :: 管理

flex定位

一、自动定位
 直接设置其子组件的 x 或 y 属性或调用 move() 方法将没有任何效果。主要是通过指定容器属性控制布局。
 layout: 值 "horizontal"、 "vertical"或 "absolute"。当设置为 "horizontal"时,容器会将其子级布局在一行内。 当设置为 "vertical"时, 容器会将其子级布局在一列内。 有关 "absolute" 设置的信息, 请参阅绝对定位和基于限制的布局上的部分。
 horizontalAlign: 值 "left"、 "center"或 "right"。
  verticalAlign: 值 "top"、 "middle"或 "bottom"。
二、绝对定位
 有三个容器支持绝对定位:
  如果您将 layout 属性指定为 "absolute", 则 Application 和 Panel 控件使用绝对定位。
  Canvas 容器始终使用绝对定位。
 使用绝对定位, 你通过使用其 x 和 y 属性来指定子控件的位置, 或者指定基于限制的布局;否则, Flex 会将该子级置于父容器的位置 0,0 处。 当您指定 x 和 y 坐标时, 仅当您更改这些属性值时, Flex 才会重新定位控件
三、基于限制的布局
        该布局中您锚定组件的侧边或中心以相对于组件的容器进行定位。top、 bottom、 left 和 right 样式属性指定组件侧边与相应的容器侧边之间的距离
 <mx:Panel title="My Application" layout="absolute" width="300" height="130">
 <mx:Button id="myButton" label="Button" right="10" bottom="10"/>
 </mx:Panel>

 锚定组件的中心

 horizontalCenter 和 verticalCenter 样式指定在指定的方向上组件的中心点与容器的中心之间的距离;一个负数会从中心向左或向上移动组件。
 <mx:Panel title="My Application" layout="absolute" width="300" height="130">
 <mx:Button id="myButton" label="Button" horizontalCenter="0" verticalCenter="20">
 </mx:Button>
 </mx:Panel>

 

posted on 2012-10-18 15:55  NWNS-无风无影  阅读(937)  评论(0)    收藏  举报