ソースを参照

fix: 谱面滚动逻辑修改

TIANYONG 7 ヶ月 前
コミット
c83a909153
2 ファイル変更9 行追加5 行削除
  1. 8 4
      src/state.ts
  2. 1 1
      src/view/selection/index.tsx

+ 8 - 4
src/state.ts

@@ -1373,30 +1373,34 @@ export const scrollViewNote = (resetTop?: boolean) => {
   // }
   const domId = "vf" + noteId;
   // 合并休止小节没有音符,取小节的位置,否则取音符指针位置
-  const cursorElement: any = !noteId && state.times[state.activeNoteIndex]?.totalMultipleRestMeasures ? document.querySelector(`.measureIndex_${state.activeMeasureIndex-1}`) : document.querySelector(`[data-vf=${domId}]`)?.parentElement;
+  const cursorElement: any = !noteId && state.times[state.activeNoteIndex]?.totalMultipleRestMeasures ? document.querySelector(`.measureIndex_${state.activeMeasureIndex}`) : document.querySelector(`[data-vf=${domId}]`)?.parentElement;
   const musicAndSelection = document.getElementById(state.scrollContainer)!;
   if (!state.headTopHeight) {
     state.headTopHeight = document.querySelector('.headHeight')?.getBoundingClientRect()?.height || 100;
   }
-  // console.log('滑动',cursorElement.offsetTop,offsetTop, cursorElement, )
+  // console.log('滑动',musicAndSelection?.scrollTop, musicScrollTop)
+  if (!cursorElement || !musicAndSelection) {
+    return
+  }
   if (Math.abs(musicAndSelection?.scrollTop - musicScrollTop) > 30) {
     // 手动滑动谱面,重新播放需要滚动到对应位置
   } else {
-    if (!cursorElement || !musicAndSelection || offsetTop === cursorElement.offsetTop || Math.abs(offsetTop - cursorElement.offsetTop) < 30) return;
+    if (offsetTop === cursorElement.offsetTop || Math.abs(offsetTop - cursorElement.offsetTop) < 30) return;
   }
   offsetTop = cursorElement.offsetTop;
   if (offsetTop > (state.headTopHeight + 30)) {
+    musicScrollTop = (offsetTop - state.headTopHeight - 30) * state.musicZoom
     musicAndSelection.scrollTo({
       top: (offsetTop - state.headTopHeight - 30) * state.musicZoom,
       behavior: "smooth",
     });
   } else {
+    musicScrollTop = 0
     musicAndSelection.scrollTo({
       top: 0,
       behavior: "smooth",
     });
   }
-  musicScrollTop = musicAndSelection.scrollTop;
 };
 
 /** 检测是否是节奏练习 */

+ 1 - 1
src/view/selection/index.tsx

@@ -310,7 +310,7 @@ export default defineComponent({
 											styles.position,
 											// scoreItem ? `scoreItemLeve${scoreItem.leve}` : "", // 去掉评测小节得分的背景色
 											(state.platform === IPlatform.PC && state.zoom > 0.8) ? styles.linePC : '',
-											`measureIndex_${item.index}`
+											`measureIndex_${item.MeasureNumberXML}`
 										]}
 										style={item.staveBox}
 										onClick={() => handleSelection(item)}