208 lines
6.6 KiB
Plaintext
208 lines
6.6 KiB
Plaintext
|
|
|||
|
|
import { _decorator, Button, Component, Enum, Node, Sprite, SpriteFrame, tween, UITransform, v3, Vec3 } from "cc";
|
|||
|
|
import li_Component from "./li_Component";
|
|||
|
|
import ScrollViewList from "./ScrollViewList";
|
|||
|
|
|
|||
|
|
const { ccclass, property, disallowMultiple, menu, executionOrder } = _decorator;
|
|||
|
|
|
|||
|
|
enum SelectedType {
|
|||
|
|
NONE = 0,
|
|||
|
|
TOGGLE = 1,
|
|||
|
|
SWITCH = 2,
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
//列表Item组件 1、此组件须配合List组件使用。（配套的配套的..）
|
|||
|
|
@ccclass
|
|||
|
|
@disallowMultiple()
|
|||
|
|
@menu('自定义控件/ScrollviewList Item')
|
|||
|
|
@executionOrder(-1001) //先于List
|
|||
|
|
export default class ScrollviewListItem extends li_Component {
|
|||
|
|
//选择模式
|
|||
|
|
@property({
|
|||
|
|
type: Enum(SelectedType),
|
|||
|
|
tooltip: '选择模式'
|
|||
|
|
})
|
|||
|
|
selectedMode: SelectedType = SelectedType.NONE;
|
|||
|
|
//被选标志
|
|||
|
|
@property({
|
|||
|
|
type: Node, tooltip: '被选标志',
|
|||
|
|
visible() { return this.selectedMode > SelectedType.NONE; }
|
|||
|
|
})
|
|||
|
|
selectedFlag: Node = null;
|
|||
|
|
//被选择的SpriteFrame
|
|||
|
|
@property({
|
|||
|
|
type: SpriteFrame, tooltip: '被选择的SpriteFrame',
|
|||
|
|
visible() { return this.selectedMode == SelectedType.SWITCH; }
|
|||
|
|
})
|
|||
|
|
selectedSpriteFrame: SpriteFrame = null;
|
|||
|
|
//未被选择的SpriteFrame
|
|||
|
|
_unselectedSpriteFrame: SpriteFrame = null;
|
|||
|
|
//自适应尺寸
|
|||
|
|
@property({
|
|||
|
|
tooltip: '自适应尺寸（宽或高）',
|
|||
|
|
})
|
|||
|
|
adaptiveSize: boolean = false;
|
|||
|
|
//选择
|
|||
|
|
_selected: boolean = false;
|
|||
|
|
set selected(val: boolean) {
|
|||
|
|
this._selected = val;
|
|||
|
|
if (!this.selectedFlag)
|
|||
|
|
return;
|
|||
|
|
switch (this.selectedMode) {
|
|||
|
|
case SelectedType.TOGGLE:
|
|||
|
|
this.selectedFlag.active = val;
|
|||
|
|
break;
|
|||
|
|
case SelectedType.SWITCH:
|
|||
|
|
let sp: Sprite = this.selectedFlag.getComponent(Sprite);
|
|||
|
|
if (sp)
|
|||
|
|
sp.spriteFrame = val ? this.selectedSpriteFrame : this._unselectedSpriteFrame;
|
|||
|
|
break;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
get selected() {
|
|||
|
|
return this._selected;
|
|||
|
|
}
|
|||
|
|
//按钮组件
|
|||
|
|
private _btnCom: any;
|
|||
|
|
get btnCom() {
|
|||
|
|
if (!this._btnCom)
|
|||
|
|
this._btnCom = this.node.getComponent(Button);
|
|||
|
|
return this._btnCom;
|
|||
|
|
}
|
|||
|
|
//依赖的List组件
|
|||
|
|
public list: ScrollViewList;
|
|||
|
|
//是否已经注册过事件
|
|||
|
|
private _eventReg = false;
|
|||
|
|
//序列id
|
|||
|
|
public listId: number;
|
|||
|
|
|
|||
|
|
private uitf: UITransform;
|
|||
|
|
|
|||
|
|
onLoad() {
|
|||
|
|
//有选择模式时，保存相应的东西
|
|||
|
|
if (this.selectedMode == SelectedType.SWITCH) {
|
|||
|
|
let com: Sprite = this.selectedFlag.getComponent(Sprite);
|
|||
|
|
this._unselectedSpriteFrame = com.spriteFrame;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
this.uitf = this.node.getComponent(UITransform);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
onNodeDestroy() {
|
|||
|
|
let t: any = this;
|
|||
|
|
t.node.off(Node.EventType.SIZE_CHANGED, t._onSizeChange, t);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
_registerEvent() {
|
|||
|
|
let t: any = this;
|
|||
|
|
if (!t._eventReg) {
|
|||
|
|
if (t.btnCom && t.list.selectedMode > 0) {
|
|||
|
|
t.btnCom.clickEvents.unshift(t.createEvt(t, 'onClickThis'));
|
|||
|
|
}
|
|||
|
|
if (t.adaptiveSize) {
|
|||
|
|
t.node.on(Node.EventType.SIZE_CHANGED, t._onSizeChange, t);
|
|||
|
|
}
|
|||
|
|
t._eventReg = true;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
_onSizeChange() {
|
|||
|
|
this.list._onItemAdaptive(this.node);
|
|||
|
|
}
|
|||
|
|
/**
|
|||
|
|
* 创建事件
|
|||
|
|
* @param {Component} component 组件脚本
|
|||
|
|
* @param {string} handlerName 触发函数名称
|
|||
|
|
* @param {Node} node 组件所在node（不传的情况下取component.node）
|
|||
|
|
* @returns Component.EventHandler
|
|||
|
|
*/
|
|||
|
|
createEvt(component: Component, handlerName: string, node: Node = null) {
|
|||
|
|
if (!component || !component.isValid)
|
|||
|
|
return;//有些异步加载的，节点以及销毁了。
|
|||
|
|
component['comName'] = component['comName'] || component.name.match(/\<(.*?)\>/g).pop().replace(/\<|>/g, '');
|
|||
|
|
let evt = new Component.EventHandler();
|
|||
|
|
evt.target = node || component.node;
|
|||
|
|
evt.component = component['comName'];
|
|||
|
|
evt.handler = handlerName;
|
|||
|
|
return evt;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
showAni(aniType: number, callFunc: Function, del: boolean) {
|
|||
|
|
let num = 0;
|
|||
|
|
let act = tween(this.node);
|
|||
|
|
// let acts: any[];
|
|||
|
|
switch (aniType) {
|
|||
|
|
case 0: //向上消失
|
|||
|
|
// acts = [
|
|||
|
|
// scaleTo(.2, .7),
|
|||
|
|
// moveBy(.3, 0, this.node.height * 2),
|
|||
|
|
// ];
|
|||
|
|
act.to(0.2, {scale: v3(0.7, 0.7, 0.7)})
|
|||
|
|
act.by(0.3, {position: v3(0, this.uitf.height*2)})
|
|||
|
|
num=2;
|
|||
|
|
break;
|
|||
|
|
case 1: //向右消失
|
|||
|
|
// acts = [
|
|||
|
|
// scaleTo(.2, .7),
|
|||
|
|
// moveBy(.3, this.node.width * 2, 0),
|
|||
|
|
// ];
|
|||
|
|
act.to(0.2, {scale: v3(0.7, 0.7, 0.7)})
|
|||
|
|
act.by(0.3, {position: v3(this.uitf.width*2, 0)})
|
|||
|
|
num=2;
|
|||
|
|
break;
|
|||
|
|
case 2: //向下消失
|
|||
|
|
// acts = [
|
|||
|
|
// scaleTo(.2, .7),
|
|||
|
|
// moveBy(.3, 0, this.node.height * -2),
|
|||
|
|
// ];
|
|||
|
|
act.to(0.2, {scale: v3(0.7, 0.7, 0.7)})
|
|||
|
|
act.by(0.3, {position: v3(0, this.uitf.height*-2)})
|
|||
|
|
num=2;
|
|||
|
|
break;
|
|||
|
|
case 3: //向左消失
|
|||
|
|
// acts = [
|
|||
|
|
// cc.scaleTo(.2, .7),
|
|||
|
|
// cc.moveBy(.3, this.node.width * -2, 0),
|
|||
|
|
// ];
|
|||
|
|
act.to(0.2, {scale: v3(0.7, 0.7, 0.7)})
|
|||
|
|
act.by(0.3, {position: v3(this.uitf.width*-2, 0)})
|
|||
|
|
num=2;
|
|||
|
|
break;
|
|||
|
|
default: //默认：缩小消失
|
|||
|
|
// acts = [
|
|||
|
|
// cc.scaleTo(.3, .1),
|
|||
|
|
// ];
|
|||
|
|
act.to(0.3, {scale: v3(0.1, 0.1, 0.1)})
|
|||
|
|
num=1;
|
|||
|
|
break;
|
|||
|
|
}
|
|||
|
|
if (callFunc || del) {
|
|||
|
|
act.call(()=>{
|
|||
|
|
if (del) {
|
|||
|
|
this.list._delSingleItem(this.node);
|
|||
|
|
for (let n: number = this.list.displayData.length - 1; n >= 0; n--) {
|
|||
|
|
if (this.list.displayData[n].id == this.listId) {
|
|||
|
|
this.list.displayData.splice(n, 1);
|
|||
|
|
break;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
callFunc();
|
|||
|
|
})
|
|||
|
|
num += 1;
|
|||
|
|
}
|
|||
|
|
if (num > 0){
|
|||
|
|
act.start()
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
onClickThis() {
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
function scaleTo(arg0: number, arg1: number): any {
|
|||
|
|
throw new Error("Function not implemented.");
|
|||
|
|
}
|
|||
|
|
|