1

1

assets/art/Icon/饲料/关闭按钮.png.meta

@@ -0,0 +1,134 @@
+{
+  "ver": "1.0.26",
+  "importer": "image",
+  "imported": true,
+  "uuid": "9ba6318a-3daf-47f3-952a-25c1fb48939f",
+  "files": [
+    ".json",
+    ".png"
+  ],
+  "subMetas": {
+    "6c48a": {
+      "importer": "texture",
+      "uuid": "9ba6318a-3daf-47f3-952a-25c1fb48939f@6c48a",
+      "displayName": "关闭按钮",
+      "id": "6c48a",
+      "name": "texture",
+      "userData": {
+        "wrapModeS": "clamp-to-edge",
+        "wrapModeT": "clamp-to-edge",
+        "imageUuidOrDatabaseUri": "9ba6318a-3daf-47f3-952a-25c1fb48939f",
+        "isUuid": true,
+        "visible": false,
+        "minfilter": "linear",
+        "magfilter": "linear",
+        "mipfilter": "none",
+        "anisotropy": 0
+      },
+      "ver": "1.0.22",
+      "imported": true,
+      "files": [
+        ".json"
+      ],
+      "subMetas": {}
+    },
+    "f9941": {
+      "importer": "sprite-frame",
+      "uuid": "9ba6318a-3daf-47f3-952a-25c1fb48939f@f9941",
+      "displayName": "关闭按钮",
+      "id": "f9941",
+      "name": "spriteFrame",
+      "userData": {
+        "trimType": "auto",
+        "trimThreshold": 1,
+        "rotated": false,
+        "offsetX": 0,
+        "offsetY": 0,
+        "trimX": 0,
+        "trimY": 0,
+        "width": 64,
+        "height": 64,
+        "rawWidth": 64,
+        "rawHeight": 64,
+        "borderTop": 0,
+        "borderBottom": 0,
+        "borderLeft": 0,
+        "borderRight": 0,
+        "packable": true,
+        "pixelsToUnit": 100,
+        "pivotX": 0.5,
+        "pivotY": 0.5,
+        "meshType": 0,
+        "vertices": {
+          "rawPosition": [
+            -32,
+            -32,
+            0,
+            32,
+            -32,
+            0,
+            -32,
+            32,
+            0,
+            32,
+            32,
+            0
+          ],
+          "indexes": [
+            0,
+            1,
+            2,
+            2,
+            1,
+            3
+          ],
+          "uv": [
+            0,
+            64,
+            64,
+            64,
+            0,
+            0,
+            64,
+            0
+          ],
+          "nuv": [
+            0,
+            0,
+            1,
+            0,
+            0,
+            1,
+            1,
+            1
+          ],
+          "minPos": [
+            -32,
+            -32,
+            0
+          ],
+          "maxPos": [
+            32,
+            32,
+            0
+          ]
+        },
+        "isUuid": true,
+        "imageUuidOrDatabaseUri": "9ba6318a-3daf-47f3-952a-25c1fb48939f@6c48a",
+        "atlasUuid": ""
+      },
+      "ver": "1.0.12",
+      "imported": true,
+      "files": [
+        ".json"
+      ],
+      "subMetas": {}
+    }
+  },
+  "userData": {
+    "type": "sprite-frame",
+    "fixAlphaTransparencyArtifacts": true,
+    "hasAlpha": true,
+    "redirect": "9ba6318a-3daf-47f3-952a-25c1fb48939f@f9941"
+  }
+}

assets/script/BackgroundAdapter.ts

@@ -0,0 +1,36 @@
+import { _decorator, Component, view, Node } from 'cc';
+const { ccclass, property } = _decorator;
+
+@ccclass('BackgroundAdapter')
+export class BackgroundAdapter extends Component {
+
+    @property(Node)
+    background: Node = null;
+
+    onLoad() {
+        // 检查背景节点是否已绑定
+        if (!this.background) {
+            console.error('背景节点未绑定，请在编辑器中将背景节点拖拽到 background 属性中。');
+            return;
+        }
+
+        // 获取设计分辨率和实际屏幕分辨率
+        const designResolution = view.getDesignResolutionSize();
+        const frameSize = view.getFrameSize();
+
+        // 计算设计分辨率和屏幕分辨率的比例
+        const designRatio = designResolution.width / designResolution.height;
+        const frameRatio = frameSize.width / frameSize.height;
+
+        // 根据比例调整背景缩放
+        if (frameRatio > designRatio) {
+            // 屏幕更宽，调整背景宽度
+            const scale = frameRatio / designRatio;
+            this.background.setScale(scale, 1, 1);
+        } else {
+            // 屏幕更窄，调整背景高度
+            const scale = designRatio / frameRatio;
+            this.background.setScale(1, scale, 1);
+        }
+    }
+}

assets/script/BackgroundAdapter.ts.meta

@@ -0,0 +1,9 @@
+{
+  "ver": "4.0.23",
+  "importer": "typescript",
+  "imported": true,
+  "uuid": "ccaad00d-6ee6-4846-9068-49ed16de3906",
+  "files": [],
+  "subMetas": {},
+  "userData": {}
+}

assets/script/CircularProgressBar.ts

@@ -0,0 +1,40 @@
+import { _decorator, Component, Sprite, tween } from 'cc';
+const { ccclass, property } = _decorator;
+
+@ccclass('CircularProgressBar')
+export class CircularProgressBar extends Component {
+
+    @property({ type: Sprite })
+    public progressBar: Sprite | null = null;  // 关联的圆形Sprite组件
+
+    @property
+    public progressDuration: number = 2.0;  // 进度条完成的时间
+
+    @property
+    public startProgress: number = 0;  // 起始进度(0.0 - 1.0)
+
+    @property
+    public endProgress: number = 1;  // 最终进度(0.0 - 1.0)
+
+    start() {
+        // 初始化进度条的填充类型为圆形
+        if (this.progressBar) {
+            this.progressBar.type = Sprite.Type.FILLED;
+            this.progressBar.fillType = Sprite.FillType.RADIAL;
+            this.progressBar.fillStart = 0;  // 从顶部开始（0°）
+            this.progressBar.fillRange = this.startProgress;  // 初始进度
+        }
+
+        // 开始动画来更新进度
+        //this.updateProgressBar();
+    }
+
+    public updateProgressBar() {
+        if (this.progressBar) {
+            // 使用 tween 从 startProgress 到 endProgress 来控制进度条
+            tween(this.progressBar)
+                .to(this.progressDuration, { fillRange: this.endProgress })  // 填充范围从 0 到 1
+                .start();
+        }
+    }
+}

assets/script/CircularProgressBar.ts.meta

@@ -0,0 +1,9 @@
+{
+  "ver": "4.0.23",
+  "importer": "typescript",
+  "imported": true,
+  "uuid": "d867f41e-3a45-4018-9800-e133f2c3e2f9",
+  "files": [],
+  "subMetas": {},
+  "userData": {}
+}

assets/script/FeedManager.ts

@@ -14,6 +14,8 @@ export class FeedManager extends Component {
     @property
     public textColor: string = '#000000';
     public richText: RichText;
+    @property(Node)
+    public foodObj: Node = null;
    
     start() {
 
@@ -25,6 +27,7 @@ export class FeedManager extends Component {
 
     //取消
     public cancel() {
+        this.node.active = false;
         console.log('取消');
     }
     //确认

assets/script/MainManager.ts

@@ -0,0 +1,93 @@
+import { _decorator, Button, Component, Node } from 'cc';
+import { CircularProgressBar } from './CircularProgressBar';
+import { PopupEffect } from './PopupEffect'
+const { ccclass, property } = _decorator;
+
+@ccclass('MainManager')
+export class MainManager extends Component {
+
+    //任务按钮
+    @property(Button)
+    public taskBtn: Button = null;
+    //领取饲料
+    @property(Button)
+    public getFoodBtn: Button = null;
+    //消息按钮
+    @property(Button)
+    public messageBtn: Button = null;
+    //加饲料
+    @property(Button)
+    public addFood: Button = null;
+    //领鸡蛋
+    @property(Button)
+    public getEgg: Button = null;
+    @property(PopupEffect)
+    public popupEffects: PopupEffect
+    @property(CircularProgressBar)
+    public circularProgressBar: CircularProgressBar
+
+    private feedGrams: number = 20
+
+    @property(Node)
+    public popupUI: Node = null;
+    @property(Node)
+    public feedObj: Node = null;
+
+    start() {
+
+        // this.taskBtn.node.on('click', this.onTaskBtnClick, this);
+        this.getFoodBtn.node.on('click', this.onGetFoodBtnClick, this);
+        this.messageBtn.node.on('click', this.onMessageBtnClick, this);
+        this.addFood.node.on('click', this.onAddFoodClick, this);
+        this.getEgg.node.on('click', this.onGetEggClick, this);
+    }
+
+    //任务按钮点击
+    onTaskBtnClick() {
+        //跳转到其他界面
+        console.log('任务按钮点击');
+    }
+
+    //领取饲料按钮点击
+    onGetFoodBtnClick() {
+        //弹出界面
+        this.popupEffects.showPopup();
+        //跳转到其他界面
+        console.log('领取饲料按钮点击');
+    }
+
+    //消息按钮点击
+    onMessageBtnClick() {
+        //跳转到其他界面
+        console.log('消息按钮点击');
+    }
+
+    //加饲料按钮点击
+    onAddFoodClick() {
+        //跳转到其他界面
+        //TODO 向服务器获取数据 饲料充足则向碗里加饲料
+        //处理数据
+        if (this.feedGrams <= 10) {
+
+            //显示弹窗
+            this.popupUI.active = true;
+        } else {
+            this.feedObj.active = true;
+            this.circularProgressBar.updateProgressBar();
+            console.log('加饲料按钮点击');
+        }
+    }
+
+    //领鸡蛋按钮点击
+    onGetEggClick() {
+        //跳转到其他界面
+        //TODO 向服务器获取数据 鸡蛋充足则领取鸡蛋
+        console.log('领鸡蛋按钮点击');
+    }
+
+    update(deltaTime: number) {
+
+    }
+}
+
+

assets/script/MainManager.ts.meta

@@ -0,0 +1,9 @@
+{
+  "ver": "4.0.23",
+  "importer": "typescript",
+  "imported": true,
+  "uuid": "abc2b50b-928b-417c-940e-048da30d6ce2",
+  "files": [],
+  "subMetas": {},
+  "userData": {}
+}

assets/script/PopupEffect.ts

@@ -0,0 +1,66 @@
+import { _decorator, Component, Node, tween, Vec3, UITransform, log } from 'cc';
+const { ccclass, property } = _decorator;
+
+@ccclass('PopupEffect')
+export class PopupEffect extends Component {
+
+    @property
+    public popupDuration: number = 0.5;  // 弹出动画的持续时间
+
+    @property
+    public targetHeight: number = 300;  // 弹出目标的高度（终点位置的Y坐标）
+
+    private initialPosition: Vec3 | null = null;  // 初始位置 (隐藏状态)
+
+    public hiddenPositionY: any;
+
+
+    awake() {
+        // this.hiddenPositionY = this.node.position.y;
+        // log('高度:', this.hiddenPositionY);
+    }
+
+    start() {
+        // 获取UITransform组件来确定节点和父节点的尺寸
+        const uiTransform = this.node.getComponent(UITransform);
+        const parentTransform = this.node.parent?.getComponent(UITransform);
+
+        if (uiTransform && parentTransform) {
+            // 计算隐藏状态的位置（屏幕底部外）
+            //const hiddenPositionY = -parentTransform.height / 2 - uiTransform.height / 2;
+            this.hiddenPositionY = this.node.position.y;
+
+            this.initialPosition = new Vec3(this.node.position.x, this.hiddenPositionY, this.node.position.z);  // 记录初始隐藏位置
+
+            // 设置初始位置为隐藏状态
+            this.node.setPosition(this.initialPosition);
+
+            // 调用弹出效果
+            //this.showPopup();
+        }
+    }
+
+    // 弹出效果：从底部平滑移动到指定高度
+    public showPopup() {
+        log('目标高度:', this.targetHeight);
+        
+        if (this.initialPosition) {
+            // 使用tween动画，从隐藏状态移动到目标高度
+            tween(this.node)
+                .to(this.popupDuration, { position: new Vec3(this.initialPosition.x, this.targetHeight, this.initialPosition.z) })
+                .start();
+        }
+    }
+
+    // 恢复到初始隐藏位置
+    public hidePopup() {
+        log('隐藏位置:', this.initialPosition);
+        if (this.initialPosition) {
+            // 使用tween动画，将节点移回到初始隐藏位置
+            log('隐藏位置:', this.hiddenPositionY);
+            tween(this.node)
+                .to(this.popupDuration, { position: this.initialPosition })
+                .start();
+        }
+    }
+}

assets/script/PopupEffect.ts.meta

@@ -0,0 +1,9 @@
+{
+  "ver": "4.0.23",
+  "importer": "typescript",
+  "imported": true,
+  "uuid": "f81397b4-9a85-4062-86c4-5d4f14c6ee6a",
+  "files": [],
+  "subMetas": {},
+  "userData": {}
+}

assets/script/ScreenAdaptation.ts

@@ -0,0 +1,14 @@
+import { _decorator, Component, Node } from 'cc';
+const { ccclass, property } = _decorator;
+
+@ccclass('ScreenAdaptation')
+export class ScreenAdaptation extends Component {
+    start() {
+
+    }
+
+    update(deltaTime: number) {
+        
+    }
+}
+

assets/script/ScreenAdaptation.ts.meta

@@ -0,0 +1,9 @@
+{
+  "ver": "4.0.23",
+  "importer": "typescript",
+  "imported": true,
+  "uuid": "251048e7-7619-4bdc-a0f5-380314cbc5eb",
+  "files": [],
+  "subMetas": {},
+  "userData": {}
+}

assets/script/TaskManager.ts

@@ -1,12 +1,17 @@
-import { _decorator, Button, Component, Node } from 'cc';
+import { _decorator, Button, Component, log, Node } from 'cc';
 import { FillSpriteEffect } from './FillSpriteEffect';
 import { ChangeWorldColor } from './ChangeWorldColor'
+import { PopupEffect } from './PopupEffect'
 const { ccclass, property } = _decorator;
 
 @ccclass('TaskManager')
 export class TaskManager extends Component {
 
 
+    //关闭弹窗
+    @property(Button)
+    public closeBtn: Button = null;
+
     //领取饲料按钮
     @property
     public getFeedBtn: Button = null;
@@ -18,6 +23,9 @@ export class TaskManager extends Component {
     public fillEffects: FillSpriteEffect[] = [];
     @property(ChangeWorldColor)
     public changeWorldColor: ChangeWorldColor[] = [];
+    @property(PopupEffect)
+    public popupEffects: PopupEffect
+
     private lineNum: number = 0;
 
     //是否领取
@@ -27,17 +35,27 @@ export class TaskManager extends Component {
 
     protected onLoad(): void {
         //this.lineNum=this.fillEffects.length;
+       // this.popupEffects = this.node.getComponent(PopupEffect);
         this.getFeedBtn = this.node.getChildByName('领取').getComponent(Button);
     }
 
     start() {
         //领取饲料按钮点击事件
         this.getFeedBtn.node.on('click', this.getFeed, this);
+        //关闭按钮点击事件
+        this.closeBtn.node.on('click', this.closePopup, this);
     }
 
     update(deltaTime: number) {
 
     }
+
+    //关闭弹窗
+    public closePopup() {
+        log('关闭弹窗');
+        this.popupEffects.hidePopup()
+    }
+
     //领取饲料
     public getFeed() {
 

settings/v2/packages/project.json

@@ -4,8 +4,8 @@
     "designResolution": {
       "width": 750,
       "height": 1334,
-      "fitHeight": false,
-      "fitWidth": false
+      "fitHeight": true,
+      "fitWidth": true
     }
   }
 }