From fd5b52529d7fc7d7b22a2aa14e7a7315f072a617 Mon Sep 17 00:00:00 2001
From: hdx <hdx@dcloud.io>
Date: Fri, 23 Aug 2024 16:43:12 +0800
Subject: [PATCH] =?UTF-8?q?ball:=20=E8=B0=83=E6=95=B4=E6=A0=B7=E5=BC=8F?=
 =?UTF-8?q?=E5=92=8C-+=E5=B9=85=E5=BA=A6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 pages/component/canvas/canvas/ball.uvue | 49 +++++++++++--------------
 1 file changed, 21 insertions(+), 28 deletions(-)

diff --git a/pages/component/canvas/canvas/ball.uvue b/pages/component/canvas/canvas/ball.uvue
index c3b95507..a0590fd6 100644
--- a/pages/component/canvas/canvas/ball.uvue
+++ b/pages/component/canvas/canvas/ball.uvue
@@ -4,23 +4,20 @@
     <text class="fps">FPS: {{fpsString}}</text>
     <view class="item">
       <text class="item-label">Speed</text>
-      <text class="item-value">{{ballSpeed}}</text>
-      <view class="item-fill"></view>
       <button size="mini" @click="lessClick('speed')">-</button>
+      <text class="item-value">{{ballSpeed}}</text>
       <button size="mini" @click="plusClick('speed')">+</button>
     </view>
     <view class="item">
       <text class="item-label">Layer</text>
-      <text class="item-value">{{ballLayer}}</text>
-      <view class="item-fill"></view>
       <button size="mini" @click="lessClick('layer')">-</button>
+      <text class="item-value">{{ballLayer}}</text>
       <button size="mini" @click="plusClick('layer')">+</button>
     </view>
     <view class="item">
       <text class="item-label">Inlayer</text>
-      <text class="item-value">{{ballInlayer}}</text>
-      <view class="item-fill"></view>
       <button size="mini" @click="lessClick('inLayer')">-</button>
+      <text class="item-value">{{ballInlayer}}</text>
       <button size="mini" @click="plusClick('inLayer')">+</button>
     </view>
   </view>
@@ -204,10 +201,10 @@
       animation!.speed--;
       ballSpeed.value = animation!.speed
     } else if (type == 'layer') {
-      animation!.layer--;
+      animation!.layer -= 5;
       ballLayer.value = animation!.layer
     } else if (type == 'inLayer') {
-      animation!.inLayer--;
+      animation!.inLayer -= 5;
       ballInlayer.value = animation!.inLayer
     }
   }
@@ -217,10 +214,10 @@
       animation!.speed++;
       ballSpeed.value = animation!.speed
     } else if (type == 'layer') {
-      animation!.layer++;
+      animation!.layer += 5;
       ballLayer.value = animation!.layer
     } else if (type == 'inLayer') {
-      animation!.inLayer++;
+      animation!.inLayer += 5;
       ballInlayer.value = animation!.inLayer
     }
   }
@@ -242,10 +239,10 @@
 <style>
   .page-body-wrapper {
     text-align: center;
-  }
-
-  .page-body {
-    padding: 15px;
+  }
+
+  .page-body {
+    padding: 15px;
   }
 
   .canvas {
@@ -256,27 +253,23 @@
   }
 
   .fps {
-    margin-top: 30px;
+    margin-top: 30px;
     margin-bottom: 20px;
   }
 
   .item {
     flex-direction: row;
-    align-items: center;
+    align-items: center;
     margin-top: 10px;
-  }
-
-  .item-label {
-    width: 120px;
   }
 
-  .item-value {
-    margin-left: 5px;
-    color: cornflowerblue;
-    width: 50px;
-  }
-
-  .item-fill {
-    flex: 1;
+  .item-label {
+    margin-right: auto;
+  }
+
+  .item-value {
+    color: cornflowerblue;
+    width: 50px;
+    text-align: center;
   }
 </style>
-- 
GitLab