添加

mk_framework/assets/script/game/component/PageView.ts

@@ -0,0 +1,85 @@
+
+const { ccclass, property } = cc._decorator;
+/**
+ * 翻页组件类
+ * - 简单版 无动态加载功能
+ * - 已知bug，请注意规避：开启回弹后，首尾界面回弹没有考虑 setCurrentPageIndex 导致在setCurrentPageIndex设置之后的位置开始回弹。解决方法：关闭回弹
+ * @author 薛鸿潇
+ */
+@ccclass
+export default class PageView extends cc.Component {
+
+    /** 翻页组件 */
+    private comp_page_view: cc.PageView = null;
+    /** item 容器 */
+    private arr_node_item: Array<cc.Node> = [];
+    onLoad() {
+        this.comp_page_view = this.node.getComponent(cc.PageView);
+        this.node.on('ui-init', this.init, this);// 初始化列表
+        this.node.on('ui-clearItem', this.clearItem, this);// 清除页面
+        this.node.on('ui-backCurPage', this.backCurPage, this);// 返回到当前Index对应的界面【滑动后禁用滑动功能，再打开滑动功能，翻页组件不会自动返回，调用此接口】
+    }
+
+    start() {
+
+    }
+    /**
+     * 初始化列表
+     * @param list_data 数据列表
+     * @param page_item item预制体
+     */
+    private init(list_data: Array<any>, page_item: cc.Prefab, init_index: number = 0) {
+        const data_count = list_data.length;
+        if (!data_count) {
+            // 刷新时，数据列表是空的
+            const node_count = this.arr_node_item.length;
+            for (let i = 0; i < node_count; i++) {
+                this.comp_page_view.removePageAtIndex(i);
+                this.arr_node_item.splice(i, 1);
+            }
+            return;
+        }
+        for (let i = 0; i < data_count; i++) {
+            let node_item = this.arr_node_item[i];
+            if (!node_item) {
+                node_item = cc.instantiate(page_item);
+                this.arr_node_item.push(node_item);
+            }
+            // node_item.parent = this.content;
+            this.comp_page_view.addPage(node_item);
+            node_item.getComponent(node_item.name).setItemData(list_data[i]);
+        }
+        this.comp_page_view.setCurrentPageIndex(init_index);
+        // 清理多出来的item
+        const node_count = this.arr_node_item.length;
+        if (data_count > node_count) {
+            for (let i = data_count; i < node_count; i++) {
+                this.comp_page_view.removePageAtIndex(i);
+                this.arr_node_item.splice(i, 1);
+            }
+        }
+    }
+    /**
+     * 返回当前页
+     */
+    private backCurPage() {
+        let index = this.comp_page_view.getCurrentPageIndex();
+        this.comp_page_view.setCurrentPageIndex(index);
+    }
+    /** 清理子节点 
+     * - need_destroy 销毁
+    */
+    private clearItem(need_destroy: boolean = false) {
+        // this.comp_page_view.removeAllPages();
+        // const n_count = this.arr_node_item.length;
+        // for (let i = 0; i < n_count; i++) {
+        //     if (need_destroy) {
+        //         let node_end = this.arr_node_item.pop();
+        //         node_end.destroy();
+        //     } else {
+        //         this.arr_node_item[i].removeFromParent();
+        //     }
+        // }
+    }
+    // update (dt) {}
+}

mk_framework/assets/script/game/component/PageView.ts.meta

@@ -0,0 +1,9 @@
+{
+  "ver": "1.0.8",
+  "uuid": "bf07ca26-2764-4a4c-8abe-9ee317678fe6",
+  "isPlugin": false,
+  "loadPluginInWeb": true,
+  "loadPluginInNative": true,
+  "loadPluginInEditor": false,
+  "subMetas": {}
+}

mk_framework/assets/script/game/component/TabSwitching.ts

@@ -0,0 +1,88 @@
+
+const { ccclass, property } = cc._decorator;
+
+@ccclass
+/** 页签切换组件 
+ * - 只对样式进行处理
+ * - 可注册其他回调，通过'comp-cur-click'事件
+ * - 可初始化页签，通过'comp-cur-tab'事件
+ * @author 薛鸿潇
+*/
+export default class TabSwitching extends cc.Component {
+    /** 页签组 */
+    @property({ type: cc.Button, displayName: '页签组', tooltip: '按钮target需要有值' })
+    private arr_btn_tab: cc.Button[] = [];
+    /** 页签数量 */
+    private tab_count = 0;
+    /** 界面点击页签的回调 */
+    private func = null;
+    onLoad() {
+        this.tab_count = this.arr_btn_tab.length;
+        this.initTabState();
+        this.initBtnEvent();
+        /** 页签切换 */
+        this.node.on('comp-cur-tab', this.curTabType, this);
+        // 注册界面触摸回调。参数1：函数，参数2：target
+        this.node.on('comp-cur-click', this.onTabBtnClick, this);
+
+    }
+
+    start() {
+    }
+    /**
+     * 初始化按钮事件
+     */
+    private initBtnEvent() {
+        for (let i = 0; i < this.tab_count; i++) {
+            this.arr_btn_tab[i].node.on('click', this.onClockTabCall, this);
+        }
+    }
+    /**
+     * 页签切换回调
+     * @param comp_btn 按钮组件
+     * @param params 参数
+     */
+    private onClockTabCall(comp_btn, params?) {
+        this.initTabState();
+
+        let btn_node = comp_btn.node;
+        let img_style_1 = btn_node.getChildByName('img_style_1');
+        img_style_1.active = true;
+
+        let img_style_2 = btn_node.getChildByName('img_style_2');
+        img_style_2.active = false;
+        this.func && this.func(comp_btn, params);
+    }
+    /**
+     * ui界面注册的按钮事件
+     * @param func 事件
+     * @param target 目标类
+     */
+    private onTabBtnClick(func: Function, target) {
+        this.func = func.bind(target);
+    }
+    /**
+     * 初始化页签状态
+     */
+    private initTabState() {
+        for (let i = 0; i < this.tab_count; i++) {
+            let img_style_1 = this.arr_btn_tab[i].node.getChildByName('img_style_1');
+            img_style_1.active = false;
+            let img_style_2 = this.arr_btn_tab[i].node.getChildByName('img_style_2');
+            img_style_2.active = true;
+        }
+    }
+    /**
+     * 切换到指定页签
+     * @param tab 页签下标
+     * @returns 
+     */
+    private curTabType(tab: number) {
+        for (let i = 0; i < this.tab_count; i++) {
+            if (i === tab) {
+                this.onClockTabCall(this.arr_btn_tab[i], i);
+                return;
+            }
+        }
+    }
+}

mk_framework/assets/script/game/component/TabSwitching.ts.meta

@@ -0,0 +1,9 @@
+{
+  "ver": "1.0.8",
+  "uuid": "3087d1f9-8168-427d-9364-b2a0330bec26",
+  "isPlugin": false,
+  "loadPluginInWeb": true,
+  "loadPluginInNative": true,
+  "loadPluginInEditor": false,
+  "subMetas": {}
+}

mk_framework/assets/script/game/component/TableViewUtils.ts → mk_framework/assets/script/game/component/TableView.ts

@@ -10,7 +10,13 @@ const { ccclass, property } = cc._decorator;
  * @author 薛鸿潇
 */
 @ccclass
-export default class TableViewUtils extends cc.Component {
+export default class TableView extends cc.Component {
+
+    @property({ type: [cc.Prefab] })
+    private pre_item: cc.Prefab[] = [];
+    /** 间距 */
+    @property({ displayName: '间距' })
+    private itemInterval: number = 0;
 
     /** 数据 */
     private itemData: any = null;
@@ -18,8 +24,6 @@ export default class TableViewUtils extends cc.Component {
     private scrollView: cc.ScrollView = null;
     /** item预制体组 */
     private item: Array<any> = null;
-    /** 间隔 */
-    private itemInterval: number = 0;
     /** 滑动列表的内容节点 */
     private content: any = null;
     /** 列表高 */
@@ -36,6 +40,27 @@ export default class TableViewUtils extends cc.Component {
     private count: number = 0;
     private itemCanMoveDown: boolean = null;
     private itemCanMoveUp: boolean = null;
+    onLoad() {
+        this.initPro();
+        let itemData = [];
+        for (let i = 0; i < 20; i++) {
+            let test_data = {
+                pfbType: 0,
+            }
+            itemData.push(test_data);
+        }
+        this.init(itemData);
+    }
+    private initPro() {
+        this.scrollView = this.node.getComponent(cc.ScrollView);
+        this.content = this.scrollView.content;
+        this.item = this.pre_item;
+        this.layerHeight = this.node.height;
+        for (let i = 0; i < this.item.length; i++) {
+            this.itemNode[i] = cc.instantiate(this.item[i]);
+        }
+        this.node.on('srollview-init', this.init, this);
+    }
     //itemData是item数据,itemPosMap是滚动条滚动时要用到的item位置数据.
     /**
      * @param itemData 列表数据
@@ -45,31 +70,31 @@ export default class TableViewUtils extends cc.Component {
      * @param isSkipInit 跳过初始化
      * @returns 
      */
-    public init(itemData: Array<any>, scrollView: cc.ScrollView, item: Array<cc.Prefab>, itemInterval: number, isSkipInit) {
-        if (!arguments[0]) {
+    public init(itemData: Array<any>, isSkipInit: boolean = false) {
+        if (!itemData[0]) {
             return false;
         }
 
         this.itemData = itemData; //item数据
-        this.scrollView = scrollView;
-        this.item = item;
-        this.itemInterval = itemInterval || 0; //间距
-        //初始化各类属性
-        this.content = this.scrollView.content;
-        this.layerHeight = this.scrollView.node.height;
+        // this.scrollView = scrollView;
+        // this.item = item;
+        // this.itemInterval = itemInterval || 0; //间距
+        // 初始化各类属性
+        // this.content = this.scrollView.content;
+        // this.layerHeight = this.scrollView.node.height;
         this.firstItemIndex = 0;
         this.lastItemIndex = 0;
         this.firstItemData = {};
         this.lastItemData = {};
         this.itemArr = [];
-        this.itemNode = [];
         this.itemPosMap = new Map();
         this.initItemData = true;
         this.count = 0;
         if (isSkipInit) return;
-        for (let i = 0; i < this.item.length; i++) {
-            this.itemNode[i] = cc.instantiate(this.item[i]);
-        }
+        // this.itemNode = [];
+        // for (let i = 0; i < this.item.length; i++) {
+        //     this.itemNode[i] = cc.instantiate(this.item[i]);
+        // }
         // cc.log(this.testTime(0));// 消耗计时
         this.initItem();
         this.getItemPos(0);

mk_framework/assets/script/game/component/tween/UIOpenAndClose.ts

@@ -1,6 +1,6 @@
 
-const { ccclass, property } = cc._decorator;
-
+const { ccclass, property, executeInEditMode, playOnFocus } = cc._decorator;
+/** 效果类型 */
 enum EffectType {
     None = 0,   //无
     Scale = 1,  //缩放
@@ -13,6 +13,8 @@ enum EffectType {
  * @author 薛鸿潇
  */
 @ccclass
+@executeInEditMode()
+@playOnFocus()
 export default class UIOpenAndClose extends cc.Component {
 
     @property({ type: cc.Node, displayName: '动画节点' })
@@ -27,17 +29,42 @@ export default class UIOpenAndClose extends cc.Component {
     @property({ displayName: '关闭节点缩小到此节点坐标', visible() { return this.close_effect == EffectType.ScaleToPoint } })
     private close_toPoint: string = "";
 
-    @property({ displayName: '激活组件时播放' })
-    public playOnLoad: boolean = false;
+    private _play_open: boolean = false;
+    @property({ displayName: "预览开" })
+    get play_open(): boolean {
+        if (this._play_open) {
+            this.showEffect();
+            this._play_open = false;
+        }
+        return this._play_open;
+    }
+    set play_open(v: boolean) {
+        this._play_open = v;
+    }
+    private _play_close: boolean = false;
+    @property({ displayName: "预览开" })
+    get play_close(): boolean {
+        if (this._play_close) {
+            this.hideEffect();
+            this._play_close = false;
+        }
+        return this._play_close;
+    }
+    set play_close(v: boolean) {
+        this._play_close = v;
+    }
+
     onLoad() {
-        this.node.on('ui-close', this.hideEffect, this);// 界面关闭事件
+        // this.node.on('ui-close', this.hideEffect, this);// 界面关闭事件
     }
 
     start() {
-        this.playOnLoad && this.showEffect();
+        this.showEffect();
     }
 
-    /** 界面打开效果 */
+    /**
+     * 界面打开效果
+     */
     private showEffect() {
         if (this.effect_par) {
             switch (this.open_effect) {
@@ -59,7 +86,10 @@ export default class UIOpenAndClose extends cc.Component {
         }
     }
 
-    /** 关闭打开效果 */
+    /**
+     * 关闭打开效果
+     * @param cb 结束回调
+     */
     private hideEffect(cb: Function = null) {
         if (this.effect_par) {
             switch (this.close_effect) {