Skip to content

feat: 新增页面磨砂效果,优化主题配色与背景配置 - #29

Merged
Re-BeiChen merged 3 commits into
SPlayer-Dev:devfrom
Shomi-FJS:Webview-FIX
May 29, 2026
Merged

Re-BeiChen merged 3 commits into
SPlayer-Dev:devfrom
Shomi-FJS:Webview-FIX

Conversation

@Shomi-FJS

Copy link
Copy Markdown

📌 变更类型

  • ✨ feat — 新功能
  • 🐞 fix — Bug 修复
  • 🎨 style — 仅样式 / 格式,不影响逻辑
  • ♻️ refactor — 重构,不改变外部行为
  • ⚡ perf — 性能优化
  • 📝 docs — 仅文档
  • 🧪 test — 新增 / 修改测试
  • 🔧 chore — 构建 / 脚本 / 依赖
  • 🚀 ci — 仅 CI 配置
  • ⏪ revert — 回滚

📝 变更说明

本次改动围绕自定义背景、封面取色和主题跟随封面逻辑进行优化。

  • 重构封面取色逻辑
    将封面颜色量化与主题色生成逻辑拆分到独立 Web Worker 中执行,减少切歌或封面更新时对主线程的阻塞。

  • 优化封面取色性能
    主线程保留图片加载与 canvas 采样,耗时较高的颜色量化任务交给 Worker 处理,并保留主线程回退逻辑,提升兼容性和稳定性。

  • 新增页面磨砂模糊配置
    新增页面磨砂模糊滑块,支持 0-20px 自定义模糊程度,用于控制自定义背景下的 UI 磨砂效果。

  • 调整背景遮罩透明度范围
    将背景遮罩透明度范围调整为 0-80,默认值改为 20,减少高透明度遮罩导致背景层次过重的问题。

  • 完善 UI 磨砂效果覆盖范围
    为布局、导航、卡片、弹窗、浮层等组件补充磨砂效果支持,并将磨砂 CSS 变量提升到全局根节点,确保 Teleport 到 body 的组件也能正确继承。

  • 优化主题跟随封面的判断逻辑
    增加封面主题色合法性校验,避免冷启动时空对象被误判为有效主题,导致主题覆盖为空。

  • 移除 songCoverTheme 持久化存储
    封面主题色不再持久化,避免冷启动读取旧封面主题造成不一致,同时减少不必要的状态恢复和主线程压力。

  • 重构颜色工具函数
    拆分取色算法、Worker 通信与主题应用逻辑,提高代码职责清晰度和后续维护性。

📱 影响范围

  • 🎵 播放引擎 / 音频
  • 📝 歌词 / 桌面歌词
  • 🔔 通知栏 / MediaSession
  • 🌐 在线音乐 (网易云 / Jellyfin / Navidrome / Emby / Subsonic / Last.fm)
  • 🧩 内置 API (nodejs-mobile)
  • 🎨 UI / 主题 / 布局
  • 📦 构建 / 打包 / 签名
  • 📱 Capacitor / 原生 Android 代码
  • 📄 文档 / README

✅ 自检清单

  • 本 PR 目标分支为 dev
  • 本地已执行 pnpm lint 且无 warning
  • 本地已执行 pnpm typecheck 且无报错
  • 已在 至少一台真机 上构建并验证关键路径
  • UI 改动已兼顾 手机竖屏 + 平板横屏 两种布局
  • 新增 / 修改的文案使用中文,与项目整体风格一致
  • 未引入不必要的依赖 / 大体积资源
  • 未修改签名密钥 / CI Secrets 相关文件

🧪 测试方式

  1. 执行 pnpm lint,确认无 warning 和 error。
  2. 开启自定义背景,分别调整背景遮罩透明度和页面磨砂模糊滑块,检查布局、导航、卡片、弹窗和浮层的显示效果。
  3. 开启主题跟随封面,切换不同歌曲封面,确认主题色能正常更新,冷启动时不会出现空主题或默认主题异常覆盖。

💬 其他说明 (选填)

封面取色已接入 Web Worker,并保留主线程回退逻辑。若 Worker 创建失败、执行超时或运行异常,仍会回退到主线程完成取色,避免影响主题色生成。

Shomi-FJS added 3 commits May 28, 2026 22:45
- 重构封面取色逻辑,使用Web Worker分离取色任务避免主线程阻塞
- 调整背景遮罩透明度范围为0-80,默认值改为20
- 新增页面磨砂模糊滑块,支持0-20px自定义模糊程度
- 为布局、导航、卡片等组件添加磨砂效果支持
- 优化主题跟随封面的判断逻辑,增加颜色合法性校验
- 移除songCoverTheme的持久化存储,减少主线程阻塞
- 重构颜色工具函数,拆分取色逻辑到独立Worker文件
- 调整背景动画帧率为45、流动速度为1
- 降低背景渲染缩放比例至0.3
- 减小歌词字体大小至40
- 启用在线TTML歌词功能
- 将页面磨砂效果的默认值从0修改为4,优化初始界面视觉效果
@Re-BeiChen
Re-BeiChen merged commit 624d6aa into SPlayer-Dev:dev May 29, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants