优化窗口透明度操作逻辑。

commons/data/languages.ts

@@ -193,6 +193,7 @@ let simplifiedChinese = {
     "开启勿扰模式后，计算机在游戏、应用全屏模式下不会弹出Dawn Launcher窗口。",
   notFoundFile: "找不到指定的文件",
   notFoundFolder: "找不到指定的文件夹",
+  notTransparent: "不透明",
   number: "数量",
   numberKey: "数字键",
   officialWebsite: "官方网站",
@@ -288,6 +289,7 @@ let simplifiedChinese = {
   title: "标题",
   top: "顶部",
   traditionalChinese: "繁体中文",
+  transparent: "透明",
   turnOffMonitor: "关闭显示器",
   unlockClassification: "解锁分类",
   unlockItem: "解锁项目",
@@ -501,6 +503,7 @@ let traditionalChinese = {
     "開啟勿擾模式後，計算機在遊戲、應用全屏模式下不會彈出Dawn Launcher窗口。",
   notFoundFile: "找不到指定的文件",
   notFoundFolder: "找不到指定的文件夾",
+  notTransparent: "不透明",
   number: "數量",
   numberKey: "數字鍵",
   officialWebsite: "官方網站",
@@ -596,6 +599,7 @@ let traditionalChinese = {
   title: "標題",
   top: "頂部",
   traditionalChinese: "繁體中文",
+  transparent: "透明",
   turnOffMonitor: "關閉顯示器",
   unlockClassification: "解鎖分類",
   unlockItem: "解鎖項目",
@@ -817,6 +821,7 @@ let english = {
     "After turning on Do Not Disturb mode, the Dawn Launcher window will not pop up when the computer is in full-screen mode for games or applications.",
   notFoundFile: "The file specified cannot be found",
   notFoundFolder: "The specified folder cannot be found",
+  notTransparent: "Not Transparent",
   number: "Number",
   numberKey: "Number Key",
   officialWebsite: "Official Website",
@@ -923,6 +928,7 @@ let english = {
   title: "Title",
   top: "Top",
   traditionalChinese: "Traditional Chinese",
+  transparent: "Transparent",
   turnOffMonitor: "Turn Off Monitor",
   unlockClassification: "Unlock Classification",
   unlockItem: "Unlock Item",

package.json

@@ -39,7 +39,7 @@
     "electron-builder": "^24.6.5",
     "less": "^4.2.0",
     "less-loader": "^11.1.3",
-    "naive-ui": "^2.35.0",
+    "naive-ui": "^2.36.0",
     "postcss": "^8.4.31",
     "tailwindcss": "^3.3.5",
     "typescript": "^5.2.2",

src/App.vue

@@ -91,10 +91,35 @@ function setTheme() {
       padding: "6px",
     },
     Checkbox: {
-      color: store.setting.appearance.theme.mainBackgroundColor,
-      textColor: store.setting.appearance.theme.mainFontColor,
-      borderChecked: "1px solid " + store.setting.appearance.theme.borderColor,
-      colorChecked: store.setting.appearance.theme.secondBackgroundColor,
+      color: hexToRGBA(store.setting.appearance.theme.mainBackgroundColor, 1),
+      textColor: hexToRGBA(store.setting.appearance.theme.mainFontColor, 1),
+      border:
+        "1px solid " + hexToRGBA(store.setting.appearance.theme.borderColor, 1),
+      borderChecked:
+        "1px solid " +
+        hexToRGBA(store.setting.appearance.theme.mainFontColor, 1),
+      colorChecked: "none",
+      checkMarkColor: hexToRGBA(
+        store.setting.appearance.theme.mainFontColor,
+        1
+      ),
+    },
+    Radio: {
+      boxShadowActive:
+        "inset 0 0 0 1px " +
+        hexToRGBA(store.setting.appearance.theme.mainFontColor, 1),
+      boxShadowFocus:
+        "inset 0 0 0 1px " +
+        hexToRGBA(store.setting.appearance.theme.mainFontColor, 1),
+      boxShadowHover:
+        "inset 0 0 0 1px " +
+        hexToRGBA(store.setting.appearance.theme.mainFontColor, 1),
+      dotColorActive: hexToRGBA(
+        store.setting.appearance.theme.mainFontColor,
+        1
+      ),
+      color: hexToRGBA(store.setting.appearance.theme.mainBackgroundColor, 1),
+      textColor: hexToRGBA(store.setting.appearance.theme.mainFontColor, 1),
     },
     Form: {
       labelTextColor: store.setting.appearance.theme.mainFontColor,

src/pages/index/Index.vue

@@ -300,15 +300,6 @@ let topRightMenuOptions = ref<Array<any>>([
       },
     },
   },
-  {
-    label: store.language.rewardSponsor,
-    key: "RewardSponsor",
-    props: {
-      onclick: () => {
-        window.api.openURL("https://dawnlauncher.com/sponsor");
-      },
-    },
-  },
   {
     label: store.language.feedback,
     key: "Feedback",

src/pages/setting/Index.vue

@@ -469,28 +469,39 @@
               size="small"
               class="mt-3"
             >
-              <span class="block font-semibold"
-                >{{ store.language.backgroundTransparent }}({{
-                  transparency
-                }})</span
+              <span class="block font-semibold">{{
+                store.language.backgroundTransparent
+              }}</span>
+              <NFormItem class="mt-1">
+                <NRadio
+                  :checked="setting.appearance.transparency === 1"
+                  :value="false"
+                  @change="changeTransparency"
+                  >{{ store.language.notTransparent }}</NRadio
+                >
+                <NRadio
+                  :checked="setting.appearance.transparency < 1"
+                  :value="true"
+                  @change="changeTransparency"
+                  >{{ store.language.transparent }}</NRadio
                 >
-              <NFormItem>
-                <input
-                  type="range"
-                  v-model="transparency"
-                  min="0.1"
-                  max="1.0"
-                  step="0.01"
-                  class="mt-2 w-full range"
-                  @change="setTransparency"
-                />
               </NFormItem>
+              <NSlider
+                v-if="setting.appearance.transparency < 1"
+                class="mt-1"
+                v-model:value="transparency"
+                :step="0.01"
+                :min="0.1"
+                :max="0.99"
+                :on-dragend="setTransparency"
+                :keyboard="false"
+              ></NSlider>
             </NForm>
             <NForm
               label-placement="left"
               :show-feedback="false"
               size="small"
-              class="mt-1"
+              class="mt-3"
             >
               <span class="block font-semibold">{{
                 store.language.backgroundImage
@@ -525,21 +536,18 @@
               class="mt-3"
               v-if="setting.appearance.backgroundImage && store.backgroundImage"
             >
-              <span class="block font-semibold"
-                >{{ store.language.backgroundImageTransparent }}({{
-                  setting.appearance.backgroundImageTransparency
-                }})</span
-              >
+              <span class="block font-semibold">{{
+                store.language.backgroundImageTransparent
+              }}</span>
               <NFormItem>
-                <input
-                  type="range"
-                  v-model="backgroundImageTransparency"
-                  min="0.1"
-                  max="1.0"
-                  step="0.01"
-                  class="mt-2 w-full range"
-                  @change="setBackgroundImageTransparency"
-                />
+                <NSlider
+                  v-model:value="backgroundImageTransparency"
+                  :step="0.01"
+                  :min="0.1"
+                  :max="1.0"
+                  :on-dragend="setBackgroundImageTransparency"
+                  :keyboard="false"
+                ></NSlider>
               </NFormItem>
             </NForm>
             <NForm
@@ -890,21 +898,18 @@
               size="small"
               class="mt-3"
             >
-              <span class="block font-semibold"
-                >{{ store.language.columnNumber }}({{
-                  setting.item.columnNumber
-                }})</span
-              >
+              <span class="block font-semibold">{{
+                store.language.columnNumber
+              }}</span>
               <NFormItem>
-                <input
-                  type="range"
-                  v-model="columnNumber"
-                  min="1"
-                  max="20"
-                  step="1"
-                  class="mt-2 w-full range"
-                  @change="setColumnNumber"
-                />
+                <NSlider
+                  v-model:value="columnNumber"
+                  :step="1"
+                  :min="1"
+                  :max="20"
+                  :on-dragend="setColumnNumber"
+                  :keyboard="false"
+                ></NSlider>
               </NFormItem>
               <Desc
                 class="mt-1"
@@ -1537,6 +1542,8 @@ import {
   NColorPicker,
   NInputNumber,
   NSelect,
+  NRadio,
+  NSlider,
 } from "naive-ui";
 import SimpleBar from "simplebar";
 import "simplebar/dist/simplebar.css";
@@ -2082,6 +2089,14 @@ function changeFontShadowColor(value: string) {
 }
 // 修改背景色透明
 let transparency = ref(setting.value.appearance.transparency);
+function changeTransparency(e: Event) {
+  let val = (e.target as HTMLInputElement).value;
+  if (val === "true") {
+    setting.value.appearance.transparency = 0.9;
+  } else {
+    setting.value.appearance.transparency = 1;
+  }
+}
 function setTransparency() {
   setting.value.appearance.transparency = Number(transparency.value);
 }