feat: 奖品不足5个时 居中不轮播

hzlh-beautifulFunFestival-snake-20241222/assets/Scripts/Scenes/runMain/runMainPage.ts

-import { _decorator, AudioClip, Button, Component, Label, Node } from 'cc';
-import { getProjectId, getWebData, LOG_TYPE, sendLog, sendWebNet, WebNetName } from '../../Utils/WebNet/WebNet';
-import { changeScene, showPanel, showToast } from '../../../Module/UIFast';
+import { _decorator, AudioClip, Button, Component, instantiate, Label, Node, Prefab, SpriteFrame } from 'cc';
+import { getWebData, LOG_TYPE, sendLog, sendWebNet, WebNetName } from '../../Utils/WebNet/WebNet';
+import { showPanel, showToast } from '../../../Module/UIFast';
 import Scene from '../../../Module/Scene';
-import { runGamePage } from '../runGamePage';
 import { TaskPanel } from '../../Panels/TaskPanel/TaskPanel';
 import RulePanel from '../../Panels/RulePanel';
 import store from '../../store/store';
@@ -38,6 +37,13 @@ export class runMainPage extends Scene {
     @property(Node)
     taskBtn: Node = null;
 
+    // 奖品列表（小于等于4个）
+    @property(Node)
+    prizeList4Num: Node = null;
+    // 奖品列表（大于4个）
+    @property(Node)
+    prizeListMore: Node = null;
+    // 奖品轮播盒子
     @property(VList)
     prizeListBox: VList = null;
 
@@ -47,6 +53,9 @@ export class runMainPage extends Scene {
     @property(Node)
     guide1: Node = null;
 
+    @property(Prefab)
+    prizeItemPrefab: Prefab = null;
+
     // 主按钮 高亮态
     @property(SpriteFrame) mainBtnSF: SpriteFrame = null;
     // 主按钮 置灰态
@@ -76,7 +85,7 @@ export class runMainPage extends Scene {
         const { success, data } = await sendWebNet(WebNetName.tcs_Index);
         if (success) {
             this.startLab.string = `剩余次数：${data.remainJoinNum || 0}`
-// 主按钮置灰处理
+            // 主按钮置灰处理
             this.startBtn.getChildByName("runmainbtn").getComponent(Sprite).spriteFrame = data.remainJoinNum > 0 ? this.mainBtnSF : this.mainBtnGreySF;
             // 新手引导1
             if (data.alreadyGuide == 0) {
@@ -87,13 +96,27 @@ export class runMainPage extends Scene {
             if (data.offlineNewAssist && data.offlineNewAssist > 0) {
                 showToast(`一共有${data.offlineNewAssist}位好友助力，快去任务面板领取奖励次数吧～`)
             }
-            const updateItem = (node, data) => {
-                node.getChildByPath("prizeImgMask/prizeImg")
-                    .getComponent(Sprite).spriteFrame = data.prizeImage;
-            };
-            // this.prizeListBox.node.removeAllChildren();
-            // this.prizeListBox.node.destroyAllChildren();
-            this.prizeListBox.init(data.prizeShow, updateItem);
+            // 处理奖品列表展示
+            if (data.prizeShow?.length <= 4) {
+                this.prizeList4Num.active = true;
+                this.prizeListMore.active = false;
+                data.prizeShow.forEach((item, index) => {
+                    const itemr = instantiate(this.prizeItemPrefab)
+                    itemr.getChildByPath("prizeImgMask/prizeImg")
+                        .getComponent(Sprite).spriteFrame = item.prizeImage;
+                    this.prizeList4Num.getChildByName("prizeListLess").addChild(itemr)
+                })
+            } else {
+                const updateItem = (node, data) => {
+                    node.getChildByPath("prizeImgMask/prizeImg")
+                        .getComponent(Sprite).spriteFrame = data.prizeImage;
+                };
+                // this.prizeListBox.node.removeAllChildren();
+                // this.prizeListBox.node.destroyAllChildren();
+                this.prizeList4Num.active = false;
+                this.prizeListMore.active = true;
+                this.prizeListBox.init(data.prizeShow, updateItem);
+            }
         }
     }
 

hzlh-beautifulFunFestival-snake-20241222/preview-template/mock/branch_tcs/index.do.json

@@ -19,6 +19,14 @@
                 "prizeName": "奖品名称3",
                 "prizeImage": "//yun.duiba.com.cn/spark/assets/f77861647e7b55e9c95e9c49d891a21526157a76.jpg"
             },
+            {
+                "prizeName": "奖品名称3",
+                "prizeImage": "//yun.duiba.com.cn/spark/assets/f77861647e7b55e9c95e9c49d891a21526157a76.jpg"
+            },
+            {
+                "prizeName": "奖品名称3",
+                "prizeImage": "//yun.duiba.com.cn/spark/assets/f77861647e7b55e9c95e9c49d891a21526157a76.jpg"
+            },
             {
                 "prizeName": "奖品名称4",
                 "prizeImage": "//yun.duiba.com.cn/polaris/taibao.eb7c402c7c60ef8d4e42cf8d2cb4c4d5f2b5be20.png"