Flex 4中如何设置NumericStepper竖直方向对齐方式的例子

By Minidxer | September 15, 2009

接下来的例子演示了Flex 4中如何通过verticalAlign样式，设置NumericStepper竖直方向对齐方式。

让我们先来看一下Demo（可以点击这里察看源代码）：


下面是完整代码(或点击这里察看)：
下面是main.mxml：

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <s:Application name="Spark_NumericStepper_textInput_textView_verticalAlign_test"
  3.         xmlns:fx="http://ns.adobe.com/mxml/2009"
  4.         xmlns:s="library://ns.adobe.com/flex/spark"
  5.         xmlns:mx="library://ns.adobe.com/flex/halo">
  6.     <fx:Script>
  7.         <![CDATA[
  8.             import mx.events.IndexChangedEvent;
  9.  
  10.             private function dropDownList_selectionChanged(evt:IndexChangedEvent):void {
  11.                 numericStepper.textInput.textView.setStyle("verticalAlign", dropDownList.selectedItem);
  12.             }
  13.         ]]>
  14.     </fx:Script>
  15.  
  16.     <mx:ApplicationControlBar width="100%" cornerRadius="0">
  17.         <mx:Form styleName="plain">
  18.             <mx:FormItem label="verticalAlign:">
  19.                 <s:DropDownList id="dropDownList"
  20.                         requiresSelection="true"
  21.                         selectionChanged="dropDownList_selectionChanged(event);">
  22.                     <s:dataProvider>
  23.                         <s:ArrayList source="[top,middle,bottom]" />
  24.                     </s:dataProvider>
  25.                 </s:DropDownList>
  26.             </mx:FormItem>
  27.         </mx:Form>
  28.     </mx:ApplicationControlBar>
  29.  
  30.     <s:NumericStepper id="numericStepper"
  31.             fontSize="32"
  32.             width="100"
  33.             height="100"
  34.             horizontalCenter="0"
  35.             verticalCenter="0" />
  36.  
  37. </s:Application>
代码：Peter deHaan 翻译/整理/编译：中文Flex例子

Topics: Gumbo, NumericStepper | No Comments » | Tags: ,

你可能还对下列文章感兴趣:

Leave a Comment

Name(*):

E-Mail(*) :

Website :

Comments :

Search Posts

Categories

Archives

Blogroll