我正在尝试通过使用名为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)
答案 0 :(得分:4)
直接回答你的问题:你得到一个分类错误,因为你试图将一个String转换为packList.cellRenderer = TwoLabelCell("Testing Label")
的TwoLabelCell。所以我猜您忘记了new
关键字。
我可以告诉你来自Java背景:代码看起来非常Swingy;)
所以我想我会告诉你我将如何以Flex的方式做到这一点。我不知道你使用的这些Blackberry类,所以我必须坚持使用普通的Flex来演示它。
使用可绑定属性创建模型类:
public class Pack {
[Bindable] public var label:String;
[Bindable] public var description:String;
}
现在创建一个ItemRenderer类来渲染List中的数据,让我们称之为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
,其效果与您使用的rowHeight
相同。 ItemRenderer的data
属性是它将代表的Pack模型实例
标识labelDisplay
的标签将自动获取Flex框架为其data.label
属性分配的text
值。对于另一个Label,我使用数据绑定({}
)将模型description
属性绑定到Label的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列表没有itemClick
事件处理程序,因此我使用change
处理程序,只要List的所选索引/项目发生更改,就会执行该处理程序。