开发者

Flex-list: Icons above label fields, centered

开发者 https://www.devze.com 2023-03-27 11:15 出处:网络
I finally managed to make my list render horizontally but the problem is this: When I run the app I see the list like this:

I finally managed to make my list render horizontally but the problem is this:

When I run the app I see the list like this:

Flex-list: Icons above label fields, centered

Don't mind the label fields, the data is gathered from a testing XML

The thing is, I want the list to show the icon above the label field (the iMac image above label 'file1') and The both to be centered.

Here is the list code in my HomeView:

<s:List id="tripList" left="0" right="0" top="0" bottom="0"
        change="tripList_changeHandler(event)" dataProvider="{data}" horizontalCenter="0"
        labelField="title" verticalCenter="0">
    <s:layout>
        <s:TileLayout/>
    </s:layout>
    <s:itemRenderer>
        <fx:Component>
            <s:IconItemRenderer iconFunction="getPhotoURL" iconWidth="128" iconHeight="128" height="150" width="379" verticalAlign="top" textAlign="center">
                <fx:Script>
                    <![CDATA[
                        protected function getPhotoURL(item:Object):String
                        {
                            return "images/mine/" + item.image
                        }
                    ]]>
                </fx:Script>
            </s:IconIte开发者_运维技巧mRenderer>
        </fx:Component>
    </s:itemRenderer>
</s:List>

Thx for any answer!


something like this...

<s:List id="tripList" left="0" right="0" top="0" bottom="0"
            horizontalCenter="0"
            labelField="title" verticalCenter="0">
        <s:layout>
            <s:TileLayout/>
        </s:layout>
        <s:dataProvider>
            <s:ArrayList>
                <fx:Object title="item 1" icon="adobe-logo.jpg" />
                <fx:Object title="item 2" icon="adobe-logo.jpg" />
                <fx:Object title="item 3" icon="adobe-logo.jpg" />
                <fx:Object title="item 4" icon="adobe-logo.jpg" />
                <fx:Object title="item 5" icon="adobe-logo.jpg" />
                <fx:Object title="item 6" icon="adobe-logo.jpg" />
            </s:ArrayList>
        </s:dataProvider>
        <s:itemRenderer>
            <fx:Component>
                <s:ItemRenderer>
                    <s:VGroup horizontalAlign="center">
                        <s:Image source="{data.icon}" />
                        <s:Label text="{data.title}" />
                    </s:VGroup>
                </s:ItemRenderer>
            </fx:Component>
        </s:itemRenderer>
    </s:List>
0

精彩评论

暂无评论...
验证码 换一张
取 消