egret中EUI的使用

首先,使用EUI必须前置技能树egret和wing,这里的eui专直egret中的eui,同时要求会使用wing,这是一款专门开发egret的IDE,很多操作只能在wing中完成。然后,这篇文章主要介绍的场景包括:调用eui控件,自定义eui控件,ts类中调用eui控件,自定义eui组件中调用eui控件等...

  • 这里分eui控件和eui组件两个概念
    • eui控件:eui已经定义好的现成控件,包括:按钮、选择器、文字、图片等
    • 自定义eui组件:包括eui的exml文件和ts类两个文件组成,需要自己编写,比较自由。

如何调用eui控件

1、exml文件调用,如图:

调用eui图片控件

2、ts类调用,如图:

ts类调用

3、在wing中直接拖拽

选中控件直接拖拽到exml文件中,此时exml文件必须在设计状态

如何控制eui控件

1、exml文件调用和wing拖拽的效果是一样的

打开exml文件,切换到源码模式

给eui控件加上id

然后打开ts文件
在partAdded这个方法中直接调用对应的id实例

这样有个问题是,组件操作必须在partAdded这个生命周期中进行,这个生命周期表示组件已全部加载完成;而且由于这个实例在类中并没有声明,IDE会报错,但是不影响使用。

如何使用自定义eui组件

修改默认eui组件,官方文档表述为:eui组件添加皮肤

  • step1:复制默认eui组件的exml文件
  • step2: 切换exml文件为设计模式
  • step3-1: 创建一个ts文件,继承对应的eui组件,例如:MyButton extends EUI.Button
  • step3-2:或者new myButton = new EUI.Button();
  • step4: this.skinName = 刚才定义好的exml文件路径;
  • step5: 这个时候wing会直接添加定义好的组件,验证方法:查看manifest文件 或者 点开自定义组件,查看自己定义好的组件是否在里面


    自定义组件

如何在自定义组件中绑定数据

eui也提供了数据绑定的方法,而且写法也很复杂,不建议使用

<ul> <%for(data each collection)%> <li><a href="{data.link}">{data.label}</a></li> <%end for%> </ul>
//先创建一个数组
var sourceArr:any[] = [];
for (var i:number = 1; i < 5; i++) {
    sourceArr.push({label:"item"+i});
}
//用ArrayCollection包装
var myCollection:eui.ArrayCollection = new eui.ArrayCollection(sourceArr);
//然后创建DataGroup的实例,并设置数据源(属性名称是dataProvider):
var dataGroup:eui.DataGroup = new eui.DataGroup();
dataGroup.dataProvider = myCollection;
dataGroup.percentWidth = 100;
dataGroup.percentHeight = 100;
this.addChild(dataGroup);

我只找到了数组数据容器的绑定办法,没有找到对象的,在API中找到一个ICollection,可能是这个,然鹅我也没打算用。

eui方便了游戏场景布局,可以快速开发,挺好用的,本来手动布局需要几天时间,用eui一下午就可以布完。最后吐槽一下wing,IDE的功能很好用,但是bug太多了,资源显示有bug,自定义组件的显示有bug,开发体验很好,在ide中预览效果很糟,虽然不影响最后的编译结果。

推荐阅读更多精彩内容

  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 164,058评论 24 696
  • ¥开启¥ 【iAPP实现进入界面执行逐一显】 〖2017-08-25 15:22:14〗 《//首先开一个线程,因...
    小菜c阅读 5,140评论 0 17
  • 发现 关注 消息 iOS 第三方库、插件、知名博客总结 作者大灰狼的小绵羊哥哥关注 2017.06.26 09:4...
    肇东周阅读 8,709评论 4 47
  • 好句:1、这是典型的恒河鳄,皮肤呈暗橄榄色,粗糙的就像了就像披了一层磷甲,最大的一条约有五米长,露出一口锯齿似的利...
    阮大东阅读 145评论 0 0
  • 第一天来到简书,是朋友推荐的。内心柔软敏感的女孩,思绪总是万千。喜欢文字,喜欢文字里感人的故事。喜欢音乐,喜欢音...
    浮世清欢L阅读 140评论 0 0
  • 继续写点西游记的东西,没什么文笔章法可言,想到哪写到哪。 孙悟空学道归来救了他一些小猴子暂且不提,有两件事特别重要...
    摔杯为号阅读 359评论 2 1
  • 人一任性,来了场说走就走的旅行,天气太热,小伙伴们半路都退缺了,只有我和老公点点继续前行。谁知下山的时候,天气也很...
    行走者阅读 66评论 0 0