封装一个选项卡的UI,用来应付游戏中各种需要选项卡的界面。

例如背包,背包界面的选项卡可以切换装备、物品、符文、宝箱。

下图方法的实现参考:EUI ViewStack实现选项卡组件

假如在主页HomeScene中有一个选项卡UI,如下图:

TabView简单实现代码

/**
* 选项卡UI
* @author chenkai 2018/8/3
*/
class TabView{
private radioGroup:eui.Group; //单选按钮
private viewStack:eui.ViewStack; //层叠容器 public constructor() { } public init(radioGroup:eui.Group, viewStack:eui.ViewStack){
//保存
this.radioGroup = radioGroup;
this.viewStack = viewStack; //判断是否存在按钮
let radioBtn:eui.RadioButton = radioGroup.getChildAt(0) as eui.RadioButton;
if(radioBtn){
//给radioBtn赋值
let len = radioGroup.numChildren;
for(let i=0;i<len;i++){
(radioGroup.getChildAt(i) as eui.RadioButton).value = i;
}
//监听radioBtn切换
radioBtn.group.addEventListener(eui.UIEvent.CHANGE, this.onChange ,this);
//默认选择第一项
radioBtn.selected = true;
}
} //radioBtn切换时,切换viewStack
private onChange(e:eui.UIEvent){
let radioGroup:eui.RadioButtonGroup = e.target;
this.viewStack.selectedIndex = radioGroup.selectedValue;
}
}

  

在HomeScene里,创建TabView。

class HomeScene extends eui.Component{
private radioGroup:eui.Group;
private viewStack:eui.ViewStack; private tabView:TabView; public constructor() {
super();
this.skinName = "HomeSceneSkin";
} protected childrenCreated(){
         //创建TabView
this.tabView = new TabView();
//将HomeScene里的单选按钮和层叠容器,赋值给TabView进行初始化
this.tabView.init(this.radioGroup, this.viewStack);
} }

  

选项卡完成

EUI ViewStack实现选项卡组件 (封装了一个UI类)的更多相关文章

  1. EUI ViewStack实现选项卡组件

    一  TabBar+ViewStack实现 这个教程确实没看懂...贼麻烦... 二 RadioButton+ViewStack 在exml中拖动组件RadioButton和ViewStack 设置e ...

  2. SpringMVC 中,当前台传入多个参数时,可将参数封装成一个bean类

    在实际业务场景中,当前台通过 url 向后台传送多个参数时,可以将参数封装成一个bean类,在bean类中对各个参数进行非空,默认值等的设置. 前台 url ,想后台传送两个参数,userName 和 ...

  3. 个人封装的一个Camera类

    好久不写博客了,代码写了不少,但大多数都是拿来主义,要不是网上,要不就是自己曾经的代码拼装. 新工作是搞Android开发的,近期任务要求我封装一个Carmera类,自己也认为还是封装以后方便使用,弄 ...

  4. 将CRUD封装到一个工具类中

    package org.zln.hibernate.utils; import org.hibernate.Session; import org.hibernate.SessionFactory; ...

  5. Directx11学习笔记【二十一】 封装键盘鼠标响应类

    原文:Directx11学习笔记[二十一] 封装键盘鼠标响应类 摘要: 本文由zhangbaochong原创,转载请注明出处:http://www.cnblogs.com/zhangbaochong/ ...

  6. 自己封装的一个LoadRes组件

    这两周一直太忙,没有好好处理上上上周遇到的一个让我加班到凌晨的问题,这个问题是判断flash的加载. 之前的思路是让flash的人在制作flash的时候,加入了一个回调方法,该方法再会回调我页面的方法 ...

  7. 自己封装的一个JS分享组件

    因为工作的需求之前也封装过一个JS分享插件,集成了我们公司常用的几个分享平台. 但是总感觉之前的结构上很不理想,样式,行为揉成一起,心里想的做的完美,实际上总是很多的偏差,所以这次我对其进行了改版. ...

  8. Linux组件封装(五)一个生产者消费者问题示例

    生产者消费者问题是计算机中一类重要的模型,主要描述的是:生产者往缓冲区中放入产品.消费者取走产品.生产者和消费者指的可以是线程也可以是进程. 生产者消费者问题的难点在于: 为了缓冲区数据的安全性,一次 ...

  9. 看JQ时代过来的前端,如何转换思路用Vue打造选项卡组件

    前言 在Vue还未流行的时候,我们都是用JQuery来封装一个选项卡插件,如今Vue当道,让我们一起来看看从JQ时代过来的前端是如何转换思路,用数据驱动DOM的思想打造一个Vue选项卡组件. 接下来, ...

随机推荐

  1. jsp连接mysql----------第一篇技术类文章

    今天做作业连了一天的mysql. 最后我痛定思痛,决定从0開始学习jsp.省的又面临不会的局面. 忙活了一晚上.最终把数据库连接上了,只是.好伤心啊,我连个数据库都这么墨迹. . . <%@ p ...

  2. php脚本超时 结束执行代码

    函数:stream_context_create ,file_get_content 创建并返回一个文本数据流并应用各种选项,可用于fopen(),file_get_contents()等过程的超时设 ...

  3. 使用 resizableImageWithCapInsets 方法实现可伸缩图片

    之前介绍过通过 stretchableImageWithLeftCapWidth:topCapHeight: 方法来实现可伸缩图片: 可看这篇随笔:使用 stretchableImageWithLef ...

  4. UNIX环境编程学习笔记(6)——文件I/O之判断文件类型

    lienhua342014-09-01 1 文件类型 我们平时最常接触的文件类型有普通文件(regular file)和目录(di-rectory file),但是 UNIX 系统提供了多种文件类型: ...

  5. 【调研】在总体为n的情况下,多少样本有代表性?

    见这里: http://www.raosoft.com/samplesize.html

  6. level 6 - unit3 -- 非限制性定语从句

    非限制性定语从句 例子1 he has a son who is a fireman who 引导一个定语从句. who 是修饰前面的son. 翻译的意思:他有一个消防员的儿子 he has a so ...

  7. CSS 文本缩进,行间距

    文本缩进:text-indent:2.0em; 行间距:line-height:1.5em;

  8. make screenshot at Eclipse

    In Eclipse, from the Window menu, select Open Perspective > Other... > DDMS. Select the Kindle ...

  9. [转] 关于QT的系统总结

    出处:http://www.cnblogs.com/wangqiguo/p/4625611.html 阅读目录 编译环境与开发流程 QT项目的构成及原理 QT中的布局 QT中的通用控件 QVarian ...

  10. mongodb的一些性能管理工具

    1.db.serverStatus()//查看实例运行状态,例如查看当前的连接数之类的 2. mms云平台 //由10gen提供的云管理平台//mms=mongo manage service htt ...