Skip to content

Commit 5a9abe3

Browse files
kazukokawagawakazukokawagawa
committed
feat(任务栏歌词): 为任务栏和独立窗口模式添加独立的样式配置
- 将原有的 lineHeight、fontSize、mainScale、subScale 配置拆分为 taskbar* 和 floating* 版本 - 在设置界面中根据当前显示模式分别显示和保存对应配置 - 支持向后兼容，从旧配置中读取默认值
1 parent 39623e1 commit 5a9abe3

4 files changed

Lines changed: 96 additions & 37 deletions

File tree

‎electron/main/ipc/ipc-taskbar.ts‎

Lines changed: 12 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,10 @@ let cachedIsPlaying = false;
1010

1111
const getTaskbarConfig = (): TaskbarConfig => {
1212
const store = useStore();
13+
const legacyLineHeight = store.get("taskbar.lineHeight", 1.1);
14+
const legacyFontSize = store.get("taskbar.fontSize", 14);
15+
const legacyMainScale = store.get("taskbar.mainScale", 1.0);
16+
const legacySubScale = store.get("taskbar.subScale", 0.8);
1317
return {
1418
mode: store.get("taskbar.mode", "taskbar"),
1519
maxWidth: store.get("taskbar.maxWidth", 300),
@@ -33,10 +37,14 @@ const getTaskbarConfig = (): TaskbarConfig => {
3337
singleLineMode: store.get("taskbar.singleLineMode", false),
3438
showWordLyrics: store.get("taskbar.showWordLyrics", true),
3539
showTranslation: store.get("taskbar.showTranslation", true),
36-
lineHeight: store.get("taskbar.lineHeight", 1.1),
37-
fontSize: store.get("taskbar.fontSize", 14),
38-
mainScale: store.get("taskbar.mainScale", 1.0),
39-
subScale: store.get("taskbar.subScale", 0.8),
40+
taskbarLineHeight: store.get("taskbar.taskbarLineHeight", legacyLineHeight),
41+
floatingLineHeight: store.get("taskbar.floatingLineHeight", legacyLineHeight),
42+
taskbarFontSize: store.get("taskbar.taskbarFontSize", legacyFontSize),
43+
floatingFontSize: store.get("taskbar.floatingFontSize", legacyFontSize),
44+
taskbarMainScale: store.get("taskbar.taskbarMainScale", legacyMainScale),
45+
floatingMainScale: store.get("taskbar.floatingMainScale", legacyMainScale),
46+
taskbarSubScale: store.get("taskbar.taskbarSubScale", legacySubScale),
47+
floatingSubScale: store.get("taskbar.floatingSubScale", legacySubScale),
4048
};
4149
};
4250

‎src/components/Setting/config/lyric.ts‎

Lines changed: 52 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -1169,15 +1169,24 @@ export const useLyricSettings = (): SettingConfig => {
11691169
key: "taskbarLyricLineHeight",
11701170
label: "行间距",
11711171
type: "input-number",
1172-
description: "设置任务栏歌词的行高（倍数）",
1172+
description: "只作用于当前显示模式的行高（倍数）",
11731173
min: 0.8,
11741174
max: 3.0,
11751175
step: 0.1,
11761176
value: computed({
1177-
get: () => taskbarLyricConfig.lineHeight,
1177+
get: () =>
1178+
taskbarLyricConfig.mode === "floating"
1179+
? taskbarLyricConfig.floatingLineHeight
1180+
: taskbarLyricConfig.taskbarLineHeight,
11781181
set: (v) => {
1179-
taskbarLyricConfig.lineHeight = v ?? 1.1;
1180-
saveTaskbarLyricConfig({ lineHeight: taskbarLyricConfig.lineHeight });
1182+
const next = v ?? 1.1;
1183+
if (taskbarLyricConfig.mode === "floating") {
1184+
taskbarLyricConfig.floatingLineHeight = next;
1185+
saveTaskbarLyricConfig({ floatingLineHeight: next });
1186+
} else {
1187+
taskbarLyricConfig.taskbarLineHeight = next;
1188+
saveTaskbarLyricConfig({ taskbarLineHeight: next });
1189+
}
11811190
},
11821191
}),
11831192
defaultValue: 1.1,
@@ -1186,34 +1195,51 @@ export const useLyricSettings = (): SettingConfig => {
11861195
key: "taskbarLyricFontSize",
11871196
label: "文字大小",
11881197
type: "input-number",
1189-
description: "设置任务栏歌词的基准文字大小",
1198+
description: "只作用于当前显示模式的基准文字大小",
11901199
min: 10,
11911200
max: 30,
11921201
step: 1,
11931202
suffix: "px",
11941203
value: computed({
1195-
get: () => taskbarLyricConfig.fontSize,
1204+
get: () =>
1205+
taskbarLyricConfig.mode === "floating"
1206+
? taskbarLyricConfig.floatingFontSize
1207+
: taskbarLyricConfig.taskbarFontSize,
11961208
set: (v) => {
1197-
taskbarLyricConfig.fontSize = v ?? 14;
1198-
saveTaskbarLyricConfig({ fontSize: taskbarLyricConfig.fontSize });
1209+
const next = v ?? 14;
1210+
if (taskbarLyricConfig.mode === "floating") {
1211+
taskbarLyricConfig.floatingFontSize = next;
1212+
saveTaskbarLyricConfig({ floatingFontSize: next });
1213+
} else {
1214+
taskbarLyricConfig.taskbarFontSize = next;
1215+
saveTaskbarLyricConfig({ taskbarFontSize: next });
1216+
}
11991217
},
12001218
}),
1201-
show: () => taskbarLyricConfig.mode === "taskbar",
12021219
defaultValue: 14,
12031220
},
12041221
{
12051222
key: "taskbarLyricMainScale",
12061223
label: "主歌词缩放",
12071224
type: "input-number",
1208-
description: "设置主歌词的缩放比例",
1225+
description: "只作用于当前显示模式的主歌词缩放比例",
12091226
min: 0.5,
12101227
max: 1.5,
12111228
step: 0.05,
12121229
value: computed({
1213-
get: () => taskbarLyricConfig.mainScale,
1230+
get: () =>
1231+
taskbarLyricConfig.mode === "floating"
1232+
? taskbarLyricConfig.floatingMainScale
1233+
: taskbarLyricConfig.taskbarMainScale,
12141234
set: (v) => {
1215-
taskbarLyricConfig.mainScale = v ?? 1.0;
1216-
saveTaskbarLyricConfig({ mainScale: taskbarLyricConfig.mainScale });
1235+
const next = v ?? 1.0;
1236+
if (taskbarLyricConfig.mode === "floating") {
1237+
taskbarLyricConfig.floatingMainScale = next;
1238+
saveTaskbarLyricConfig({ floatingMainScale: next });
1239+
} else {
1240+
taskbarLyricConfig.taskbarMainScale = next;
1241+
saveTaskbarLyricConfig({ taskbarMainScale: next });
1242+
}
12171243
},
12181244
}),
12191245
defaultValue: 1.0,
@@ -1222,15 +1248,24 @@ export const useLyricSettings = (): SettingConfig => {
12221248
key: "taskbarLyricSubScale",
12231249
label: "副歌词缩放",
12241250
type: "input-number",
1225-
description: "设置副歌词（翻译/下一句）的缩放比例",
1251+
description: "只作用于当前显示模式的副歌词缩放比例",
12261252
min: 0.5,
12271253
max: 1.0,
12281254
step: 0.05,
12291255
value: computed({
1230-
get: () => taskbarLyricConfig.subScale,
1256+
get: () =>
1257+
taskbarLyricConfig.mode === "floating"
1258+
? taskbarLyricConfig.floatingSubScale
1259+
: taskbarLyricConfig.taskbarSubScale,
12311260
set: (v) => {
1232-
taskbarLyricConfig.subScale = v ?? 0.8;
1233-
saveTaskbarLyricConfig({ subScale: taskbarLyricConfig.subScale });
1261+
const next = v ?? 0.8;
1262+
if (taskbarLyricConfig.mode === "floating") {
1263+
taskbarLyricConfig.floatingSubScale = next;
1264+
saveTaskbarLyricConfig({ floatingSubScale: next });
1265+
} else {
1266+
taskbarLyricConfig.taskbarSubScale = next;
1267+
saveTaskbarLyricConfig({ taskbarSubScale: next });
1268+
}
12341269
},
12351270
}),
12361271
defaultValue: 0.8,

‎src/types/shared/taskbar-ipc.ts‎

Lines changed: 24 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -45,14 +45,22 @@ export interface TaskbarConfig {
4545
showWordLyrics: boolean;
4646
/** 显示翻译 */
4747
showTranslation: boolean;
48-
/** 行间距 */
49-
lineHeight: number;
50-
/** 字体大小 */
51-
fontSize: number;
52-
/** 主歌词缩放比例 */
53-
mainScale: number;
54-
/** 副歌词缩放比例 */
55-
subScale: number;
48+
/** 任务栏模式行间距 */
49+
taskbarLineHeight: number;
50+
/** 独立窗口行间距 */
51+
floatingLineHeight: number;
52+
/** 任务栏模式字体大小 */
53+
taskbarFontSize: number;
54+
/** 独立窗口字体大小 */
55+
floatingFontSize: number;
56+
/** 任务栏模式主歌词缩放比例 */
57+
taskbarMainScale: number;
58+
/** 独立窗口主歌词缩放比例 */
59+
floatingMainScale: number;
60+
/** 任务栏模式副歌词缩放比例 */
61+
taskbarSubScale: number;
62+
/** 独立窗口副歌词缩放比例 */
63+
floatingSubScale: number;
5664
}
5765

5866
export interface TrackData {
@@ -140,10 +148,14 @@ export const DEFAULT_TASKBAR_CONFIG: TaskbarConfig = {
140148
singleLineMode: false,
141149
showWordLyrics: true,
142150
showTranslation: true,
143-
lineHeight: 1.1,
144-
fontSize: 14,
145-
mainScale: 1.0,
146-
subScale: 0.8,
151+
taskbarLineHeight: 1.1,
152+
floatingLineHeight: 1.1,
153+
taskbarFontSize: 14,
154+
floatingFontSize: 14,
155+
taskbarMainScale: 1.0,
156+
floatingMainScale: 1.0,
157+
taskbarSubScale: 0.8,
158+
floatingSubScale: 0.8,
147159
};
148160

149161
export const TASKBAR_IPC_CHANNELS = {

‎src/views/TaskbarLyric/index.vue‎

Lines changed: 8 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -157,15 +157,19 @@ const onCoverError = () => {
157157
};
158158
159159
const rootStyle = computed<CSSProperties>(() => {
160+
const fontSize = isFloating.value ? taskbarConfig.floatingFontSize : taskbarConfig.taskbarFontSize;
161+
const lineHeight = isFloating.value ? taskbarConfig.floatingLineHeight : taskbarConfig.taskbarLineHeight;
162+
const mainScale = isFloating.value ? taskbarConfig.floatingMainScale : taskbarConfig.taskbarMainScale;
163+
const subScale = isFloating.value ? taskbarConfig.floatingSubScale : taskbarConfig.taskbarSubScale;
160164
const style: CSSProperties = {
161165
"--dynamic-opacity": state.opacity,
162166
"--dynamic-blur": `${state.blurVal}px`,
163167
"--lyric-font-family": lyricFontFamily.value,
164168
"--lyric-font-weight": String(taskbarConfig.fontWeight),
165-
"--lyric-font-size": `${taskbarConfig.fontSize}px`,
166-
"--lyric-line-height": String(taskbarConfig.lineHeight),
167-
"--lyric-main-scale": String(taskbarConfig.mainScale),
168-
"--lyric-sub-scale": String(taskbarConfig.subScale),
169+
"--lyric-font-size": `${fontSize}px`,
170+
"--lyric-line-height": String(lineHeight),
171+
"--lyric-main-scale": String(mainScale),
172+
"--lyric-sub-scale": String(subScale),
169173
};
170174
171175
if (state.themeColor) {

0 commit comments

Comments
 (0)