optimize button texture

src/config/ui.ts

@@ -62,7 +62,7 @@ export const HandHoverOutScaling = () => {
   return new BABYLON.Vector3(1, 1, 1);
 };
 export const HandInteractShape = () => {
-  return { width: 0.4, height: 0.1 };
+  return { width: 0.8, height: 0.2 };
 };
 export const HandInteractFontSize = 300;
 

src/ui/Duel/simpleDuel/hands.ts

@@ -65,16 +65,21 @@ function setupHandInteractivity(
     scene
   );
   interact.parent = mesh;
-  interact.position.x = CONFIG.HandShape().width / 2 + interactShape.width / 2;
+  // 调整位置
+  interact.translate(
+    new BABYLON.Vector3(0, 1, 0),
+    CONFIG.HandShape().height / 2 + interactShape.height / 2
+  );
 
   const advancedTexture =
     BABYLON_GUI.AdvancedDynamicTexture.CreateForMesh(interact);
-  const button = BABYLON_GUI.Button.CreateSimpleButton(
+  const button = BABYLON_GUI.Button.CreateImageWithCenterTextButton(
     `handInteractButtion${handIdx}`,
-    "test"
+    "test",
+    "http://localhost:3030/images/interact_button.png"
   );
   button.fontSize = CONFIG.HandInteractFontSize;
-  button.background = "gray";
+  button.color = "white";
   button.onPointerClickObservable.add(() => {
     console.log(`<Interact>hand ${handIdx}`);
   });