fix: 工具栏存储 & 虚拟键盘缩放

idea.md

@@ -33,7 +33,7 @@
 
 ## V2.A
 
-[] 自定义工具的大小问题
+[x] 自定义工具的大小问题
 [] 优化 ui 布局
 [] 设置条目中添加 switch 开关
 

src/core/main/custom/toolbar.ts

@@ -286,12 +286,14 @@ export class CustomToolbar extends EventEmitter<CustomToolbarEvent> {
 
     static save() {
         toolbarStorage.clear();
+        const setting = Mota.require('var', 'mainSetting');
+        const scale = setting.getValue('ui.toolbarScale', 100) / 100;
         this.list.forEach(v => {
             const toSave: ToolbarSaveData = {
                 x: v.x,
                 y: v.y,
-                w: v.width,
-                h: v.height,
+                w: v.width / scale,
+                h: v.height / scale,
                 items: []
             };
             v.items.forEach(v => {

src/core/main/setting.ts

@@ -522,7 +522,7 @@ loading.once('coreInit', () => {
         ),
         'ui.toolbarScale': storage.getValue(
             'ui.toolbarScale', 
-            isMobile ? 40 : Math.floor(window.innerWidth / 1700 * 10) * 10
+            isMobile ? 50 : Math.floor(window.innerWidth / 1700 * 10) * 10
         ),
         'debug.frame': !!storage.getValue('debug.frame', false),
     });

src/panel/keyboard.vue

@@ -6,10 +6,10 @@
             @click="keyboard.emitKey(key, i)"
             :active="checkAssist(assist, key.key)"
             :style="{
-                left: `${key.x * scale}px`,
-                top: `${key.y * scale}px`,
-                width: `${key.width * scale}px`,
-                height: `${key.height * scale}px`
+                left: `${key.x * caledScale}px`,
+                top: `${key.y * caledScale}px`,
+                width: `${key.width * caledScale}px`,
+                height: `${key.height * caledScale}px`
             }"
         >
             <span
@@ -35,7 +35,6 @@ const props = defineProps<{
 const scale = mainSetting.getValue('screen.keyScale', 100) / 100;
 
 const assist = ref(props.keyboard.assist);
-const fontSize = `${props.keyboard.fontSize * scale}px`;
 
 const [width, height] = (() => {
     const key = props.keyboard;
@@ -46,9 +45,14 @@ const [width, height] = (() => {
         if (k.y + k.height > mh) mh = k.y + k.height;
     }
 
-    return [`${mw}px`, `${mh}px`];
+    return [mw, mh];
 })();
 
+const caledScale = Math.min(scale, (window.innerWidth / width) * 0.9);
+const caledWidth = `${width * caledScale}px`;
+const caledHeight = `${height * caledScale}px`;
+const fontSize = `${props.keyboard.fontSize * caledScale}px`;
+
 function onAssist() {
     nextTick(() => {
         assist.value = props.keyboard.assist;
@@ -67,8 +71,8 @@ onUnmounted(() => {
 
 <style lang="less" scoped>
 .keyboard-container {
-    width: v-bind(width);
-    height: v-bind(height);
+    width: v-bind(caledWidth);
+    height: v-bind(caledHeight);
     display: block;
     font-size: v-bind(fontSize);
     position: relative;