feat(ui): add dynamic scaling support

- Introduced `scale` property across components for responsive design.
- Adjusted dimensions and positions dynamically based on scale.
- Enhanced flexibility for varying display resolutions.

ui/StartPage.slint

@@ -1,13 +1,14 @@
 import {Button} from "Components.slint";
 
-export component StartPage inherits Window {
+export component StartPage inherits Rectangle {
+    in property <float> scale;
     in property <bool> is-ready;
     in property <bool> is-restart;
 
     callback request-start;
 
-    width: 1920px;
-    height: 1080px;
+    width: 100%;
+    height: 100%;
 
     // 背景渐变 (从左上角的米色到右下角的淡粉色)
     Rectangle {
@@ -16,29 +17,29 @@ export component StartPage inherits Window {
 
     // 中心卡片
     Rectangle {
-        width: 600px;
-        height: 600px; // 根据内容高度调整
+        width: 600px * scale;
+        height: 600px * scale; // 根据内容高度调整
         background: #FDFBF8; // 略微区别于背景的米白色
-        border-radius: 20px;
+        border-radius: 20px * scale;
 
         // 简单的阴影模拟
-        drop-shadow-blur: 20px;
+        drop-shadow-blur: 20px * scale;
         drop-shadow-color: #00000015;
-        drop-shadow-offset-y: 4px;
+        drop-shadow-offset-y: 4px * scale;
 
         VerticalLayout {
-            padding: 40px;
-            spacing: 20px;
+            padding: 40px * scale;
+            spacing: 20px * scale;
             alignment: center;
 
             // 标题区域
             VerticalLayout {
-                spacing: 8px;
+                spacing: 8px * scale;
                 alignment: center;
 
                 Text {
                     text: "UNO";
-                    font-size: 96px;
+                    font-size: 96px * scale;
                     font-weight: 700;
                     color: #222222;
                     horizontal-alignment: center;
@@ -46,7 +47,7 @@ export component StartPage inherits Window {
 
                 Text {
                     text: is-restart ? "游戏结束，重新准备以重新开始游戏" : "连接成功，所有玩家准备后开始游戏";
-                    font-size: 14px;
+                    font-size: 14px * scale;
                     color: #666666;
                     horizontal-alignment: center;
                 }
@@ -54,15 +55,16 @@ export component StartPage inherits Window {
 
             // 占位间隔
             Rectangle {
-                height: 10px;
+                height: 10px * scale;
             }
 
             // 底部按钮区域 (增加一点顶部间距)
             HorizontalLayout {
-                padding-top: 10px;
+                padding-top: 10px * scale;
                 alignment: center;
 
                 Button {
+                    scale: root.scale;
                     enabled: !is-ready;
                     text: is-ready ? "已准备" : "准备";
                     clicked => {