如何避免專注於Flex中的控件？

Question

我有一個自定義組件父母是組水平佈局，因爲我有兩個控件一個是TextInput和其他是日期字段。在ant位置使用這個自定義組件時，我將tabindex作爲一個整體提供給該控件。

我想只是，如果用戶選項卡（keyborad）然後重點放在Textinput焦點does not在dateField上。

我是如何做到這一點的。

這是我的代碼。

<?xml version="1.0" encoding="utf-8"?> 
<s:Group xmlns:fx="http://ns.adobe.com/mxml/2009" 
     xmlns:s="library://ns.adobe.com/flex/spark" 
     xmlns:mx="library://ns.adobe.com/flex/mx" width="100%" height="20" 
     xmlns:components="com.zigron.controls.extended.components.*" 
     creationComplete="creComp()"> 
    <!-- 
    Author : Tahir Alvi 
    Date : 11/06/2012 
    Place : Zigron Inc 
    --> 
    <fx:Declarations> 
     <mx:DateFormatter id="formatter" formatString="MM/DD/YYYY" /> 
    </fx:Declarations> 
    <fx:Script> 
     <![CDATA[ 
      import mx.controls.TextInput; 
      import mx.events.CalendarLayoutChangeEvent; 

      import spark.events.TextOperationEvent; 

      private var _selectedDate:Date; 
      private var _text:String=''; 
      private var _propmt:String='DOB'; 

      //---- creation Complete ---------- 
      private function creComp():void 
      { 
       id_dob.tabIndex = tabIndex; 
      } 
      //--At the initlize of datefield hide the Textinput --- 
      protected function init():void 
      { 
       var tf:TextInput = df.mx_internal::getTextInput(); 
       tf.visible = false; 
       tf.includeInLayout = false; 
      } 
      //-- date change handler --- 
      protected function df_changeHandler(event:CalendarLayoutChangeEvent):void 
      { 
       id_dob.text  = formatter.format(df.selectedDate.toString()); 
       text   = id_dob.text; 

       selectedDate = df.selectedDate; 
      } 
      // -- Text Input Change handler and apply masking on it ------- 
      protected function id_txt_changeHandler(event:TextOperationEvent):void 
      { 
       var s:String = id_dob.text.replace(/[^0-9]/g,""); 
       id_dob.text  = s.substring(0,2) + (s.length>2?"/"+s.substring(2,4) + (s.length>4?"/"+s.substring(4,8):""):""); 
       id_dob.selectRange(id_dob.text.length, id_dob.text.length); 

       text   = id_dob.text; 

       if(text.length) 
       { 
        selectedDate = null; 
       } 
       else 
       { 
        text = ''; 
       } 
      } 

      [Bindable] 
      public function get selectedDate():Date 
      { 
       return _selectedDate; 
      } 

      public function set selectedDate(value:Date):void 
      { 
       _selectedDate = value; 
      } 

      [Bindable] 
      public function get text():String 
      { 
       return _text; 
      } 

      public function set text(value:String):void 
      { 
       _text = value; 
       if(_text.length) 
        id_dob.text = _text; 
      } 

      [Bindable] 
      public function get propmt():String 
      { 
       return _propmt; 
      } 

      public function set propmt(value:String):void 
      { 
       _propmt = value; 
      } 

     ]]> 
    </fx:Script> 
    <s:layout> 
     <s:HorizontalLayout horizontalAlign="left" verticalAlign="top" gap="2"/> 
    </s:layout> 
    <components:LabelTextInput id="id_dob" 
           width="100%" prompt="{propmt}" change="id_txt_changeHandler(event)"/> 
    <mx:DateField id="df" 
        initialize="init()" width="20" change="df_changeHandler(event)" selectableRange="{{rangeEnd:new Date()}}" 
        toolTip="Select Date of Birth" yearNavigationEnabled="true" textInputStyleName="mandatoryDateSkin" 
        maxYear="{new Date().getFullYear()}" minYear="1901"/> 
</s:Group> 

Answer 1

我有一個自定義組件與他在裏面的textinput類似的問題。我的解決辦法是建立一個公共變種，像這樣：

//This is my component MyComponent... 
[Bindable] public var fTabIndex:int = -1; 

<mx:TextInput id="field" tabIndex="{fTabIndex}"/> 

（其他成分...）

//Other component 
<mx:TextInput tabindex="1"/> 
<control:MyComponent fTabIndex="2"/> 

我希望這將是有益的。

Answer 2

set enabled =「false」; 並在需要時在代碼中進行更改。