文档章节

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

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

码上生花,ECharts 作品展示赛正式启动!>>>

工具: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游戏入门之学习资源篇

最近因需要,入手H5游戏。 写游戏当然需要有引擎。 H5游戏开发:游戏引擎入门推荐 如何选择 H5 游戏引擎 白鹭引擎和layabox哪个好用,哪个技术更成熟 ? LayaBox 与 Egret 选择哪个呢? Egre...

osc_7zyqbo9l
2019/02/28
27
0
Html5 Egret游戏开发 成语大挑战(一)开篇

最近接触了Egret白鹭引擎,感觉非常好用,提供了各种各样的开发工具让开发者和设计者更加便捷,并且基于typescript语言开发省去了很多学习成本,对于我们这种掉微软坑许久的童鞋来说,确实很...

Nowpaper 十五英寸的世界
2016/01/21
0
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
207
0
【咸鱼教程】Egret可长按识别二维码(精确位置和大小)

教程目录 一 实现原理 二 实现过程 三 Demo下载 本教程是在Egret中实现长按识别的二维码,并可以精确定位二维码的位置和大小,支持横屏和竖屏。 一 实现原理 微信中长按识别二维码,需要长按...

osc_t6kfzq66
2018/06/24
3
0
Particle 粒子效果使用(适配微信小游戏,particle is not defined)

在微信小游戏中使用粒子效果 参考: 1. 粒子库下载地址 2. 粒子官方使用教程 3. 水友解决微信小游戏particle is not defined 一、下载第三方库 Git地址:https://github.com/egret-labs/egr...

osc_28q3csny
2018/08/24
1
0

没有更多内容

加载失败,请刷新页面

加载更多

mybatis之foreach用法

在做mybatis的mapper.xml文件的时候,我们时常用到这样的情况:动态生成sql语句的查询条件,这个时候我们就可以用mybatis的foreach了 foreach元素的属性主要有item,index,collection,ope...

osc_0hs26yvj
16分钟前
3
0
css笔记整理

0索引 1html标签块 2选择器 3CSS的引入方式: 4CSS浮动 :流式布局 5盒子模型 6案例一网站首页 7案例二网站注册页面 1html标签块 div标签:默认占- -行,自动换行 span标签:内容显示在同- -行 <!...

osc_3grma05a
17分钟前
5
0
js获取图片的EXIF,解决图片旋转问题

相信大家在做项目的时候会遇到在canvas里加入图片时,图片发生90°,180°的旋转。当时的你肯定时懵逼的,为毛。 其实这就是图片的EXIF搞的鬼。 什么是EXIF 简单来说,Exif 信息就是由数码相...

osc_ytmgp8ea
18分钟前
0
0
StringUtils.isEmpty()和isBlank()的区别

一、概述 两种判断字符串是否为空的用法都是在程序开发时常用的,相信不少同学在这种简单的问题上也吃过亏,到底有什么区别,使用有什么讲究,带着问题往下看。 二、jar包 commons-lang3-3....

osc_1mofhvr6
20分钟前
11
0
H5嵌入钉钉

1,需要在项目种引入钉钉官方的js <script type="text/javascript" src="http://g.alicdn.com/dingding/dingtalk-jsapi/2.3.0/dingtalk.open.js" ></script> 或者npm 也可以的 2,钉钉......

osc_ucqb2u3q
21分钟前
7
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部