ItemRendererをオンザフライで追加コンポーネント

Question

私は、すべてのアイテムに対してitemRenderersとしてTextInputを持つListを持っています。アプリケーションの起動時に、項目はTextInput内に正しくレンダリングされます。データはオブジェクトの配列から読み込まれます。

データがItemRenderersに移入された後、追加のアイテムレンダラー（もちろんTextInput）が必要です...ユーザーが別のアイテムを入力したい場合、そのアイテムを置くことができます追加のtextInputに

また、ユーザーが新しいアイテムを追加し、新しく追加したアイテムにENTERをタップするたびに、追加のitemRendererを追加したいとします。

以下は私のitemRendererですが、clearTxt_enterHandlerハンドラがありますが、 "Enter"に別のitemRendererを追加する方法は不思議です。

誰かが私にこれを案内できますか？

Thxを

<?xml version="1.0" encoding="utf-8"?> 
<s:ItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009" 
       xmlns:s="library://ns.adobe.com/flex/spark" 
       xmlns:mx="library://ns.adobe.com/flex/mx" 
       autoDrawBackground="true" xmlns:components="components.*" width="100%"> 

    <s:layout> 
     <s:HorizontalLayout/> 
    </s:layout> 

    <fx:Script>http://stackoverflow.com/questions/4199373/flex-4-is-a-good-practice-store-the-loaded-bitmapdata-in-a-value-object-and-then 
     <![CDATA[ 


      import mx.events.FlexEvent; 

      import skins.ClearableTextInputSkin; 

      override public function set data(value:Object) : void { 
       super.data = value; 
       //clearTxt.text = value.label; 
      } 

      protected function clearTxt_enterHandler(event:FlexEvent):void 
      { 
       trace("On Enter"); 

      } 

     ]]> 
    </fx:Script> 

    <components:ClearableTextInput text="{data.label}" id="clearTxt" 
            skinClass="skins.ClearableTextInputSkin" enter="clearTxt_enterHandler(event)" left="10" top="36" width="220" /> 

</s:ItemRenderer> 

そして、これは、メインアプリケーションから来ている私のリストです：

<s:List id="myList" itemRenderer="renderers.TextInputRenderer" dataProvider="{xxx}" width="100%"> 
     <s:layout> 
      <s:TileLayout requestedRowCount="2"columnAlign="justifyUsingWidth"/> 
     </s:layout> 
    </s:List> 

Answer 1

たItemRendererから、新たItemRendererを要求するためにイベントをディスパッチします。それがItemRendererを所有するListまで完全に移動するように、バブリングするようにしてください。

protected function clearTxt_enterHandler(event:FlexEvent):void 
{ 
    dispatchEvent(new Event("myCustomRequestEvent", true)); 
    //replace with a real custom Event; this is for brevity 
} 

は、Listコンポーネント上でそのイベントを監視し、ハンドラ内だけで（おそらく空のラベルが付いた）そのデータプロバイダに新しい要素を追加します。

myList.addEventListener("myCustomRequestEvent", addRow); 

private function addRow(event:Event):void { 
    myList.dataProvider.addItem({label: null}); 
    //replace anonymous object with your class 
} 

これにより、新しい項目がリストに追加されます。あなたの場合、アイテムの追加時に増加するように、リスト内のアイテムの数にrequestRowCountをバインドする必要があります。

<s:VerticalLayout requestedRowCount="{myList.dataprovider.length}" /> 

私はなぜTileLayoutを使用していますか？アイテムごとに2つの入力ボックスが必要な場合は、1つのItemRendererに2つのTextInputを配置し、VerticalLayoutを使用する必要があります。あなたの人生を楽にします。