PageViewIndicatorEx.ts
3.1 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
import { DummyPageView, DummySpriteFrame } from "../../common/CCDummyObjects";
const { ccclass, property } = cc._decorator;
@ccclass
export default class PageViewIndicatorEx extends cc.Component {
@property(cc.SpriteFrame)
unselectSpriteFrame: cc.SpriteFrame = DummySpriteFrame;
@property(cc.SpriteFrame)
selectSpriteFrame: cc.SpriteFrame = DummySpriteFrame;
@property(cc.PageView)
handlerPageView: cc.PageView = DummyPageView;
@property
touchEnable: boolean = false;
@property
curPageSelectIndex: number = 0;
@property
cellWidth: number = 20;
@property
cellHeight: number = 20;
@property
autoRefresh: boolean = false;
@property
autoRefreshDuration: number = 5000;
_nodeReady: boolean = false;
_indicatorArr: cc.Node[] = [];
_timeTicker: number = -1;
onLoad() {
if (!this.handlerPageView) {
return;
}
this._createIndicator();
this.selectIndex(this.curPageSelectIndex);
}
_createIndicator() {
let pagesNum: number = this.handlerPageView.getPages().length;
this.node.removeAllChildren(true);
for (let i = 0; i < pagesNum; i++) {
let node = new cc.Node();
let sprite: cc.Sprite = node.addComponent(cc.Sprite);
sprite.spriteFrame = this.unselectSpriteFrame;
sprite.sizeMode = cc.Sprite.SizeMode.CUSTOM;
node.width = this.cellWidth;
node.height = this.cellHeight;
if (this.touchEnable) {
node.off('click');
node.addComponent(cc.Button);
node.on('click', () => {
this.onIndicatorClick(i);
});
}
this.node.addChild(node);
this._indicatorArr.push(node);
}
this._nodeReady = true;
}
onIndicatorClick = (index: number) => {
if (!this.handlerPageView) {
return;
}
this.handlerPageView.setCurrentPageIndex(index);
}
selectIndex = (index: number) => {
for (let i = 0; i < this._indicatorArr.length; i++) {
let spr = this._indicatorArr[i].getComponent(cc.Sprite);
spr.spriteFrame = i === index ? this.selectSpriteFrame : this.unselectSpriteFrame;
}
this.curPageSelectIndex = index;
}
start() {
if (this.autoRefresh) {
if (this._timeTicker !== (-1)) {
clearInterval(this._timeTicker);
}
this._timeTicker = setInterval(() => {
this.onIndicatorClick((this.curPageSelectIndex + 1) % this.handlerPageView.getPages().length);
}, this.autoRefreshDuration);
}
}
handlerPageViewChangeIndex() {
if (!this.handlerPageView) {
return;
}
let curIndex: number = this.handlerPageView.getCurrentPageIndex();
if (curIndex === this.curPageSelectIndex) {
return;
}
this.selectIndex(curIndex);
}
update(dt) {
if (!this._nodeReady) {
return;
}
this.handlerPageViewChangeIndex();
}
}