Browse Source

去掉两边的边距 指法显示隐藏的时候重新计算滚动区域的宽度

黄琪勇 1 year ago
parent
commit
5890dc1f3b
3 changed files with 13 additions and 2 deletions
  1. 0 2
      src/page-instrument/view-detail/index.module.less
  2. 12 0
      src/state.ts
  3. 1 0
      src/view/tick/index.module.less

+ 0 - 2
src/page-instrument/view-detail/index.module.less

@@ -47,7 +47,6 @@
         position: sticky;
         top: 36px;
         height: calc(100vh - 36px);
-        margin: 0 10px;
         border-radius: 10px;
         transition: height .2s;
         transition: padding-bottom .2s;
@@ -55,7 +54,6 @@
     }
     .pcContainer {
         height: calc(100vh - var(--header-height) - var(--pc-header-height));
-        margin: 0 24px;
     }
     .fingeringCon{
         transition: scale 0.2s;

+ 12 - 0
src/state.ts

@@ -1708,3 +1708,15 @@ export const refreshMusicSvg = () => {
   }
   musicScoreRef.value?.refreshMusicScore()
 }
+
+// 指法改变显示的时候 osdmScrollDomWith 宽度会变化 所以指法改变的时候这个宽度重新计算
+watch(
+  () => state.setting.displayFingering,
+  () => {
+    nextTick(()=>{
+      if (smoothAnimationState.osdmScrollDom) {
+        smoothAnimationState.osdmScrollDomWith = smoothAnimationState.osdmScrollDom.offsetWidth | 0
+      }
+    })
+  }
+)

+ 1 - 0
src/view/tick/index.module.less

@@ -4,6 +4,7 @@
     align-items: center;
     position: absolute;
     transform: translateY(-100%);
+    z-index: 1;
     .dot{
         width: 13Px;
         height: 13Px;