微信小游戏 彩色试管 倒水游戏 逻辑

 最近开始研究微信小游戏，有兴趣的 可以关注一下 公众号， 记录一些心路历程和源代码。

定义一个 Cup类：

主要功能

1. 初始化水杯：根据传入的颜色信息初始化水杯中的水层。

2. 倒水：模拟水杯倾斜并倒出水的过程。

3. 加水：模拟向水杯中加水的过程。

4. 颜色管理：管理水杯中不同颜色的水层。

5. 交互：处理水杯的点击事件，触发倒水或加水的操作。

   import { Component, _decorator,Node, UITransform, Color, Tween, Vec2, tween, v3, v2, Vec3, Widget, Layers } from "cc";
   import { AudioEnum, AudioUtil } from "../utils/audio_util";
   import Water, { WaterInfo } from "./water";
   import { WaterFlow } from "./waterFlow";
   import { EDITOR } from "cc/env";
   
   const { ccclass, property } = _decorator;
   
   export let WaterColors = [
       "#155DEF",
       "#F2C90F",
       "#004616",
       "#E4584F",
       "#00B38A",
       "#DD2E44",
       "#E5C69A",
       "#65DC8E",
       "#B068F0",
       "#F010BF",
       "#538849",
   ]
   
   //*高度乘数因子，满杯水只显示80% */
   const HEIGHT_FACTOR = 0.8;
   
   //一杯水，分成四组四个颜色，0表示没有水 */
   export interface _CupInfo{
       colorIds:Array<number>;//长度为4
   }
   
   const SPLIT_COUNT = 4;
   
   @ccclass
   export default class Cup extends Component {
       @property(Water)
       private water:Water = null;
   
       private _flow:WaterFlow = null;
       public getFlow():WaterFlow{
           if(this._flow){
               return this._flow;
           }
           let _node = new Node("water_flow");
           _node.layer = Layers.Enum.UI_2D
           _node.addComponent(UITransform)
           this._flow = _node.addComponent(WaterFlow);
           return this._flow;
       }
   
       private onClick:(c:Cup)=>void = null;
   
       onBtn_click(){
           if(this.isPouring()){
               return;
           }
           if(this.onClick){