1

カスタム ItemRenderer を持つリストがあります。ItemRenderer には、チェックボックスとラベルが含まれています。リストを持つコンポーネントには、「すべて選択」チェックボックスがあります。「すべて選択」チェックボックスがチェックされると、各アイテムが独自のチェックボックスを選択するためにリッスンする必要があるイベントが送出されます。eventlistener は各アイテムの creationComplete に追加され、「すべて選択」チェックボックスが選択されている場合、イベントは正しくディスパッチされますが、カスタム ItemRenderer のリスナーはリッスンしません。

親でディスパッチされたイベントを ItemRenderer にリッスンさせるにはどうすればよいですか??

明確にするために、いくつかのコード例を追加します。

------- container ----------
<mx:VBox>
   <mx:Script>
      <![CDATA[
         public var user1 = new User(1, "Jack");
         public var user2 = new User(2, "John");
         public var user3 = new User(3, "Mary");

         [Bindable]
         public var users:ArrayCollection = new ArrayCollection([user1], [user2], [user3]);

         public static const SELECT_ALL_USERS:String = "selectAllUsers";

         private function selectAllChangeHandler():void
         {
            if (selectAll.selected)
               dispatchEvent(new Event(SELECT_ALL_USERS,true));
         }
      ]]>
   </mx:Script>
   <mx:CheckBox id="selectAll" change="{selectAllChangeHandler()}" />
   <mx:List dataProvider="{users}" itemRenderer="myRenderer" />
</mx:VBox>


------- renderer ----------
<?xml version="1.0" encoding="utf-8"?>
<mx:HBox creationComplete="{init()}">
   <mx:Script>
      <![CDATA[
         private function init():void
         {
            addEventListener (Container.SELECT_ALL, selectAllHandler, false, 0, true);
         }

         private function selectAllHandler():void
         {
            checkbox.selected=true;
         }

         private function selected(id:int):Boolean
         {
             return id==1 || id==3;
         }
      ]]>
   </mx:Script>

   <mx:CheckBox id="checkbox" selected="{selected(data.id)}" />
   <mx:Label text="{data.name}" />
</mx:HBox>

後で値が必要になるため、ユーザーの ArrayCollection またはそれに含まれるユーザー オブジェクトは変更できないことに注意してください。したがって、「selectAll」をクリックすると、リスト内の各チェックボックスもチェックする必要があります。

4

4 に答える 4

2

カスタム ItemRenderer は、イベント リスナーを親に登録するのではなく、「すべて選択」チェックボックスに登録する必要があります。

theCheckbox.addEventListener(YourEvent.YOUR_EVENT, itemRendererSelectAllHandler);

それができない場合、イベントリスナーを追加し、チェックボックスからイベントをディスパッチするコードを投稿できますか?

編集：

バグは次のとおりです。レンダラーの init() では、イベント リスナーをレンダラーではなく、イベントをディスパッチするコンテナーに追加する必要があります。だからそれを作る

container.addEventListener(Container.SELECT_ALL_USERS, selectAllHandler, false, 0, true);
于 2009-04-23T09:37:57.620 に答える
1

すべてをフレックスで選択するのは少し複雑ですが、私たちが行った方法を説明します。これはうまく機能します。

すべてのロジックを選択するために機能する既存のチェックボックスにバインドするプロパティ「selectAllCB」を持つ「ExList」と呼ばれるリスト派生コントロールを作成しました。selectAllCBプロパティを設定すると、チェックボックスのイベントをリッスンするようにExListが作成されることに注意してください。

チェックボックスをオンにすると、selectedItems配列がdataProviderの配列に手動で設定され、すべてのアイテムが選択されます。

たくさんのコードを書かなければならないたびにリストを何度もプログラムするとき、itemRendererで遊ぶことは正しく機能しません。

I am attaching some sample code here below..

    public class ExList extends List 
    {
        public function ExTileList()
        {
            super();
            this.allowMultipleSelection = true;
        }

        private var _selectAllCB:CheckBox = null;
        [Bindable]
        public function get selectAllCB():CheckBox
        {
            return _selectAllCB;
        }
        public function set selectAllCB(v:CheckBox):void
        {
            if(v==null)
                return;
            _selectAllCB = v;
            v.addEventListener(ListEvent.ITEM_CLICK, handleAllChange,false, 0 , true);
            v.addEventListener("change", handleAllChange,false, 0 , true);
        }

        private function handleAllChange(e:Event):void
        {
            if(_selectAllCB.selected)
            {
                this.selectedItems = this.dataProvider.toArray();
            }
            else
            {
                this.selectedItems = new Array();
            }
        }
}

そして、あなたはそれを次のように使うことができます...

<CheckBox id="sAll"/>
<ExList selectAllCB="{sAll}"/>

// Please note its in curly braces
于 2009-04-23T09:51:02.313 に答える
0

簡単な解決策は、提示するデータのリストで型指定されたオブジェクトを使用し、データ バインディングとバインディング ユーティリティを利用して、アイテム レンダラーの基になるデータ プロパティへの変更をキャプチャすることです。オブジェクトの一部のプロパティが「すべて選択/すべて選択解除」状態を反映するように変更されたときに必要な処理を行うために、アイテム レンダラーの「データの設定」関数をオーバーライドします。

于 2010-12-22T16:14:06.233 に答える
0

これが私が解決策を達成した方法です：

    <?xml version="1.0" encoding="utf-8"?>
<mx:VBox xmlns:mx="http://www.adobe.com/2006/mxml" height="150" verticalGap="0">
    <mx:Script>
 <![CDATA[
         import mx.events.ListEvent;
  import mx.controls.CheckBox;
  import mx.collections.ArrayCollection;

  public var listData:ArrayCollection;

  private function selectAll():void
  {
   listChkBox.selectedItems = listData.toArray();
   for each (var item:Object in listChkBox.selectedItems)
   {
    CheckBox(listChkBox.itemToItemRenderer(item)).selected = true;
          }   
  }

  private function resetAll():void
  {
   listChkBox.selectedItems = listData.toArray();
   for each (var item:Object in listChkBox.selectedItems)
   { 
                         CheckBox(listChkBox.itemToItemRenderer(item)).selected = false;
   } 
  }


  ]]>
 </mx:Script>
 <mx:List width="100%" height="100%" id="listChkBox" labelField="name" allowMultipleSelection="true"
   dataProvider="{listData}"  selectionColor="#FFFFFF" >
  <mx:itemRenderer>
   <mx:Component>
    <mx:CheckBox >
    </mx:CheckBox>
   </mx:Component>
  </mx:itemRenderer>
 </mx:List>
 <mx:HBox width="100%"  backgroundColor="#E2DEDE" paddingBottom="2" paddingLeft="2" paddingTop="2" paddingRight="2" borderStyle="solid">
  <mx:Button label="All"  id="btnAll" click="selectAll()" />
  <mx:Button label="None" click="resetAll()"/>
 </mx:HBox>
</mx:VBox>
于 2010-01-08T02:23:19.720 に答える