日常开发

src/views/game/fruit.vue

@@ -1,7 +1,8 @@
 <template>
   <div class="game-container">
     <div id="game"></div>
-   <canvas ref="canvasRef" :width="clientObj.width" :height="clientObj.height" style="position:fixed;left: 0; top: 0;"></canvas>
+    <canvas ref="canvasRef" :width="clientObj.width" :height="clientObj.height"
+      style="position:fixed;left: 0; top: 0;"></canvas>
   </div>
 </template>
 
@@ -27,9 +28,10 @@ const data = reactive<any>({
   clientObj: {},//浏览器对象
   boxes: [],//四个点坐标
   proportion: null,//人框和屏幕比例
+  scaleRatio: 2,//素材比例
 });
 
-const { bodyposeData, bodyposeState, parameter, deviceInfo, againNum, againTimer, wsState, clientObj, boxes, proportion } = toRefs(data);
+const { bodyposeData, bodyposeState, parameter, deviceInfo, againNum, againTimer, wsState, clientObj, boxes, proportion, scaleRatio } = toRefs(data);
 
 /**
  * 初始化
@@ -200,7 +202,7 @@ const getCanvas = () => {
   });
   // console.log("原始坐标：", originalPoints);
   // console.log("缩放后坐标：", postData);
-  externalMethod(postData[10][0]-offset.x, postData[10][1]-offset.y)
+  externalMethod(postData[10][0] - offset.x, postData[10][1] - offset.y)
   //绘制头部
   const point1 = { x: postData[4][0], y: postData[4][1] };
   const point2 = { x: postData[3][0], y: postData[3][1] };
@@ -644,7 +646,7 @@ class Fruit {
       this.env.key
     );
     this.sprite.setOrigin(0.5, 0.5);
-
+    this.sprite.setScale(scaleRatio.value);
     // 物理属性
     this.game.physics.add.existing(this.sprite);
     this.sprite.body.setCollideWorldBounds(false);
@@ -680,6 +682,7 @@ class Fruit {
     // 2. 创建第一半水果
     this.halfOne = this.game.add.sprite(worldPos.x, worldPos.y, this.sprite.texture.key + '-1');
     this.halfOne.setOrigin(0.5, 0.5);
+    this.halfOne.setScale(scaleRatio.value);
     this.halfOne.rotation = Phaser.Math.DegToRad(deg + 45); // 初始角度与刀刃匹配
     this.game.physics.add.existing(this.halfOne);
     // 速度 = 原速度 + 分离速度（向一侧）
@@ -695,6 +698,7 @@ class Fruit {
     // 3. 创建第二半水果（分离方向相反）
     this.halfTwo = this.game.add.sprite(worldPos.x, worldPos.y, this.sprite.texture.key + '-2');
     this.halfTwo.setOrigin(0.5, 0.5);
+    this.halfTwo.setScale(scaleRatio.value);
     this.halfTwo.rotation = Phaser.Math.DegToRad(deg + 45);
     this.game.physics.add.existing(this.halfTwo);
     // 速度 = 原速度 - 分离速度（向另一侧）
@@ -1079,6 +1083,7 @@ class MainScene extends Phaser.Scene {
     //圆圈
     this.new_game = this.add.sprite(0, 0, "new-game");
     this.new_game.setOrigin(0.5, 0.5);
+    this.new_game.setScale(scaleRatio.value);
     //西瓜
     this.sandia = new Fruit({ scene: this, key: "sandia" });
     this.sandiaGroup.add([this.new_game, this.sandia.getSprite()]);
@@ -1653,6 +1658,7 @@ onBeforeMount(() => {
     width: document.documentElement.clientWidth,
     height: document.documentElement.clientHeight,
   }
+  scaleRatio.value = clientObj.value.height / 480
   getInit();
 });
 

src/views/game/index.vue

@@ -70,7 +70,8 @@ onBeforeMount(async () => {
 onMounted(() => {
   //停止播报;
   speckCancel();
-  projectList.value = [{ name: "方块跳一跳", key: "square" }, { name: "水果忍者", key: "fruit" }, { name: "投篮", key: "basketball" }, { name: "踢足球", key: "football" }, { name: "17点位", key: "humanBody" }]
+  //{ name: "方块跳一跳", key: "square" },
+  projectList.value = [{ name: "水果忍者", key: "fruit" }, { name: "投篮", key: "basketball" }, { name: "踢足球", key: "football" }, { name: "17点位", key: "humanBody" }]
 });
 
 onBeforeUnmount(() => {