ログイン
ユーザ名:

パスワード:


パスワード紛失

新規登録
メインメニュー
フォーラム一覧   -   トピック一覧
   超ビギナー
     TilelistとArrayCollectionについて
投稿するにはまず登録を

スレッド表示 | 新しいものから 前のトピック | 次のトピック | 下へ
投稿者 トピック
shin18
投稿日時: 2013-4-3 13:23
やや お馴染みさん
登録日: 2013-4-2
居住地:
投稿: 7
TilelistとArrayCollectionについて
初心者です。
Tilelist表示部分でハマっています。
埋め込み型の画像表示(Embed)ではなく、ファイル格納場所をAllayCollection変数に入れて、その場所の画像を表示したいのですが、うまく表示されません。

ご教授いただければ助かります。

以下ソースです。

【Main.mxml】
<?xml version="1.0" encoding="UTF-8"?>
<mx:WindowedApplication
xmlns:mx="http://www.adobe.com/2006/mxml" xmlns:MyComp="*" title="Main" layout="vertical">
<MyComp:DtoimageModel id="model" />
<mx:TileList id="Selection" width="100%" height="100%">
dataProvider="{data.model.imgdata}"
</mx:TileList>
</mx:WindowedApplication>


【DtoimageModel.as】
package
{
import Dtoimage;
import mx.collections.ArrayCollection;
[Bindable]
public class DtoimageModel
{
public var imgdata:ArrayCollection;
public function DtoimageModel()
{
var account1:Dtoimage = new Dtoimage("a" , "b" , "c");
account1.fieldA = "GRL_0004.JPG";
account1.fieldB = "file:///D:/testphoto/GRL_0004.JPG";
account1.fieldC = "0";
imgdata = new ArrayCollection([account1]);
}
}
}


【Dtoimage.as】
package
{
[Bindable]
public class Dtoimage
{
public var fieldA:String;
public var fieldB:String;
public var fieldC:String;
public function Dtoimage(a:String,b:String,c:String)
{
fieldA = a;
fieldB = b;
fieldC = c;
}
}
}
Nanoka
投稿日時: 2013-4-3 14:45
超常連さん
登録日: 2009-11-24
居住地:
投稿: 43
Re: TilelistとArrayCollectionについて
カスタムのアイテムレンダラを作成する必要があります。
以下を参照してみてください。

http://studynet.blog54.fc2.com/blog-entry-20.html
shin18
投稿日時: 2013-4-4 0:10
やや お馴染みさん
登録日: 2013-4-2
居住地:
投稿: 7
Re: TilelistとArrayCollectionについて
早速の返信ありがとうございます。

リンク先を参考にさせていただき再作成してみましたが、全体枠のみ表示され変数に予め入れておいた内容は表示されませんでした。(文字、画像共出力されず)
定義の仕方がまずいのでしょうか?

以下、変更後のソースです。

【Main.mxml】
<?xml version="1.0" encoding="UTF-8"?>
<mx:WindowedApplication
xmlns:mx="http://www.adobe.com/2006/mxml" xmlns:MyComp="*" title="Main" layout="vertical">

<MyComp:DtoimageModel id="model" />

<mx:Component id="listRenderer">
<mx:VBox width="300" height="280"
paddingBottom="5"
paddingLeft="5"
paddingTop="5"
paddingRight="5"
horizontalAlign="center" >
<mx:Text id="text1" text="{data.model.a}" />
<mx:Image id="image1" width="100" height="140" source="{data.model.b}" />
<mx:Text id="text2" text="{data.model.c}" />
</mx:VBox>
</mx:Component>

<mx:TileList id="Selection" width="100%" height="100%">
dataProvider="{data.model.imgdata}" itemRenderer="{listRenderer}"
</mx:TileList>
</mx:WindowedApplication>


【DtoimageModel.as】
package
{
import Dtoimage;
import mx.collections.ArrayCollection;
[Bindable]
public class DtoimageModel
{
public var imgdata:ArrayCollection;
public function DtoimageModel()
{
var account1:Dtoimage = new Dtoimage("a" , "b" , "c");
account1.fieldA = "GRL_0004.JPG";
account1.fieldB = "file:///D:/testphoto/GRL_0004.JPG";
account1.fieldC = "0";
imgdata = new ArrayCollection([account1]);
}
}
}


【Dtoimage.as】
package
{
[Bindable]
public class Dtoimage
{
public var fieldA:String;
public var fieldB:String;
public var fieldC:String;
public function Dtoimage(a:String,b:String,c:String)
{
fieldA = a;
fieldB = b;
fieldC = c;
}
}
}
Nanoka
投稿日時: 2013-4-5 22:06
超常連さん
登録日: 2009-11-24
居住地:
投稿: 43
Re: TilelistとArrayCollectionについて
以下のようにすればうまくいくけど、どうだろ?

CustomItem.mxml


<?xml version="1.0" encoding="utf-8"?>
<mx:VBox xmlns:mx="http://www.adobe.com/2006/mxml"
    horizontalAlign="center" verticalAlign="middle"
    verticalScrollPolicy="off"
    horizontalScrollPolicy="off"
    width="200" height="200"
    >

    <mx:Script>
        <![CDATA[

            /** 
             * TileListからセットされるデータ
             * ArrayCollection[index]番目のデータ
             */
            override public function set data(value:Object):void {
                super.data = value;
                
                if ( value is ImageDto ) {
                    this.customImage.source = ImageDto(value).url;
                    this.customText.text = ImageDto(value).url;
                } else {}
            }

        ]]>
    </mx:Script>

    <mx:Image id="customImage" width="100" height="100" />
    <mx:Text id="customText" width="100%" />

</mx:VBox>



ImageDto.as

package {

    public class ImageDto {

        public var url:String = null;
        
        public var text:String = null;

    }
}


sample.mxml

<?xml version="1.0" encoding="UTF-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" xmlns:MyComp="*" layout="vertical"
    creationComplete="creationCompleteEventHandler()">

    <mx:Script>
        <![CDATA[

            import mx.collections.ArrayCollection;

            [Bindable]
            public var imageItems:ArrayCollection = new ArrayCollection();

            /** 
             * 生成完了後にアイテムを追加
             */
            protected function creationCompleteEventHandler():void {

                // アイテムレンダラを指定する
                // アイテムレンダラとは、一個のアイテムを表示するコンポーネント
                this.list.itemRenderer = new ClassFactory(CustomItem);

                for ( var ii:int = 0 ; ii < 100 ; ii++ ) {
                    var item:ImageDto = new ImageDto();
                    item.url = "http://www.fxug.net/themes/fxug/images/logo.gif";
                    this.imageItems.addItem( item );
                }

            }
            
        ]]>
    </mx:Script>

    <mx:TileList 
        id="list"
        width="90%" height="90%"
        dataProvider="{this.imageItems}"
        />

</mx:Application>




shin18
投稿日時: 2013-4-9 17:01
やや お馴染みさん
登録日: 2013-4-2
居住地:
投稿: 7
Re: TilelistとArrayCollectionについて
組み込むと上手く動きました。2週間程悩んでいたので大変助かりました。ありがとうございます!
スレッド表示 | 新しいものから 前のトピック | 次のトピック | トップ

投稿するにはまず登録を