播放控制栏开启/关闭桌面歌词按钮 新增右击按钮时锁定/解锁桌面歌词功能

src/renderer/components/core/Player.vue

@@ -15,7 +15,7 @@ div(:class="$style.player")
               div(:class="[$style.volume, setting.player.isMute ? $style.muted : null]")
                 div(:class="$style.volumeBar" :style="{ transform: `scaleX(${volume || 0})` }")
               div(:class="$style.volumeMask" @mousedown="handleVolumeMsDown" ref="dom_volumeMask" :title="`${$t('core.player.volume')}${parseInt(volume * 100)}%`")
-            div(:class="$style.titleBtn" @click='toggleDesktopLyric' :title="setting.desktopLyric.enable ? $t('core.player.desktop_lyric_off') : $t('core.player.desktop_lyric_on')")
+            div(:class="$style.titleBtn" @click='toggleDesktopLyric' @contextmenu="handleToggleLockDesktopLyric" :title="toggleDesktopLyricBtnTitle")
               svg(v-if="setting.desktopLyric.enable" version='1.1' xmlns='http://www.w3.org/2000/svg' xlink='http://www.w3.org/1999/xlink' height='100%' viewBox='0 0 512 512' space='preserve')
                 use(xlink:href='#icon-desktop-lyric-off')
               svg(v-else version='1.1' xmlns='http://www.w3.org/2000/svg' xlink='http://www.w3.org/1999/xlink' height='100%' viewBox='0 0 512 512' space='preserve')
@@ -173,6 +173,17 @@ export default {
         default: return this.$t('core.player.play_toggle_mode_off')
       }
     },
+    toggleDesktopLyricBtnTitle() {
+      return `${
+        this.setting.desktopLyric.enable
+          ? this.$t('core.player.desktop_lyric_off')
+          : this.$t('core.player.desktop_lyric_on')
+      }（${
+        this.setting.desktopLyric.isLock
+          ? this.$t('core.player.desktop_lyric_unlock')
+          : this.$t('core.player.desktop_lyric_lock')
+      }）`
+    },
   },
   mounted() {
     this.init()
@@ -287,7 +298,7 @@ export default {
       'setPlayedList',
       'removePlayedList',
     ]),
-    ...mapMutations(['setVolume', 'setPlayNextMode', 'setVisibleDesktopLyric']),
+    ...mapMutations(['setVolume', 'setPlayNextMode', 'setVisibleDesktopLyric', 'setLockDesktopLyric']),
     ...mapMutations('list', ['updateMusicInfo']),
     ...mapMutations(['setMediaDeviceId']),
     handleRegisterEvent(action) {
@@ -867,6 +878,9 @@ export default {
     toggleDesktopLyric() {
       this.setVisibleDesktopLyric(!this.setting.desktopLyric.enable)
     },
+    handleToggleLockDesktopLyric() {
+      this.setLockDesktopLyric(!this.setting.desktopLyric.isLock)
+    },
     toggleNextPlayMode() {
       let index = playNextModes.indexOf(this.setting.player.togglePlayMethod)
       if (++index >= playNextModes.length) index = -1
@@ -1147,6 +1161,7 @@ export default {
   display: flex;
   padding-top: 2px;
   // justify-content: space-between;
+  height: 16px;
   align-items: center;
 }
 

src/renderer/lang/en-us/core/player.json

@@ -21,6 +21,8 @@
   "add_music_to": "Add the current song to...",
   "desktop_lyric_on": "Open Desktop Lyrics",
   "desktop_lyric_off": "Close Desktop Lyrics",
+  "desktop_lyric_lock": "Right click to lock lyrics",
+  "desktop_lyric_unlock": "Right click to unlock lyrics",
   "play_toggle_mode_list_loop": "List Loop",
   "play_toggle_mode_random": "List Random",
   "play_toggle_mode_list": "Play in order",

src/renderer/lang/zh-cn/core/player.json

@@ -21,6 +21,8 @@
   "add_music_to": "添加当前歌曲到...",
   "desktop_lyric_on": "开启桌面歌词",
   "desktop_lyric_off": "关闭桌面歌词",
+  "desktop_lyric_lock": "右击锁定歌词",
+  "desktop_lyric_unlock": "右击解锁歌词",
   "play_toggle_mode_list_loop": "列表循环",
   "play_toggle_mode_random": "列表随机",
   "play_toggle_mode_list": "顺序播放",

src/renderer/lang/zh-tw/core/player.json

@@ -21,6 +21,8 @@
   "add_music_to": "添加當前歌曲到...",
   "desktop_lyric_on": "開啟桌面歌詞",
   "desktop_lyric_off": "關閉桌面歌詞",
+  "desktop_lyric_lock": "右擊鎖定歌詞",
+  "desktop_lyric_unlock": "右擊解鎖歌詞",
   "play_toggle_mode_list_loop": "列表循環",
   "play_toggle_mode_random": "列表隨機",
   "play_toggle_mode_list": "順序播放",

src/renderer/store/mutations.js

@@ -55,6 +55,9 @@ export default {
   setVisibleDesktopLyric(state, val) {
     state.setting.desktopLyric.enable = val
   },
+  setLockDesktopLyric(state, val) {
+    state.setting.desktopLyric.isLock = val
+  },
   setMediaDeviceId(state, val) {
     state.setting.player.mediaDeviceId = val
   },

src/renderer/views/Setting.vue

@@ -605,6 +605,9 @@ export default {
     'setting.desktopLyric.enable'(n) {
       this.current_setting.desktopLyric.enable = n
     },
+    'setting.desktopLyric.isLock'(n) {
+      this.current_setting.desktopLyric.isLock = n
+    },
     'setting.player.togglePlayMethod'(n) {
       this.current_setting.player.togglePlayMethod = n
     },