/*
* @Descripttion: 循环滚动容器 只支持竖向滚动或横向滚动，
* @version: 1.0.0
* @Author: YeeChan
* @Date: 2020-07-17 10:32:52
*/
import FMTouchMaskView, { SlideDirection, FMTouchEvent } from "./FMTouchMaskView";
import { FMListener, callFM_custom, handleFM_custom } from "../Interface/FMInterface";
import Utilit from "../Util/Utilit";
import FMItemLayout from "./FMItemLayout";
const { ccclass, property, requireComponent, disallowMultiple, menu } = cc._decorator;
@ccclass
// @requireComponent(cc.ScrollView)
@disallowMultiple() //防止多个相同类型（或子类型）的组件被添加到同一个节点
//@menu('FM组件/FMScrollViewLoop')
export default class FMScrollViewLoop extends FMTouchMaskView {
//是否自动移动
@property()
private _isAutoMoveType: boolean = true;
@property({ tooltip: "自动滚动", type: cc.Boolean })
set isAutoMoveType(val: boolean) {
this._isAutoMoveType = val;
}
get isAutoMoveType() { return this._isAutoMoveType; }
//--------------------------------------
//广告标签
protected ad_tag_custom: any;
//更新的回调
protected fmListenerUpdateData_custom: FMListener;
//layout list
protected arrayAliveListLayout_custom: FMItemLayout[] = []
//自由的节点
protected arrayFreeListLayout_custom: FMItemLayout[] = []
//一个屏幕中的layout数量
private viewLayoutNum_custom: number = 0;
//超出的个数
private viewLayoutGapNum_custom: number = 3;
//总共的个数
private viewLayoutSum_custom: number = 0;
//初始的下标
private startIndexItem_custom: number = 0;
//是否可以更新item相关
private isCanUpdateItems_custom: boolean = false;
//点击了 触发停止
private isTouchStop_custom: boolean = false;
//外部需要控制的是否可以update
private _isCanScrollViewLoopUpdate_custom: boolean = true;
protected isAutoMoveWayLeftUp_custom: boolean = true;//是否自动移动往左或上 还是右或下
//自动移动后等待的时间
protected autoMoveWaitTime_custom: number = 60;
//自动移动的一次的距离格子数量 0不启用
protected autoMoveWaitNum_custom: number = 1;
//移动的数据
protected autoMoveSpeed_custom: number = 3;
//
//当次移动的距离大小
private _nextMoveLength_custom: number = 0;
//当下需要等待的时间
private _waitTimeNum_custom: number = 0;
private _moveState_custom: number = 0;//0正常移动 1等待
protected _init_custom(): boolean {
if (super._init_custom()) {
if (this._slideDirection == SlideDirection.HORIZONTAL) {//水平
this.viewLayoutNum_custom = Math.ceil(this.node.width / (this.itemPrefabWidth_custom));
} else if (this._slideDirection == SlideDirection.VERTICAL) {//垂直
this.viewLayoutNum_custom = Math.ceil(this.node.width / (this.itemPrefabHeight_custom));
}
//创建的个数
this.viewLayoutSum_custom = this.viewLayoutNum_custom + this.viewLayoutGapNum_custom * 2
let pos = 0;
for (let index = 0; index < this.viewLayoutSum_custom; index++) {
let layoutScript = this.cloneLayout_custom();
let layout = layoutScript.node;
if (this._slideDirection == SlideDirection.HORIZONTAL) {//水平
layout.x = pos;
layout.y = 0;
pos = pos + layout.width;
} else if (this._slideDirection == SlideDirection.VERTICAL) {//垂直
layout.x = 0;
layout.y = pos;
pos = pos - layout.height
}
this.arrayAliveListLayout_custom.push(layoutScript);
}
this.isCanUpdateItems_custom = true;
return true;
}
return false;
}
/**
* 外部调用
* @param _listener
*/
public setFMListenerUpdateItem_custom(_listener: FMListener) {
this.fmListenerUpdateData_custom = _listener;
}
/**
* 设置自动移动的数据
* @param way 方向
* @param moveWaitNum 移动的格子 0持续
* @param waitTime 移动的格子后停顿的时间 s
* @param speed 速度
*/
public setAutoData_custom(way: number, moveWaitNum?: number, waitTime?: number, speed?: number, bgColor?: string) {
this.isAutoMoveWayLeftUp_custom = way == 0 ? true : false;
this.autoMoveWaitNum_custom = moveWaitNum ? Math.abs(moveWaitNum) : 0;
this.autoMoveWaitTime_custom = waitTime ? Math.abs(waitTime) * 60 : 60;
this.autoMoveSpeed_custom = speed ? Math.abs(speed) : 3;
if (bgColor) {
this.node.color = Utilit.colorHex2Rgb_custom(bgColor);
}
}
/**
* 是否点击了
*/
public isTouchStopView_custom() {
return this.isTouchStop_custom;
}
/**
* 外部控制是否update
*/
public setCanScrollViewLoopUpdate_custom(_update: boolean) {
this._isCanScrollViewLoopUpdate_custom = _update;
}
/**
* 设置广告的自定义标签
* @param tag
*/
public setAdTag_custom(tag: any) {
this.ad_tag_custom = tag;
for (let index = 0; index < this.arrayAliveListLayout_custom.length; index++) {
const element = this.arrayAliveListLayout_custom[index];
element.setAdTag_custom(this.ad_tag_custom);
}
for (let index = 0; index < this.arrayFreeListLayout_custom.length; index++) {
const element = this.arrayFreeListLayout_custom[index];
element.setAdTag_custom(this.ad_tag_custom);
}
}
//外部初始数据
public initUpdateItems_custom() {
this._init_custom();
this.startIndexItem_custom = 0;
if (this._slideDirection == SlideDirection.HORIZONTAL) {//水平
let pos = - this.itemPrefabWidth_custom * 3;
for (let index = 0; index < this.arrayAliveListLayout_custom.length; index++) {
const element = this.arrayAliveListLayout_custom[index];
element.setPointX_custom(pos);
element.setItemIndex_custom(this.startIndexItem_custom + index);
pos = pos + this.itemPrefabWidth_custom
}
} else { //垂直
let pos = this.itemPrefabHeight_custom * 3;
for (let index = 0; index < this.arrayAliveListLayout_custom.length; index++) {
const element = this.arrayAliveListLayout_custom[index];
element.setPointY_custom(pos);
element.setItemIndex_custom(this.startIndexItem_custom + index);
pos = pos - this.itemPrefabHeight_custom
}
}
this._updateNextLengthTime_custom();
}
protected update(dt: number): void {
if (this.isCanUpdateItems_custom && this._isCanScrollViewLoopUpdate_custom) {
this.updateScrollingItems_custom();
if (this.isAutoMoveType == true) {//判断类型是自动移动类型
this._updateAutoMove_custom();
}
}
}
/**
* 更新子节点的数据内容
* @param index 第几个大的
* @param childIndex 第几个小的
*/
protected listenerUpdateInitItem_custom(sum: number) {
if (this.fmListenerUpdateData_custom) {
let data = callFM_custom(this.fmListenerUpdateData_custom, sum);
return data;
}
}
/**
* 自动移动
*/
public _updateAutoMove_custom() {
if (this.isTouchStopView_custom()) {
return;
}
if (this._moveState_custom == 0) {
if (this.isAutoMoveWayLeftUp_custom) {
if (this._slideDirection == SlideDirection.HORIZONTAL) {//水平
this.content_custom.x = this.content_custom.x - this.autoMoveSpeed_custom
} else {
this.content_custom.y = this.content_custom.y + this.autoMoveSpeed_custom
}
} else {
if (this._slideDirection == SlideDirection.HORIZONTAL) {//水平
this.content_custom.x = this.content_custom.x + this.autoMoveSpeed_custom
} else {
this.content_custom.y = this.content_custom.y - this.autoMoveSpeed_custom
}
}
if (this.autoMoveWaitNum_custom > 0) {//0 持续移动
this._nextMoveLength_custom = this._nextMoveLength_custom - this.autoMoveSpeed_custom;
if (this._nextMoveLength_custom <= 0) {
this._moveState_custom = 1;
}
}
} else {
this._waitTimeNum_custom = this._waitTimeNum_custom + 1;
if (this._waitTimeNum_custom >= this.autoMoveWaitTime_custom) {
this._waitTimeNum_custom = 0;
this._updateNextLengthTime_custom();
}
}
}
/**
* 消息
* @param event
*/
protected _dispatchEvent_custom(event: FMTouchEvent) {
if (event == FMTouchEvent.Scrolling) {
//this.updateScrollingItems();
} else if (event == FMTouchEvent.TouchStart) {
this.isTouchStop_custom = true;
} else if (event == FMTouchEvent.TouchEnded) {
this._updateNextLengthTime_custom();
this.isTouchStop_custom = false;
}
}
/**
* 更新下次移动需要的数据
*/
protected _updateNextLengthTime_custom() {
if (this.autoMoveWaitNum_custom > 0) {
if (this._slideDirection == SlideDirection.HORIZONTAL) {//水平
this._nextMoveLength_custom = this.autoMoveWaitNum_custom * this.itemPrefab.data.width
if (this.isAutoMoveWayLeftUp_custom) {
for (let index = 0; index < this.arrayAliveListLayout_custom.length; index++) {
const element = this.arrayAliveListLayout_custom[index];
let vcx = this.content_custom.x + element.node.x;
if (vcx > -element.node.width && vcx < 0) {
this._nextMoveLength_custom = this._nextMoveLength_custom + vcx;
break;
}
}
} else {
for (let index = this.arrayAliveListLayout_custom.length - 1; index >= 0; index--) {
const element = this.arrayAliveListLayout_custom[index];
let vcx = this.content_custom.x + element.node.x;
if (vcx < this.node.width + element.node.width && vcx > this.node.width) {
vcx = vcx - this.node.width;
this._nextMoveLength_custom = this._nextMoveLength_custom - vcx;
break;
}
}
}
} else {//垂直
this._nextMoveLength_custom = this.autoMoveWaitNum_custom * this.itemPrefab.data.height
if (this.isAutoMoveWayLeftUp_custom) {
for (let index = 0; index < this.arrayAliveListLayout_custom.length; index++) {
const element = this.arrayAliveListLayout_custom[index];
let vcy = this.content_custom.y + element.node.y;
if (vcy < element.node.height && vcy > 0) {
this._nextMoveLength_custom = this._nextMoveLength_custom - vcy;
break;
}
}
} else {
for (let index = this.arrayAliveListLayout_custom.length - 1; index >= 0; index--) {
const element = this.arrayAliveListLayout_custom[index];
let vcy = this.content_custom.y + element.node.y - element.node.height;
if (vcy > -(this.node.height + element.node.height) && vcy < -this.node.height) {
vcy = vcy + this.node.height;
this._nextMoveLength_custom = this._nextMoveLength_custom + vcy;
break;
}
}
}
}
}
this._waitTimeNum_custom = 0;
this._moveState_custom = 0;
}
//更新
protected updateScrollingItems_custom() {
let arrayLive: FMItemLayout[] = []
if (this._slideDirection == SlideDirection.HORIZONTAL) {//水平
for (let index = 0; index < this.arrayAliveListLayout_custom.length; index++) {
const element = this.arrayAliveListLayout_custom[index];
if (this.content_custom.x + element.getPointX_custom() < - this.itemPrefabWidth_custom * 3) {//左 超过三个标准 移除
this.addFreeItem_custom(element);
} else if (element.getPointX_custom() + this.content_custom.x > this.node.width + this.itemPrefabWidth_custom * 3) { //右 超过三个标准 移除
this.addFreeItem_custom(element);
} else { //中间区域 激活
arrayLive.push(element);
}
}
if (arrayLive[0].getPointX_custom() + this.content_custom.x > - this.itemPrefabWidth_custom) {//起始的 低于一个标准 创建一个
let element = this.getFreeItem_custom();
element.setPointX_custom(arrayLive[0].getPointX_custom() - this.itemPrefabWidth_custom);
element.setItemIndex_custom(arrayLive[0].getItemIndex_custom() - 1)
arrayLive.splice(0, 0, element);
element.node.active = true;
}
if (arrayLive[arrayLive.length - 1].getPointX_custom() + this.content_custom.x < + this.node.width + this.itemPrefabWidth_custom) {//结尾的 低于一个标准 创建一个
const element = this.getFreeItem_custom()
element.setPointX_custom(arrayLive[arrayLive.length - 1].getPointX_custom() + this.itemPrefabWidth_custom);
element.setItemIndex_custom(arrayLive[arrayLive.length - 1].getItemIndex_custom() + 1)
arrayLive.push(element);
element.node.active = true;
}
} else { //垂直
for (let index = 0; index < this.arrayAliveListLayout_custom.length; index++) {
const element = this.arrayAliveListLayout_custom[index];
if (element.getPointY_custom() + this.content_custom.y > this.itemPrefabHeight_custom * 3) {//上 超过三个标准 移除
this.addFreeItem_custom(element);
} else if (element.getPointY_custom() < -(this.content_custom.y + this.node.height + this.itemPrefabHeight_custom * 3)) { //下 超过三个标准 移除
this.addFreeItem_custom(element);
} else { //中间区域 激活
arrayLive.push(element);
}
}
if (arrayLive[0].getPointY_custom() + this.content_custom.y <= this.itemPrefabHeight_custom) {//起始的 低于一个标准 创建一个
let element = this.getFreeItem_custom();
element.setPointY_custom(arrayLive[0].getPointY_custom() + this.itemPrefabHeight_custom);
element.setItemIndex_custom(arrayLive[0].getItemIndex_custom() - 1)
arrayLive.splice(0, 0, element);
element.node.active = true;
}
if (arrayLive[arrayLive.length - 1].getPointY_custom() >= -(this.content_custom.y + this.node.height + this.itemPrefabHeight_custom)) {//结尾的 低于一个标准 创建一个
const element = this.getFreeItem_custom()
element.setPointY_custom(arrayLive[arrayLive.length - 1].getPointY_custom() - this.itemPrefabHeight_custom);
element.setItemIndex_custom(arrayLive[arrayLive.length - 1].getItemIndex_custom() + 1)
arrayLive.push(element);
element.node.active = true;
}
}
this.arrayAliveListLayout_custom = arrayLive;
}
/**
* 创建一个
*/
private cloneLayout_custom(): FMItemLayout {
let layout = cc.instantiate(this.itemPrefab);
let script = layout.getComponent(FMItemLayout);
script.setAdTag_custom(this.ad_tag_custom)
script.setFMListenerUpdate_custom(handleFM_custom(this.listenerUpdateInitItem_custom, this));
this.content_custom.addChild(layout);
return script;
}
/**
* 获取一个自由节点
*/
private getFreeItem_custom(): FMItemLayout {
let element = this.arrayFreeListLayout_custom.pop()
if (!element) {
element = this.cloneLayout_custom();
}
return element;
}
private addFreeItem_custom(item: FMItemLayout) {
item.node.active = false;
this.arrayFreeListLayout_custom.push(item);
}
}