project_ios/assets/Scripts/Main/qipan_shop_view.ts

import { _decorator, Component, Node, Prefab, Tween, UITransform, Sprite, Color } from 'cc';
import { Holder } from '../adapter/abstract/Holder';
import { ScrollAdapter } from '../adapter/abstract/ScrollAdapter';
import { View } from '../adapter/abstract/View';
import { ContentType, ReleaseState } from '../adapter/define/enum';
import { IElement } from '../adapter/define/interface';
import { ReleaseEvent, ReleaseManager } from '../adapter/manager/ReleaseManager';
import ItemDataConfig, { itemData } from '../config/ItemDataConfig';
import { GameMng } from '../GameMng';
import { shop_qipan_page } from './shop_qipan_page';
const { ccclass, property } = _decorator;
@ccclass('qipan_shop_view')
export class qipan_shop_view  extends ScrollAdapter<itemData[]> {

    @property(Prefab) shopPrefab: Prefab = null

    @property(UITransform) header: UITransform = null

    @property(Sprite) loading: Sprite = null

    @property(UITransform) foot: UITransform = null

    @property(Sprite) foot_loading: Sprite = null

    @property(Prefab) item_prefab: Prefab = null

    @property({ type: ContentType }) private _contentType: ContentType = ContentType.shop
    @property({ type: ContentType }) public get contentType() { return this._contentType }
    public set contentType(value: ContentType) {
        if (value == this._contentType) return
        this._contentType = value
    }

    private _headerTween: Tween<any>
    private _loadTween: Tween<any>

    private _footTween: Tween<any>
    private _loadFootTween: Tween<any>

    private _isHeaderPlay = false
    private _isFootPlay = false

    public qipan_list_data = []

    public cur_page = 0;

    start() {
        this.initView();
    }
    initView(){
        this.releaseManager.on(ReleaseManager.Event.ON_PULL_UP, this.onPullUp, this)
        this.releaseManager.on(ReleaseManager.Event.ON_PULL_DOWN, this.onPullDown, this)
        this._headerTween = new Tween(this.header).to(0.518, {
            height: this.releaseManager.top * this.mainAxisSize
        }, { easing: "elasticOut" })
        this._loadTween = new Tween(this.loading.node).by(1, {
            angle: -360
        }).union().repeatForever()

        this._footTween = new Tween(this.foot).to(0.518, {
            height: this.releaseManager.top * this.mainAxisSize
        }, { easing: "elasticOut" })

        this._loadFootTween = new Tween(this.foot_loading.node).by(1, {
            angle: -360
        }).union().repeatForever()
        if(this._contentType===ContentType.bag){
            this.qipan_list_data.push(GameMng.getBagQiPanList())
         }else if(this._contentType===ContentType.shop){
            this.qipan_list_data = ItemDataConfig.Instance.getShopQipanList()
         }
     
        this.init_shop_item()
        //this.viewManager.on(ViewManager.Event.ON_MAGNETIC, this._onMagnetic, this)
    }

    init_shop_item(){
        var list = []
        if(this._contentType===ContentType.bag){
            list.push(this.qipan_list_data[0])
        }else{
            let count = (this.cur_page)===(this.qipan_list_data.length-1)?1:3
            for (let index = 0; index < count; index++) {
                 list.push(this.qipan_list_data[(count-1)-index])
            }
            this.cur_page=2;
        }
        this.modelManager.clear()
        this.modelManager.insert(list)
        this.scrollManager.scrollToFooter(0)
    }
    async  onPullUp(event: ReleaseEvent) {
        if (event.state == ReleaseState.RELEASE) {
            if (this._isFootPlay) {
                this._loadFootTween.start()
                // 等待并锁定头部
                event.wait()
                // 加载历史记录
                var list = await this.loadMore()
                // 插入数据
                this.modelManager.insert(list,0)
                // 释放解锁头部
                this.scheduleOnce(() => {
                    event.release()
                })
                this._loadFootTween.stop()
            }
        }
        var progress = event.progress
        if (event.state == ReleaseState.WAIT) {
            progress = 0.8
        }
        if (progress >= 0.8) {
            if (!this._isFootPlay) {
                this._footTween = new Tween(this.foot).to(0.518, {
                    height: this.releaseManager.bottom * this.mainAxisSize
                }, { easing: "elasticOut" })
                this._footTween.start()
                this._isFootPlay = true
            }
        } else {
            this._footTween.stop()
            this._isFootPlay = false
            this.foot.height = event.offset
            var color = new Color()
            color.set(this.foot_loading.color)
            color.a = 255 * Math.min(progress, 1)
            this.foot_loading.color = color
            // var y = 70 - 40 * progress
            // this.loading.node.setPosition(0, Math.max(y, 0))
        }
        this.foot_loading.node.angle = -360 * event.progress
    }

    async onPullDown(event: ReleaseEvent) {
        if (event.state == ReleaseState.RELEASE) {
            if (this._isHeaderPlay) {
                this._loadTween.start()
               // this.modelManager.clear()
                // 等待并锁定头部
                event.wait()
                // 加载历史记录
                //var list = await this.reLoad()
                this.scrollToHeader()
                // 插入数据
              //  this.modelManager.insert(list,0)
                // 释放解锁头部
                this.scheduleOnce(() => {
                    event.release()
                })
                this._loadTween.stop()
            }
        }

        var progress = event.progress
        if (event.state == ReleaseState.WAIT) {
            progress = 0.8
        }
        if (progress >= 0.8) {
            if (!this._isHeaderPlay) {
                this._headerTween = new Tween(this.header).to(0.518, {
                    height: this.releaseManager.top * this.mainAxisSize
                }, { easing: "elasticOut" })
                this._headerTween.start()
                this._isHeaderPlay = true
            }
        } else {
            this._headerTween.stop()
            this._isHeaderPlay = false
            this.header.height = event.offset
            var color = new Color()
            color.set(this.loading.color)
            color.a = 255 * Math.min(progress, 1)
            this.loading.color = color
            // var y = 70 - 40 * progress
            // this.loading.node.setPosition(0, Math.max(y, 0))
        }
        this.loading.node.angle = -360 * event.progress
    }
    reLoad(): Promise<itemData[]> {
        return new Promise((resolve, reject) => {
            var list = []
            this.scheduleOnce(() => {
                this.init_shop_item()
                resolve(list)
            }, 1)
        })
    }
    loadMore(): Promise<itemData[]> {
        return new Promise((resolve, reject) => {
            this.cur_page++;
            if(this.cur_page>=this.qipan_list_data.length){
                this.scheduleOnce(() => {
                    resolve([])
                }, 0)
            }else{
                var list = []
                let count = (this.cur_page)>=(this.qipan_list_data.length-1)?1:2
                for (let index = 0; index < count; index++) {
                     list.push(this.qipan_list_data[this.cur_page+(count-1-index)])
                }
                this.cur_page+=(count-1)
                this.scheduleOnce(() => {
                    resolve(list)
                }, 1)
            }
         
        })
    }


    scrollToHeader() {
        this.scrollManager.scrollToFooter(1)
    }
    public getPrefab(data: itemData[]): Node | Prefab {
    
        return this.shopPrefab

    }
    public getHolder(node: Node, code: string): Holder<itemData[]> {
        return new myHolder(node, code, this)
    }
    public getView(): View<itemData[]> {
        return new myView(this)
    }
    public initElement(element: IElement, data: any): void {
    }
}

class myView extends View<itemData[], qipan_shop_view> {

    protected onVisible(): void {
    }
    protected onDisable(): void {
    }
}
class myHolder extends Holder<itemData[], qipan_shop_view>{
    private _shopItem: shop_qipan_page = null
    protected onCreated(): void {
        this._shopItem = this.node.getComponent(shop_qipan_page)
    }
    protected onVisible(): void {
        console.log("onVisible",this.data)
        this._shopItem.show(this,this.adapter.item_prefab,this.data,this.adapter.contentType)
    }
    protected onDisable(): void {
        this._shopItem.hide()
    }

}