0

我试图通过使用一个名为TwoLabelCell扩展的类创建两个标签标签字段来创建一个简单的两个标签列表,AlternatingCellRenderer如下所示:

package views
{
    import flash.text.TextFormat;

    import qnx.fuse.ui.listClasses.AlternatingCellRenderer;
    import qnx.fuse.ui.text.Label;

    public class TwoLabelCell extends AlternatingCellRenderer {
        private var description:Label;
        private var labelFormat:TextFormat;
        private var text:String;

        public function TwoLabelCell(labelText:String) {
            this.text = labelText;
        }

        override protected function init():void {
            super.init();

            labelFormat = new TextFormat();
            labelFormat.color = 0x777777;
            labelFormat.size = 17;

            description = new Label();
            description.x = 17;
            description.y = 33;
            description.format = labelFormat;
            description.text = text;

            this.addChild(description);
        }
    }
}

请记住,当时这只是一个测试,所以我只使用一个标签(在我弄清楚这个问题后,我将添加另一个并使用相同的逻辑)。这里的主要思想是,当我调用它时,它将设置text变量,该变量将用于在创建列表时更改列表中标签的文本。现在,这里是主应用程序文件:

package {
    import flash.display.Sprite;

    import qnx.fuse.ui.events.ListEvent;
    import qnx.fuse.ui.listClasses.List;
    import qnx.fuse.ui.listClasses.ListSelectionMode;
    import qnx.fuse.ui.listClasses.ScrollDirection;
    import qnx.ui.data.DataProvider;

    import views.TwoLabelCell;

    [SWF(height="600", width="1024", frameRate="30", backgroundColor="#FFFFFF")]
    public class PackTrack extends Sprite {
        private var packList:List;

        public function PackTrack() {
            super();

            initializeUI();
        }

        private function initializeUI():void {
            packList = new List();
            packList.setPosition(0, 0);
            packList.width = 310;
            packList.height = 400;
            packList.rowHeight = 50;
            packList.selectionMode = ListSelectionMode.SINGLE;
            packList.scrollDirection = ScrollDirection.VERTICAL;

            var arrMonth:Array=[];
            arrMonth.push({label: "January"});
            arrMonth.push({label: "February"});
            arrMonth.push({label: "March"});
            arrMonth.push({label: "April"});
            arrMonth.push({label: "May"});
            arrMonth.push({label: "June"});
            arrMonth.push({label: "July"});
            arrMonth.push({label: "August"});
            arrMonth.push({label: "September"});
            arrMonth.push({label: "October"});
            arrMonth.push({label: "November"});
            arrMonth.push({label: "December"});

            packList.dataProvider = new DataProvider(arrMonth);
            packList.cellRenderer = TwoLabelCell("Testing Label");

            packList.addEventListener(ListEvent.ITEM_CLICKED, onListClick);

            this.addChild(packList);
        }

        private function onListClick(event:ListEvent):void {
            trace("Item clicked: " + event.data.label);
            trace("Index clicked: " + event.index);
        }
    }
}

当我尝试运行时,我收到此错误:

TypeError: Error #1034: Type Coercion failed: cannot convert "Testing Label" to views.TwoLabelCell.
    at PackTrack/initializeUI()[/Users/Nathan/Documents/Adobe Flash Builder 4.6/AIRTest/src/PackTrack.as:46]
    at PackTrack()[/Users/Nathan/Documents/Adobe Flash Builder 4.6/AIRTest/src/PackTrack.as:19]

关于如何解决这个问题的任何想法?

PS:我正在学习 Flex(来自 Java)

4

1 回答 1

4

直接回答你的问题:你得到一个类转换错误,因为你试图将一个 String 转换为一个 TwoLabelCell at packList.cellRenderer = TwoLabelCell("Testing Label")。所以我猜你只是忘记了new关键字。

我可以告诉您来自 Java 背景:该代码看起来非常 Swingy ;)
所以我想我会向您展示如何以 Flex 方式执行此操作。我不知道您使用的这些 Blackberry 类,所以我必须坚持使用普通的旧 Flex 来演示它。

创建具有可绑定属性的模型类:

public class Pack {     
    [Bindable] public var label:String;
    [Bindable] public var description:String;       
}

现在创建一个 ItemRenderer 类来呈现列表中的数据,我们称之为PackRenderer.mxml

<s:ItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009" 
                xmlns:s="library://ns.adobe.com/flex/spark" 
                autoDrawBackground="true"
                height="50">

    <s:layout>
        <s:HorizontalLayout verticalAlign="middle" />
    </s:layout>

    <s:Label id="labelDisplay" />
    <s:Label text="{data.description}" color="0x777777" fontSize="17" />

</s:ItemRenderer>

请注意,我将其设置height为与您使用50的效果相同。rowHeightItemRenderer的data属性是它将表示的 Pack 模型实例。
带有 id 的标签labelDisplay将自动获取Flex 框架data.label分配给其属性的值。text对于另一个标签,我使用数据绑定 ( {}) 将模型description属性绑定到标签的text属性。

使用此 itemrenderer 创建列表:

<fx:Script>
    <![CDATA[
        protected function handleItemSelected():void {
            trace("Item selected: " + list.selectedItem.label);
            trace("Index selected: " + list.selectedIndex);
        }
    ]]>
</fx:Script>

<fx:Declarations>
    <s:ArrayCollection id="dp">
        <so:Pack label="Item A" description="description A" />
        <so:Pack label="Item B" description="description B" />
        <so:Pack label="Item C" description="description C" />
    </s:ArrayCollection>
</fx:Declarations>

<s:List id="list" dataProvider="{dp}" width="310" height="400"
        itemRenderer="net.riastar.PackItemRenderer"
        change="handleItemSelected()" />

我在这里创建了内联数据,但当然这个 ArrayCollection 也可以来自服务器。
List的布局默认是VerticalLayout,所以我就不定义了。
Spark List 没有itemClick事件处理程序,因此我使用change处理程序,只要列表的选定索引/项目发生更改,就会执行该处理程序。

于 2012-06-15T10:52:29.080 回答