列表显示多行Adobe Flex / Actionscript

时间:2011-03-30 14:42:14

标签: flex actionscript adobe

我目前正在Adobe Flex / Actionscript中为个人搜索应用创建一个列表。目前,该列表显示了1行文字:

    <fx:Script>
    <![CDATA[
        import model.PersonSummary;
        import mx.collections.ArrayCollection;
        import spark.events.IndexChangeEvent;

        [Bindable]
        public var listOfPeople:ArrayCollection;  

        public function populate():void{

            listOfPeople = new ArrayCollection(String(data).split("\n"));
        }

    ]]>
</fx:Script>
<fx:Declarations>
    <!-- Place non-visual elements (e.g., services, value objects) here -->
</fx:Declarations>
<s:List width="100%" id="results" dataProvider="{listOfPeople}" change="clickPerson(event)">
</s:List>

所以listOfPeople只是一个字符串列表...我曾尝试在每个字符串中添加“\ n”以有效地添加行和更多细节但是“\ n”之后的任何内容都没有显示在屏幕上,任何想法?

由于 菲尔

例如:


PERSON1

年龄


PERSON2

年龄


3 个答案:

答案 0 :(得分:1)

我会使用项呈示器。查看Adobe's docs即可开始使用。

示例项目渲染器:

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

    <mx:Label text="{data.name}"/>
    <mx:Label text="{data.age}"/>
    <mx:Label text="{data.sex}"/>

</mx:VBox>

答案 1 :(得分:1)

首先,Spark List组件支持具有默认项目渲染器的多行行。以下代码完美无缺:

<?xml version="1.0" encoding="utf-8"?>
<s:Application creationComplete="populate()" minHeight="600" minWidth="955" xmlns:fx="http://ns.adobe.com/mxml/2009"
    xmlns:mx="library://ns.adobe.com/flex/mx" xmlns:s="library://ns.adobe.com/flex/spark">
    <fx:Script>
    <![CDATA[
        import mx.collections.ArrayCollection;
        [Bindable]
        public var listOfPeople:ArrayCollection;

        public function populate():void
        {
            var testData:String = "Test\ntest,Test\ntest\ntest";
            listOfPeople = new ArrayCollection(testData.split(","));
        }
    ]]>
    </fx:Script>
    <s:List dataProvider="{listOfPeople}" horizontalCenter="0" verticalCenter="0" />
</s:Application>

但是如果你想要更复杂的List的行,你可以实现自己的项目渲染器,因为Jason指出除了有效的Flex版本。正如我从你的代码片段中看到的那样,你使用的是Flex 4.x,但Jason的样本适用于Flex 3.x.因此,您需要使用the following documentation实现自定义渲染器。

然后,您可以在自定义渲染器中放置任意数量的标签或其他控件以显示自定义数据。

答案 2 :(得分:0)

这个适用于我

<fx:Script>
        <![CDATA[
            import mx.collections.ArrayCollection;

            [Bindable]private var people:ArrayCollection
            private var string:String = "test,test,test";

            private function init():void
            {
                people = new ArrayCollection(String(string).split(','));

            }
        ]]>
    </fx:Script>

    <s:List id="list" dataProvider="{people}" />