Flex Gumbo中如何通过marginLeft, marginRight, marginTop以及marginBottom样式设置FxTextArea边框的例子

By Minidxer | June 24, 2009

接下来的例子演示了Flex Gumbo中如何通过marginLeft, marginRight, marginTop以及marginBottom样式,设置FxTextArea边框。

让我们先来看一下Demo可以点击这里察看源代码):


下面是完整代码(或点击这里察看):

Download: main.mxml
  1. <?xml version="1.0" encoding="utf-8"?>
  2. <Application name="FxTextArea_margin_test"
  3.         xmlns="http://ns.adobe.com/mxml/2009"
  4.         layout="vertical"
  5.         verticalAlign="middle"
  6.         backgroundColor="white">
  7.  
  8.     <ApplicationControlBar dock="true">
  9.         <Form styleName="plain">
  10.             <FormItem label="marginLeft:">
  11.                 <HSlider id="leftSlider"
  12.                         minimum="0"
  13.                         maximum="40"
  14.                         snapInterval="1"
  15.                         tickInterval="2"
  16.                         liveDragging="true" />
  17.             </FormItem>
  18.             <FormItem label="marginRight:">
  19.                 <HSlider id="rightSlider"
  20.                         minimum="0"
  21.                         maximum="40"
  22.                         snapInterval="1"
  23.                         tickInterval="2"
  24.                         liveDragging="true" />
  25.             </FormItem>
  26.             <FormItem label="marginTop:">
  27.                 <HSlider id="topSlider"
  28.                         minimum="0"
  29.                         maximum="40"
  30.                         snapInterval="1"
  31.                         tickInterval="2"
  32.                         liveDragging="true" />
  33.             </FormItem>
  34.             <FormItem label="marginBottom:">
  35.                 <HSlider id="bottomSlider"
  36.                         minimum="0"
  37.                         maximum="40"
  38.                         snapInterval="1"
  39.                         tickInterval="2"
  40.                         liveDragging="true" />
  41.             </FormItem>
  42.         </Form>
  43.     </ApplicationControlBar>
  44.  
  45.     <FxTextArea id="textArea"
  46.             textAlign="justify"
  47.             marginLeft="{leftSlider.value}"
  48.             marginRight="{rightSlider.value}"
  49.             marginTop="{topSlider.value}"
  50.             marginBottom="{bottomSlider.value}"
  51.             width="100%"
  52.             height="100%">
  53.         <text><String source="data/lorem.txt" /></text>
  54.     </FxTextArea>
  55.  
  56. </Application>
代码:Peter deHaan 翻译/整理/编译:中文Flex例子

Topics: FxTextArea, Gumbo | No Comments » | 270 views Tags: , , , , ,

Search Posts