文档章节

Egret之egret.gui.List的使用教程

flyoahc
 flyoahc
发布于 2015/06/26 10:06
字数 203
阅读 3837
收藏 0

工具:EgretWing

说明:

List                   列表组件

ItemRender       列表Item组件

这里只讲解一下如何绑定数据到List以及对应到ItemRender展示。

/**
 * Created by haocao on 15/6/25.
 */
class  FriendsListCase extends egret.gui.SkinnableComponent{
    public constructor(){
        super();

        this.skinName = skins.scene.FriendsListSkin;
        // 初始化数据
        this.initListData();
    }

    // 绑定界面的List
    public listview:egret.gui.List;

    // 数据Array
    private dataSource:Array<any> = [];

    private initListData():void {
        for (var i:number = 1; i < 50; i++) {
           this.dataSource.push({name: "name"+i,phone:"a"+i,qq:"b"+i});
        }
    }

    public partAdded(partName:string, instance:any):void {
        super.partAdded(partName, instance);
        if (instance == this.listview) {
            // 绑定数据源
            this.listview.dataProvider = new egret.gui.ArrayCollection(this.dataSource);
           
            // 绑定itemview
            this.listview.itemRenderer= new egret.gui.ClassFactory(FriendItemRender);
        }
    }
}
/**
 *
 * @caohao 
 *
 */
class FriendItemRender extends egret.gui.ItemRenderer{
	    
    public lname:egret.gui.Label;
    public lphone:egret.gui.Label;
    public lqq:egret.gui.Label;
    
    public constructor() {
        super();
        // 皮肤名称
        this.skinName = skins.scene.FriendsListItemSkin;
        this.touchChildren = true;
    }
    
    public dataChanged():void{
        // 将数据对应到组件上
        this.lname.text = this.data.name;
        this.lphone.text = this.data.phone;
        this.lqq.text = this.data.qq;
    }
    
}


最终效果图:


参考文章:

http://bbs.egret-labs.org/thread-1055-1-1.html

© 著作权归作者所有

共有 人打赏支持
flyoahc
粉丝 12
博文 37
码字总数 15728
作品 0
南京
程序员
私信 提问
关于Egret Engine 2.5.3引入GUI模块问题记录

基本环境: Egret Engine 2.5.3 Egret Wing 2.1 使用EgretWing创建Game项目,然后需要引入GUI模块。 具体引入模块教程可参考官方教程: http://edn.egret.com/cn/index.php/article/index/id...

flyoahc
2015/10/28
0
0
微信小游戏教程(三) 新手教程

开发环境 Egret Launcher 1.0.32 以上版本(包括1.0.32) 白鹭引擎 5.1.2 以上版本(包括 5.1.2) 准备最新版的微信开发工具。下载地址:https://mp.weixin.qq.com/debug/wxagame/dev/devtoo...

u010392459
2018/01/12
0
0
白鹭引擎 5.3.0 正式发布,支持 3D 游戏开发

一直关注白鹭引擎的童靴会发现,今天白鹭引擎先后完成了白鹭引擎5.2.0、白鹭引擎5.3.0两个版本的更迭,在周三发布《白鹭引擎稳定版即将发布,后续路线图同步公开》文中,我们已详细介绍了白鹭...

白鹭科技
2018/05/25
1K
2
HTML5游戏开发(四):飞机大战之显示场景和元素

《HTML5游戏开发》系列文章的目的有:一、以最低的成本去入门egret小项目开发,官方的教程一直都是面向中重型;二、egret可以很轻量;三、egret相比PIXI.js和spritejs有他的优势所在;四、学...

wildfirecode13
2018/10/29
0
0
关于egret引用第三方库的笔记

关于egret引用第三方库的笔记 当前我需要使用一个第三方的js库(umeng的js统计): 我创建个UmengAnalysis.js文件,代码如下: /** * Created by haocao on 15/6/25. */ var umeng;(function...

flyoahc
2015/06/25
0
0

没有更多内容

加载失败,请刷新页面

加载更多

漏洞防御与修复工作

漏洞管理工作是企业安全建设必不可少的一环,在风险管理工作中,漏洞管理能够防患于未然,企业对漏洞管理有着广泛的基础建设和实践经验。但随着攻防技术的发展,传统漏洞管理的安全技术和管理...

linuxprobe16
25分钟前
0
0
MicroPython技术及应用前景

1 Micropython技术是什么? MicroPython极精简高效的实现了Python3语言。它包含Python标准库的一小部分,能在单片机和受限环境中运行。 1.1 MicroPython发展 由剑桥大学的理论物理学家乔治....

bodasisiter
31分钟前
0
0
跟我学Spring Cloud(Finchley版)-13-通用方式使用Hystrix

本节详细讲解使用Hystrix的通用方式。 简介 Hystrix是由Netflix开源的一个延迟和容错库,用于隔离访问远程系统、服务或者第三方库,防止级联失败,从而提升系统的可用性与容错性。Hystrix主要...

周立_ITMuch
40分钟前
0
0
🛠️Hanjst/汉吉斯特更新加JavaScript运行时优化等

这是 Hanjst/汉吉斯特 发布以来的首个主要升级更新版本。这次的主要升级更新的内容包括移除HTML Comments注释行, 优化在 Hanjst include模板文件时的JavaScript运行时环境。 Hanjst 在设计和...

wadelau
今天
2
0
OSChina 周六乱弹 —— 舔狗是没有好下场的

Osc乱弹歌单(2019)请戳(这里) 【今日歌曲】 @我没有抓狂 :#今天听什么# #今天听这个# 分享 Nirvana 的歌曲《Smells Like Teen Spi...》 《Smells Like Teen Spi...》- Nirvana 手机党少...

小小编辑
今天
508
14

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部