使用ItemRenderer为DropDownList定义下拉选项

最新推荐文章于 2018-05-20 22:06:37 发布

原创最新推荐文章于 2018-05-20 22:06:37 发布 · 3.8k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#library #application #encoding #layout #电话

Flex 专栏收录该内容

6 篇文章

订阅专栏

本文介绍如何使用Flex框架中的DropDownList组件并自定义其ItemRenderer来展示更丰富的项目信息，通过具体代码示例展示了如何加载数据及设置ItemRenderer。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

首先新建一个ItemRenderer组件

<?xml version="1.0" encoding="utf-8"?> <s:ItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:mx="library://ns.adobe.com/flex/mx" width="100" height="62"> <s:layout> <s:VerticalLayout/> </s:layout> <fx:Declarations>  </fx:Declarations> <s:Label x="0" y="0" text="姓名{data.name}"/> <s:Label x="0" y="0" text="电话{data.phone}"/> <s:Label x="0" y="0" text="邮件{data.email}"/> <mx:HRule width="100%"/> </s:ItemRenderer>

然后再DropDownList的itemRenderer属性中指向这个组件

<?xml version="1.0" encoding="utf-8"?> <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600"> <s:layout> <s:BasicLayout/> </s:layout> <fx:Declarations> <s:XMLListCollection id="eList" > <fx:XMLList> <employee> <name>刘德华</name> <phone>555-219-2270</phone> <email>liudehua@qq.com</email> </employee> <employee> <name>张曼玉</name> <phone>555-219-2012</phone> <email>zhangmanyu@qq.com</email> </employee> <employee> <name>郭富城</name> <phone>555-219-2012</phone> <email>guofucheng@qq.com</email> </employee> <employee> <name>赵薇</name> <phone>555-219-2000</phone> <email>zhaowei@qq.com</email> </employee> </fx:XMLList> </s:XMLListCollection> </fx:Declarations> <s:DropDownList id="ddlist" x="83" y="46" dataProvider="{eList}" labelField="name" selectedIndex="1" itemRenderer="employeeItem" width="300"></s:DropDownList> </s:Application>