perf: 🚀 添加更多的高级配置并更新文档

README.md

@@ -5,7 +5,7 @@
 📱 Use Scrcpy with a graphical interface to display and control your Android device, driven by Electron
 
 <div style="display:flex;">
-  <img src="./resources//screenshot/devices-full.jpg" alt="viarotel-escrcpy" style="width: 100%;">
+  <img src="https://p1-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/2ec54d3187af4921b3187cbd63338d04~tplv-k3u1fbpfcp-jj-mark:0:0:0:0:q75.image#?w=1359&h=693&s=132373&e=jpg&b=fefefe" alt="viarotel-escrcpy" style="width: 100%;">
 </div>
 
 ## 特点
@@ -82,8 +82,8 @@
 1. 用户界面进行优化，制作合适的 Logo ✅
 2. 内置的软件更新功能 ✅
 3. 录制和保存音视频 ✅
-4. 添加 macOS 及 linux 操作系统的支持 🚧
-5. 添加外部控制栏 🚧
+4. 添加设备交互控制栏 🚧
+5. 添加 macOS 及 linux 操作系统的支持 🚧
 6. 支持语言国际化功能 🚧
 7. 添加对游戏的增强功能 如游戏键位映射 🚧
 

src/renderer/src/components/Advanced/index.vue

@@ -14,7 +14,7 @@
         </div>
       </template>
       <div class="">
-        <el-form ref="elForm" :model="scrcpyForm" label-width="125px" class="pr-8 pt-4">
+        <el-form ref="elForm" :model="scrcpyForm" label-width="135px" class="pr-8 pt-4">
           <el-row :gutter="20">
             <el-col
               v-for="(item_1, index_1) of getSubModel(item.type)"
@@ -40,7 +40,7 @@
                       >
                       </el-link>
                     </el-tooltip>
-                    <span class="">{{ item_1.label }}</span>
+                    <span class="" :title="item_1.placeholder">{{ item_1.label }}</span>
                   </div>
                 </template>
                 <el-input
@@ -48,6 +48,7 @@
                   v-bind="item_1.props || {}"
                   v-model="scrcpyForm[item_1.field]"
                   class="!w-full"
+                  :title="item_1.placeholder"
                   :placeholder="item_1.placeholder"
                   clearable
                 ></el-input>
@@ -56,6 +57,7 @@
                   v-bind="item_1.props || {}"
                   v-model.number="scrcpyForm[item_1.field]"
                   class="!w-full"
+                  :title="item_1.placeholder"
                   :placeholder="item_1.placeholder"
                   clearable
                 ></el-input>
@@ -67,6 +69,7 @@
                   class="!w-full"
                   clearable
                   :placeholder="item_1.placeholder"
+                  :title="item_1.placeholder"
                   @click="handleDirectory(item_1)"
                 ></el-input>
                 <el-switch
@@ -74,8 +77,8 @@
                   v-bind="item_1.props || {}"
                   v-model="scrcpyForm[item_1.field]"
                   class="!w-full"
-                  :title="item_1.placeholder"
                   clearable
+                  :title="item_1.placeholder"
                 ></el-switch>
                 <el-select
                   v-if="item_1.type === 'select'"
@@ -84,6 +87,7 @@
                   :placeholder="item_1.placeholder"
                   class="!w-full"
                   clearable
+                  :title="item_1.placeholder"
                 >
                   <el-option
                     v-for="(item_2, index_2) in item_1.options"

src/renderer/src/components/Devices/index.vue

@@ -84,7 +84,7 @@
             <el-button
               v-if="!row.$wireless"
               type="primary"
-              :disabled="row.$unauthorized"
+              :disabled="row.$unauthorized || row.$loading || row.$recordLoading"
               @click="handleWifi(row)"
             >
               无线模式
@@ -173,7 +173,7 @@ export default {
       row.$recordLoading = true
       const recordPath = this.getRecordPath(row)
       try {
-        const command = `--serial=${row.id} --window-title=${row.name}-${row.id} --record=${recordPath} ${this.stringScrcpyConfig}`
+        const command = `--serial=${row.id} --window-title=${row.name}-${row.id}-🎥录制中... --record=${recordPath} ${this.stringScrcpyConfig}`
 
         console.log('handleRecord.command', command)
 

src/renderer/src/store/scrcpy/model/device/index.js

@@ -17,11 +17,26 @@ export default () => {
       tips: '仅有线方式连接时有效',
     },
     {
-      label: '关闭屏幕',
+      label: '控制时关闭屏幕',
       type: 'switch',
       field: '--turn-screen-off',
       value: false,
-      placeholder: '开启后连接镜像时将自动关闭设备屏幕',
+      placeholder: '开启后控制设备时将自动关闭设备屏幕',
+    },
+    {
+      label: '控制结束关闭屏幕',
+      type: 'switch',
+      field: '--power-off-on-close',
+      value: false,
+      placeholder: '开启后停止控制设备将自动关闭设备屏幕',
+    },
+    {
+      label: '控制时停止充电',
+      type: 'switch',
+      field: '--no-power-on',
+      value: false,
+      placeholder: '开启后控制设备时将停止充电',
+      tips: '某些机型上似乎不起作用',
     },
   ]
 }

src/renderer/src/store/scrcpy/model/window/index.js

@@ -5,14 +5,28 @@ export default () => {
       field: '--window-borderless',
       type: 'switch',
       value: false,
-      placeholder: '开启无边框模式',
+      placeholder: '开启后控制窗口将变为无边框模式',
     },
     {
       label: '全屏模式',
       field: '--fullscreen',
       type: 'switch',
       value: false,
-      placeholder: '开启全屏模式',
+      placeholder: '开启后控制窗口将全屏显示模式',
+    },
+    {
+      label: '始终位于顶部',
+      field: '--always-on-top',
+      type: 'switch',
+      value: false,
+      placeholder: '开启后控制窗口将始终位于顶部',
+    },
+    {
+      label: '禁用屏幕保护程序',
+      field: '--disable-screensaver',
+      type: 'switch',
+      value: false,
+      placeholder: '开启后将禁用计算机屏幕保护程序',
     },
   ]
 }