diff --git a/src/components/AMLL/LyricPlayer.vue b/src/components/AMLL/LyricPlayer.vue index 67ae53650..97ac3ecf9 100644 --- a/src/components/AMLL/LyricPlayer.vue +++ b/src/components/AMLL/LyricPlayer.vue @@ -227,7 +227,7 @@ const syncPlaybackTime = (time: number) => { const player = getInternalPlayer(); if (!player) return; - const previousHotLines = new Set(player.hotLines ?? []); + const previousHotLines: Set = new Set(player.hotLines ?? []); player.setCurrentTime(time, false); syncNewHotLineAnimations(player, previousHotLines, time); }; @@ -262,7 +262,9 @@ onMounted(() => { const wrapper = wrapperRef.value; if (wrapper) { playerRef.value = new CoreLyricPlayer(); - wrapper.appendChild(playerRef.value.getElement()); + const el = playerRef.value.getElement(); + el.style.touchAction = "none"; + wrapper.appendChild(el); playerRef.value.addEventListener("line-click", lineClickHandler); playerRef.value.addEventListener("line-contextmenu", lineContextMenuHandler); } @@ -278,23 +280,36 @@ onUnmounted(() => { } }); -// 动画帧更新 +// 限制单帧最大时间步长,避免后台恢复后动画突跳 +// 设为 120ms 兼顾低端机偶发卡顿(≈30fps 下 33ms/帧),同时防止可见性切换前累计的大 delta 一次注入 +const MAX_FRAME_DELTA = 120; + watchEffect((onCleanup) => { if (!props.disabled) { let canceled = false; let lastTime = -1; + const resetLastTime = () => { + lastTime = -1; + }; + const onVisibility = () => { + resetLastTime(); + }; + document.addEventListener("visibilitychange", onVisibility); const onFrame = (time: number) => { if (canceled) return; if (lastTime === -1) { lastTime = time; } - playerRef.value?.update(time - lastTime); + const rawDelta = time - lastTime; + const delta = rawDelta > MAX_FRAME_DELTA ? MAX_FRAME_DELTA : rawDelta; + playerRef.value?.update(delta); lastTime = time; requestAnimationFrame(onFrame); }; requestAnimationFrame(onFrame); onCleanup(() => { canceled = true; + document.removeEventListener("visibilitychange", onVisibility); }); } }); diff --git a/src/components/List/SongList.vue b/src/components/List/SongList.vue index 451236cc2..f911fc3e9 100644 --- a/src/components/List/SongList.vue +++ b/src/components/List/SongList.vue @@ -122,7 +122,7 @@ ? handlePointerDown($event, index, item.data.name || '未知曲目') : undefined " - @touchstart=" + @touchstart.passive=" draggable ? handlePointerDown($event, index, item.data.name || '未知曲目') : undefined diff --git a/src/components/Player/FullPlayer.vue b/src/components/Player/FullPlayer.vue index 779e60684..a744e018d 100644 --- a/src/components/Player/FullPlayer.vue +++ b/src/components/Player/FullPlayer.vue @@ -134,8 +134,6 @@ const onMobileEnter = (el: Element, done: () => void) => { parent.style.transform = "translate3d(0, 100vh, 0) scale(0.92)"; parent.style.borderRadius = "28px"; parent.style.backfaceVisibility = "hidden"; - parent.style.backdropFilter = "blur(48px)"; - parent.style.contain = "paint"; // 强制重排,确保起始状态生效 parent.getBoundingClientRect(); requestAnimationFrame(() => { @@ -148,8 +146,6 @@ const onMobileEnter = (el: Element, done: () => void) => { parent.style.willChange = ""; parent.style.transformOrigin = ""; parent.style.backfaceVisibility = ""; - parent.style.backdropFilter = ""; - parent.style.contain = ""; done(); }, 380); }; @@ -165,8 +161,6 @@ const onMobileLeave = (el: Element, done: () => void) => { parent.style.transition = MOBILE_CARD_LEAVE; parent.style.borderRadius = "28px"; parent.style.backfaceVisibility = "hidden"; - parent.style.backdropFilter = "blur(48px)"; - parent.style.contain = "paint"; requestAnimationFrame(() => { parent.style.transform = "translate3d(0, 100vh, 0) scale(0.92)"; }); @@ -339,13 +333,13 @@ watch( onMounted(() => { mainCoverColor.value = statusStore.mainColor; if (isElectron && settingStore.preventSleep) { - window.electron.ipcRenderer.send("prevent-sleep", true); + window.electron?.ipcRenderer.send("prevent-sleep", true); } }); onBeforeUnmount(() => { stopShow(); - if (isElectron) window.electron.ipcRenderer.send("prevent-sleep", false); + if (isElectron) window.electron?.ipcRenderer.send("prevent-sleep", false); }); diff --git a/src/components/Player/FullPlayerMobile.vue b/src/components/Player/FullPlayerMobile.vue index 5aaab6878..d0841d09a 100644 --- a/src/components/Player/FullPlayerMobile.vue +++ b/src/components/Player/FullPlayerMobile.vue @@ -1,3 +1,7 @@ + +