文档章节

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

flyoahc
 flyoahc
发布于 2015/06/26 10:06
字数 203
阅读 3234
收藏 0
点赞 0
评论 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
01/12
0
0
白鹭引擎 5.3.0 正式发布,支持 3D 游戏开发

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

白鹭科技
05/25
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
HTML5 游戏引擎深度测评

最近看到网上一篇文章,标题叫做《2016年 最火的 15 款 HTML5 游戏引擎》。目前针对HTML5游戏的解决方案已经非常多,但谁好谁差却没有对比性资料。特意花了几天时间,针对文章中出现的12款免...

memda
2016/04/15
4.7K
8
Egret Engine 3.0.0 发布,HTML5 游戏开发框架

Egret Engine 3.0.0 发布!更新时间:2015年12月25日 概述 Egret Engine 3.0 包含了白鹭时代研发的遵循HTML5标准的2D引擎及全新打造的3D引擎,它解决了HTML5性能问题及碎片化问题,灵活地满足...

oschina
2016/01/12
3.6K
5
HTML5 游戏开发框架--Egret

Egret Framework是一款使用JavaScript(TypeScript)编写的HTML5开源免费游戏框架。Egret Framework的核心定位是开放,高效,优雅。基于它,你可以快速轻松地构建属于自己的HTML5移动游戏。 Eg...

红薯
2014/03/26
31.5K
3
一键安装即可开发移动游戏?移动游戏引擎Egret发布一键安装版

免费开源的移动游戏引擎Egret日前正式发布Egret 游戏引擎一键安装版,开发者一次安装即可使用Egret快速创建HTML5类型的移动游戏。 Egret是一家专注于为移动游戏开发者提供技术一站式行业解决...

nicos
2014/09/30
1K
0
白鹭引擎 5.1.2 发布 完善对微信小游戏支持

新年伊始,白鹭科技于1月2日正式发布白鹭引擎(Egret Engine)5.1.2,本次版本是针对在17年12月份发布的白鹭引擎5.1.1版本的一次功能迭代。更新后白鹭引擎完善了对微信小游戏支持,并引入了 ...

白鹭科技
01/08
2.4K
7
Egret之JSZip高级应用:压缩JS

本片讲解Egret使用JSZip解析加压的js代码,然后将其还原成可执行的js代码。 一 , 先将egret库打包 : ①:在网站根目录建一个egret文件夹,在其中放入类库 ②:将egret文件夹打包成egret.z...

Aonaufly
2017/10/06
0
0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

python以太坊类库web3.py概览

python通过web3.py库与以太坊交互共同入口是web3对象。web3对象提供API接口,python开发应用与以太坊进行交互如钱包创建、支付、转账等连接JSON-RPC服务器进行。 Providers提供者 Providers使...

智能合约
3分钟前
0
0
【Android学习笔记】设置App启动页

先将启动页放到项目资源中,图片一般是1080*1920的jpg。 新建一个activity,如图: 创建成功之后,打开刚刚创建的activity,来进行代码的编写: >>>阅读全文

全部原谅
5分钟前
0
0
什么是React-redux、为什么使用React-redux、怎么使用React-redux

1、什么是React-redux React-redux是用于连接React和Redux的 2、为什么使用React-redux 使用React-redux可以使redux部分代码更简洁更明了,比如组建中需要使用到的数据都在mapStateToProps方...

kimyeongnam
7分钟前
0
0
Spring核心——Stereotype组件与Bean扫描

在注解自动装载中介绍了通过注解(Annotation)自动向Bean中注入其他Bean的方法,本篇将介绍通过注解(Annotation)向容器添加Bean的方法。 Spring的核心容器提供了@Component和@Bean注解来标...

随风溜达的向日葵
7分钟前
0
0
利用世界杯,读懂 Python 装饰器

Python 装饰器是在面试过程高频被问到的问题,装饰器也是一个非常好用的特性, 熟练掌握装饰器会让你的编程思路更加宽广,程序也更加 pythonic。 今天就结合最近的世界杯带大家理解下装饰器。...

猫咪编程
11分钟前
0
0
flink fold example

flink fold例子 import org.apache.flink.api.common.functions.*;import org.apache.flink.streaming.api.datastream.DataStream;import org.apache.flink.streaming.api.environment.S......

coord
12分钟前
0
0
c++ qt 组播总结

每个人都有不同的认知规律和习惯, 有的人喜欢搞一套严密的大理论, 论述起来滔滔不绝, 不管自己懂不懂, 反正读者/听者是没搞懂。 有的人喜欢从实践出发, 没看到代码, 不运行一下, 不看...

backtrackx
16分钟前
0
0
Sublime text2安装json格式化插件SublimePrettyJson[Windows]

一、下载SublimePrettyJson插件包 https://github.com/dzhibas/SublimePrettyJson 二、将下载的文件解压放到在package目录下面 C:\Users\lucky\AppData\Roaming\Sublime Text 3\Packages 每个......

lazy~
16分钟前
0
0
安装vue-cli 报4058错误

1. 4058是网络代理错误。 安装淘宝源修改一下就可以了: npm --registry https://registry.npm.taobao.org info underscore 改为cnpm执行: cnpm install --global vue-cli 安装成功: 试试版...

MrBoyce
18分钟前
0
0
CPU飙升分析

1、top -----看具体的进程 2、top -H -p pid ------该进程的线程 3、printf 0x%x 15248 ------将线程改为16进制 4、jstack 进程...

北极之北
20分钟前
1
0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

返回顶部
顶部