lxy/u-desktop
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

新增: 音频可视化壁纸主题（WASAPI+FFT+Canvas）

Browse Source
This commit is contained in:
绝尘
2026-05-30 22:29:19 +08:00
parent cd7247d880
commit 1f892fc390
13 changed files with 839 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

50
web-ui/src/settings/components/WallpaperSection.vue
View File

@@ -30,6 +30,43 @@
placeholder="输入显示文字"
class="bg-[var(--input-bg)] border border-[var(--input-border)] rounded-md text-[var(--text)] text-[11px] py-1 px-2 outline-none w-[140px] focus:border-[var(--input-border-focus)]">
</div>
<!-- 音频可视化设置 -->
<template v-if="s.theme === 'audio-viz'">
<div class="flex justify-between items-center px-3.5 py-2 border-t border-[var(--card-divider)]">
<div class="text-xs font-medium text-[var(--text-muted)]">可视化样式</div>
<div class="flex gap-1">
<button v-for="st in audioVizStyles" :key="st.value"
@click="s.audioVizStyle = st.value; go.saveAudioVizStyle(st.value)"
:class="s.audioVizStyle === st.value
? 'bg-[var(--accent)] border-[var(--accent)] text-[var(--text-strong)]'
: 'bg-[var(--input-bg)] border-[var(--input-border)] text-[var(--text)] hover:bg-[var(--card-border)]'"
class="border rounded-md text-[11px] py-0.5 px-2 font-[inherit] cursor-pointer transition-colors">{{ st.label }}</button>
</div>
</div>
<div class="flex justify-between items-center px-3.5 py-2 border-t border-[var(--card-divider)]">
<div class="text-xs font-medium text-[var(--text-muted)]">配色方案</div>
<div class="flex gap-1">
<button v-for="c in audioColors" :key="c.value"
@click="s.audioColorScheme = c.value; go.saveAudioColorScheme(c.value)"
:class="s.audioColorScheme === c.value
? 'bg-[var(--accent)] border-[var(--accent)] text-[var(--text-strong)]'
: 'bg-[var(--input-bg)] border-[var(--input-border)] text-[var(--text)] hover:bg-[var(--card-border)]'"
class="border rounded-md text-[11px] py-0.5 px-2 font-[inherit] cursor-pointer transition-colors">{{ c.label }}</button>
</div>
</div>
<div class="flex justify-between items-center px-3.5 py-2 border-t border-[var(--card-divider)]">
<div class="text-xs font-medium text-[var(--text-muted)]">灵敏度</div>
<input type="range" min="0.5" max="3" step="0.1" :value="s.audioSensitivity"
@input="s.audioSensitivity = +($event.target as HTMLInputElement).value; debounced('as', go.saveAudioSensitivity, s.audioSensitivity)"
class="w-[100px]">
</div>
<div class="flex justify-between items-center px-3.5 py-2 border-t border-[var(--card-divider)]">
<div class="text-xs font-medium text-[var(--text-muted)]">平滑度</div>
<input type="range" min="0" max="0.95" step="0.05" :value="s.audioSmoothing"
@input="s.audioSmoothing = +($event.target as HTMLInputElement).value; debounced('am', go.saveAudioSmoothing, s.audioSmoothing)"
class="w-[100px]">
</div>
</template>
</div>
<!-- 本地图片 -->
@@ -126,6 +163,19 @@ const wpTypes = [
{ value: 'color', label: '纯色/渐变' },
]
const audioVizStyles = [
{ value: 'bars', label: '柱状' },
{ value: 'waveform', label: '波形' },
{ value: 'circular', label: '环形' },
]
const audioColors = [
{ value: 'neon', label: '霓虹' },
{ value: 'ocean', label: '海洋' },
{ value: 'fire', label: '火焰' },
{ value: 'rainbow', label: '彩虹' },
]
// Bing
const bing = ref<BingState>({ date: '', title: '', copyright: '', url: '', fav: false, idx: 0, total: 0 })
const bingThumb = ref('')