170 lines
3.7 KiB
JavaScript
170 lines
3.7 KiB
JavaScript
|
/******************************************************************
|
||
|
|
* Copyright(C) 2019 - 2020 Nx Studio
|
||
|
|
*
|
||
|
|
* NX UI插件 -- 标签切换组
|
||
|
|
*
|
||
|
|
* 2018.05.18
|
||
|
|
******************************************************************/
|
||
|
|
|
||
|
|
const FrontIndex = 99;
|
||
|
|
|
||
|
|
cc.Class( {
|
||
|
|
|
||
|
|
extends: cc.Component,
|
||
|
|
|
||
|
|
properties: {
|
||
|
|
|
||
|
|
togIndex: {
|
||
|
|
default : 0,
|
||
|
|
displayName : "当前选中"
|
||
|
|
},
|
||
|
|
|
||
|
|
togRoot: {
|
||
|
|
default : null,
|
||
|
|
type : cc.Node,
|
||
|
|
displayName : "标签列表(空自己)"
|
||
|
|
},
|
||
|
|
|
||
|
|
togFront: {
|
||
|
|
default : false,
|
||
|
|
displayName : "自动前置"
|
||
|
|
},
|
||
|
|
|
||
|
|
},
|
||
|
|
|
||
|
|
// 编辑器特性
|
||
|
|
editor: {
|
||
|
|
|
||
|
|
// 允许当前组件在编辑器模式下运行
|
||
|
|
executeInEditMode: false,
|
||
|
|
|
||
|
|
// requireComponent 参数用来指定当前组件的依赖组件
|
||
|
|
requireComponent: null,
|
||
|
|
|
||
|
|
// 当本组件添加到节点上后，禁止同类型（含子类）的组件再添加到同一个节点，防止逻辑发生冲突
|
||
|
|
disallowMultiple: true,
|
||
|
|
|
||
|
|
// menu 用来将当前组件添加到组件菜单中，方便用户查找
|
||
|
|
menu: "Nx/组件|标签组",
|
||
|
|
|
||
|
|
},
|
||
|
|
|
||
|
|
// 构造
|
||
|
|
ctor: function() {
|
||
|
|
|
||
|
|
// 确保顺去
|
||
|
|
this.togs = [];
|
||
|
|
|
||
|
|
// 相关回调
|
||
|
|
this.preTog = null; // 切换预判外设方法(返回:bool)
|
||
|
|
this.posTog = null; // 切换完毕通知(参数:index)
|
||
|
|
|
||
|
|
},
|
||
|
|
|
||
|
|
// 初始化
|
||
|
|
onLoad: function() {
|
||
|
|
|
||
|
|
// 确定标签列表根节点
|
||
|
|
if( !this.togRoot ) {
|
||
|
|
this.togRoot = this.node;
|
||
|
|
}
|
||
|
|
|
||
|
|
// 重建标签结构
|
||
|
|
this.rebuildTogs();
|
||
|
|
|
||
|
|
// 标签显示切换
|
||
|
|
this._freshTogShow();
|
||
|
|
|
||
|
|
},
|
||
|
|
|
||
|
|
// 销毁
|
||
|
|
onDestroy: function() {
|
||
|
|
|
||
|
|
},
|
||
|
|
|
||
|
|
// 重建标签结构
|
||
|
|
rebuildTogs: function() {
|
||
|
|
|
||
|
|
this.togs = [];
|
||
|
|
|
||
|
|
// 合法结构检测&默认设置
|
||
|
|
const chds = this.togRoot.children;
|
||
|
|
for( let i in chds ) {
|
||
|
|
|
||
|
|
let tog = chds[i];
|
||
|
|
let on = tog.getChildByName( "on" );
|
||
|
|
let off = tog.getChildByName( "off" );
|
||
|
|
if( !on || !off ) {
|
||
|
|
nx.error( "[NxFxTogs]无效的标签结构on/off" );
|
||
|
|
return;
|
||
|
|
}
|
||
|
|
|
||
|
|
on.active = false;
|
||
|
|
|
||
|
|
// 打标记
|
||
|
|
off.togIndex = parseInt( i );
|
||
|
|
this.togs.push( tog );
|
||
|
|
}
|
||
|
|
|
||
|
|
},
|
||
|
|
|
||
|
|
// 主动切换
|
||
|
|
togTo: function( _index, _force = false ) {
|
||
|
|
|
||
|
|
// 重复
|
||
|
|
if( _index == this.togIndex && !_force ) {
|
||
|
|
return;
|
||
|
|
}
|
||
|
|
|
||
|
|
// 切换触发
|
||
|
|
this.togIndex = _index;
|
||
|
|
this._freshTogShow();
|
||
|
|
|
||
|
|
},
|
||
|
|
|
||
|
|
// 标签点击
|
||
|
|
onTouchTog: function( _off ) {
|
||
|
|
|
||
|
|
// 合法节点
|
||
|
|
if( !_off || !nx.dt.numPositive( _off.togIndex ) ) {
|
||
|
|
nx.error( "[NxFxTogs]无效OFF节点!" );
|
||
|
|
return;
|
||
|
|
}
|
||
|
|
|
||
|
|
// 切换预筛选
|
||
|
|
if( nx.dt.fnGood( this.preTog ) ) {
|
||
|
|
if( !this.preTog( _off.togIndex ) ) {
|
||
|
|
return;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
// 切换
|
||
|
|
this.togTo( _off.togIndex );
|
||
|
|
|
||
|
|
// 通告
|
||
|
|
if( nx.dt.fnGood( this.posTog ) ) {
|
||
|
|
nx.dt.trycatch( () => {
|
||
|
|
this.posTog( this.togIndex );
|
||
|
|
} )
|
||
|
|
}
|
||
|
|
|
||
|
|
},
|
||
|
|
|
||
|
|
// 标签显示切换
|
||
|
|
_freshTogShow: function() {
|
||
|
|
|
||
|
|
let onidx = this.togIndex;
|
||
|
|
for( let i in this.togs ) {
|
||
|
|
|
||
|
|
nx.gui.setActive( this.togs[i], "on", i == onidx );
|
||
|
|
nx.gui.setActive( this.togs[i], "off", i != onidx );
|
||
|
|
|
||
|
|
if( this.togFront ) {
|
||
|
|
this.togs[i].zIndex = ( i == onidx ) ? FrontIndex : 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
}
|
||
|
|
},
|
||
|
|
|
||
|
|
} );
|