apache-flex - Flex - Horizo​​ntallist のデータプロバイダーとして ArrayCollection を型指定しました

Question

オブジェクトの ArrayCollection があります。この配列を dataprovider として horizo​​ntallist に渡し、カスタム itemRenderer を使用しています。

アプリケーションを実行すると、水平リストが表示されます

[object CustomClass][object CustomClass][object CustomClass][object CustomClass]

次のように、itemrenderer の各オブジェクトをキャストしてみました。

<mx:Label text="{(data as CustomClass).label1}"/>

しかし、それは機能していません...

ご協力いただきありがとうございます。よろしく、

BS_C3

---

編集 - 2010 年 3 月 9 日

もう少しコードを見てみましょう =)

<?xml version="1.0" encoding="utf-8"?>
<mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml">

    <mx:Component id="Item">
        <mx:VBox width="180">
            <mx:HBox width="100%">
                <mx:Spacer width="100%"/>
                <mx:Button label="x"/>
            </mx:HBox>
            <mx:Image id="thumbnail"/>
            <mx:Label width="100%" horizontalCenter="0" text="Collection"/>
            <mx:HBox width="100%">
                <mx:Label width="100" text="GIA"/>
                <mx:Label text="{data.charg_st}"/>
            </mx:HBox>
            <mx:HBox width="100%">
                <mx:Label width="100" text="Finger Size"/>
                <mx:Label text="xxxxxx"/>
            </mx:HBox>
            <mx:HBox width="100%">
                <mx:Label width="100" text="Carat"/>
                <mx:Label text="{data.carats}"/>
            </mx:HBox>
            <mx:HBox width="100%">
                <mx:Label width="100" text="Color"/>
                <mx:Label text="{data.color}"/>
            </mx:HBox>
            <mx:HBox width="100%">
                <mx:Label width="100" text="Clarity"/>
                <mx:Label text="{data.clarity}"/>
            </mx:HBox>
            <mx:HBox width="100%">
                <mx:Label width="100" text="Shop"/>
                <mx:Label text="{data.lgort_fp}"/>
            </mx:HBox>
            <mx:HBox width="100%">
                <mx:Label width="100" text="Resizing"/>
                <mx:Label text="{data.resizing}"/>
            </mx:HBox>
            <mx:HBox width="100%">
                <mx:Label width="100" text="Price Excl. VAT"/>
                <mx:Label text="{data.net_price_fp}"/>
            </mx:HBox>
        </mx:VBox>
    </mx:Component>


    <mx:HorizontalList
        dataProvider="{GlobalData.instance.tray}" 
        columnCount="4"
        rowCount="1"
        horizontalScrollPolicy="off"
        itemRenderer="{Item}"
    />
</mx:Canvas>

参考までに、Horizo​​nalList データプロバイダーはオブジェクトの ArrayCollection です。

現在、水平リストには空のアイテムが表示されています...正しい幅で... arraycollection は空ではありません(アイテムのクリックイベントでアラートを使用しており、期待されるデータを取得しています)。

これが役立つことを願っています >_<

よろしく、 BS_C3

Answer 1

やってみました

<mx:Label text="{data.label1}"/>

? （label1あなたのオブジェクトのプロパティです）

Answer 2

labelFieldリスト内のフィールドを使用してください。こちらを参照してください

<mx:List dataProvider="{myDataProvider}" labelField="label1"/>

Answer 3

カスタム クラスをコンポーネントのどこかで変数として宣言してみてください。クラスのインスタンスを宣言すると、Flex はクラスのプロパティの識別に成功する可能性があります。

<?xml version="1.0" encoding="utf-8"?>
<mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml">
  <mx:Script>
    <![CDATA[
      private var myClass:CustomClass;
    ]]> 
  </mx:Script>
    <mx:Component id="Item">
        <mx:VBox width="180">
         ...

thelostも彼のコードでそれを正しく行いました。あなたは使用できるはずです

<mx:Label text="{data.label1}"/>

でクラスのプロパティにアクセスしますitemRenderer。

編集：これを行ったと確信していdataProviderますHorizontalListが、 の[Bindable]宣言に を設定したことも再確認してくださいCustomClass。

Answer 4

問題を解決することができました。

itemrenderer の vbox の width プロパティを削除すると、すべてのデータが horizo​​ntalList に表示されました。なんで？理由はわかりませんが、水平リストの可視範囲外にデータを配置していたようです (ハァッ??)。

問題は、すべてが現在機能しているということです。最終的なコードは次のとおりです。

水平リスト:

<mx:HorizontalList id="hlist"
    dataProvider="{TrayData.instance.itemsCollection}" 
    columnCount="{TrayData.instance.hlistColumns}"
    rowCount="1"
    itemRenderer="components.TrayItem"
    horizontalScrollPolicy="off"
    horizontalCenter="0" verticalCenter="0"
    borderStyle="none"
    horizontalScrollPosition="{TrayData.instance.hsPosition}"
    />

アイテムレンダラー:

<mx:VBox xmlns:mx="http://www.adobe.com/2006/mxml" >

    <mx:HBox width="100%">
        <mx:Spacer width="100%"/>
        <mx:Button label="x"/>
    </mx:HBox>
    <mx:HBox width="100%">
        <mx:Spacer width="15%"/>
        <mx:VBox width="70%">
            <mx:Image id="thumbnail" horizontalAlign="center"/>
            <mx:Label width="100%" textAlign="center" text="Collection"/>
            <mx:HBox width="100%">
                <mx:VBox id="labelBox" width="100">
                    <mx:Label width="100" text="GIA"/>
                    <mx:Label width="100" text="Finger Size"/>
                    <mx:Label width="100" text="Carat"/>
                    <mx:Label width="100" text="Color"/>
                    <mx:Label width="100" text="Clarity"/>
                    <mx:Label width="100" text="Shop"/>
                    <mx:Label width="100" text="Resizing"/>
                    <mx:Label width="100" text="Price"/>
                </mx:VBox>
                <mx:VBox id="dataBox" width="100%" horizontalAlign="left">
                    <mx:Label text="{data.resizingCode + ' ' + data.charg_st}"/>
                    <mx:Label text="{data.fingerSize}"/>
                    <mx:Label text="{((new Number(data.carats))/100).toString()}"/>
                    <mx:Label text="{data.color}"/>
                    <mx:Label text="{data.clarity}"/>
                    <mx:Label text="{data.lgort_fp}"/>
                    <mx:Label text="{data.net_price_fp}"/>
                </mx:VBox>
            </mx:HBox>
            <mx:Button label="Order" enabled="{data.product_type == 'C'}" width="50%"/>
        </mx:VBox>
        <mx:Spacer width="15%"/>
    </mx:HBox>

</mx:VBox>

よろしく、 BS_C3