fix: 注释移动支持距离顶部或底部太近时拖拽滚动

packages/core/src/annotation/freetext.js

@@ -581,6 +581,9 @@ export default class Shape extends Base {
       this.outerLine.addEventListener('mousedown', this.onMousedown)
       this.outerLine.addEventListener('dblclick', this.onDbclick)
       this.outerLine.addEventListener('touchstart', this.onMousedown)
+      const documentViewer = this.layer.documentViewer
+      const scrollElement = documentViewer.getScrollViewElement()
+      scrollElement.style.touchAction = 'none'
     }
   }
 
@@ -603,9 +606,9 @@ export default class Shape extends Base {
     this.outerLine?.removeEventListener('dblclick', this.onDbclick)
     this.outerLineContainer?.remove()
 
-    if (this.layer.selectedElementName === this.annotation.name) {
-      this.layer.selectedElementName = null
-    }
+    const documentViewer = this.layer.documentViewer
+    const scrollElement = documentViewer.getScrollViewElement()
+    scrollElement.style.touchAction = 'auto'
   }
 
   handleStopPropagation (event) {
@@ -767,7 +770,36 @@ export default class Shape extends Base {
         left = pageX - (startState.clickX - leftTop.x);
         top = pageY - (startState.clickY - leftTop.y);
         right = pageX - (startState.clickX - rightBottom.x);
-        bottom = pageY - (startState.clickY - rightBottom.y);  
+        bottom = pageY - (startState.clickY - rightBottom.y);
+
+        const windowPoint1 = documentViewer.pageToWindow({
+          x: left,
+          y: top
+        }, this.page + 1, false)
+        const windowPoint2 = documentViewer.pageToWindow({
+          x: right,
+          y: bottom
+        }, this.page + 1, false)
+        let x = 0, y = 0
+        if (pageY > startState.clickY) {
+          y = scrollElement.offsetHeight - (windowPoint2.y - scrollElement.scrollTop - scrollElement.offsetTop)
+          y = y < 100 ? 5 : 0
+        } else if (pageY < startState.clickY) {
+          y = windowPoint1.y - scrollElement.scrollTop - scrollElement.offsetTop
+          y = y < 100 ? -5 : 0
+        }
+        if (pageX > startState.clickX) {
+          x = scrollElement.offsetWidth - (windowPoint2.x - scrollElement.scrollLeft - scrollElement.offsetLeft)
+          x = x < 100 ? 5 : 0
+        } else if (pageX < startState.clickX) {
+          x = (windowPoint1.x - scrollElement.scrollLeft - scrollElement.offsetLeft)
+          x = x < 100 ? -5 : 0
+        }
+
+        if (x || y) {
+          scrollElement.scrollTop += y
+          scrollElement.scrollLeft += x
+        }
 
         const rect = {
           width: Math.abs(left - right),

packages/core/src/annotation/ink.js

@@ -117,6 +117,10 @@ export default class Ink extends Base {
       this.outerLine.addEventListener('mousedown', this.onMousedown)
       this.outerLine.addEventListener('touchstart', this.onMousedown)
       document.addEventListener('keydown', this.onKeydown)
+
+      const documentViewer = this.layer.documentViewer
+      const scrollElement = documentViewer.getScrollViewElement()
+      scrollElement.style.touchAction = 'none'
     }
   }
 
@@ -138,6 +142,10 @@ export default class Ink extends Base {
     this.outerLine?.removeEventListener('mousedown', this.onMousedown)
     this.outerLine?.removeEventListener('touchstart', this.onMousedown)
     this.outerLineContainer?.remove()
+
+    const documentViewer = this.layer.documentViewer
+    const scrollElement = documentViewer.getScrollViewElement()
+    scrollElement.style.touchAction = 'auto'
   }
 
 
@@ -413,6 +421,35 @@ export default class Ink extends Base {
         x2 = pageX - (startState.clickX - end.x);
         y2 = pageY - (startState.clickY - end.y);
 
+        const windowPoint1 = documentViewer.pageToWindow({
+          x: x1,
+          y: y1
+        }, this.page + 1, false)
+        const windowPoint2 = documentViewer.pageToWindow({
+          x: x2,
+          y: y2
+        }, this.page + 1, false)
+        let x = 0, y = 0
+        if (pageY > startState.clickY) {
+          y = scrollElement.offsetHeight - (windowPoint2.y - scrollElement.scrollTop - scrollElement.offsetTop)
+          y = y < 100 ? 5 : 0
+        } else if (pageY < startState.clickY) {
+          y = windowPoint1.y - scrollElement.scrollTop - scrollElement.offsetTop
+          y = y < 100 ? -5 : 0
+        }
+        if (pageX > startState.clickX) {
+          x = scrollElement.offsetWidth - (windowPoint2.x - scrollElement.scrollLeft - scrollElement.offsetLeft)
+          x = x < 100 ? 5 : 0
+        } else if (pageX < startState.clickX) {
+          x = (windowPoint1.x - scrollElement.scrollLeft - scrollElement.offsetLeft)
+          x = x < 100 ? -5 : 0
+        }
+
+        if (x || y) {
+          scrollElement.scrollTop += y
+          scrollElement.scrollLeft += x
+        }
+
         const rect = {
           width: Math.abs(start.x -end.x),
           height: Math.abs(start.y -end.y)

packages/core/src/annotation/line.js

@@ -263,6 +263,10 @@ export default class Line extends Base {
     this.outerLine?.removeEventListener('mousedown', this.onMousedown)
     this.outerLine?.removeEventListener('touchstart', this.onMousedown)
     this.outerLineContainer?.remove()
+
+    const documentViewer = this.layer.documentViewer
+    const scrollElement = documentViewer.getScrollViewElement()
+    scrollElement.style.touchAction = 'auto'
   }
 
   getActualPoint (
@@ -374,6 +378,10 @@ export default class Line extends Base {
       this.outerLine.addEventListener('mousedown', this.onMousedown)
       this.outerLine.addEventListener('touchstart', this.onMousedown)
       document.addEventListener('keydown', this.onKeydown)
+
+      const documentViewer = this.layer.documentViewer
+      const scrollElement = documentViewer.getScrollViewElement()
+      scrollElement.style.touchAction = 'none'
     }
   }
 
@@ -474,6 +482,35 @@ export default class Line extends Base {
         x2 = pageX - (startState.clickX - this.end.x);
         y2 = pageY - (startState.clickY - this.end.y);
 
+        const windowPoint1 = documentViewer.pageToWindow({
+          x: x1,
+          y: y1
+        }, this.page + 1, false)
+        const windowPoint2 = documentViewer.pageToWindow({
+          x: x2,
+          y: y2
+        }, this.page + 1, false)
+        let x = 0, y = 0
+        if (pageY > startState.clickY) {
+          y = scrollElement.offsetHeight - (windowPoint2.y - scrollElement.scrollTop - scrollElement.offsetTop)
+          y = y < 100 ? 5 : 0
+        } else if (pageY < startState.clickY) {
+          y = windowPoint1.y - scrollElement.scrollTop - scrollElement.offsetTop
+          y = y < 100 ? -5 : 0
+        }
+        if (pageX > startState.clickX) {
+          x = scrollElement.offsetWidth - (windowPoint2.x - scrollElement.scrollLeft - scrollElement.offsetLeft)
+          x = x < 100 ? 5 : 0
+        } else if (pageX < startState.clickX) {
+          x = (windowPoint1.x - scrollElement.scrollLeft - scrollElement.offsetLeft)
+          x = x < 100 ? -5 : 0
+        }
+
+        if (x || y) {
+          scrollElement.scrollTop += y
+          scrollElement.scrollLeft += x
+        }
+
         const rect = {
           width: Math.abs(start.x -end.x),
           height: Math.abs(start.y -end.y)

packages/core/src/annotation/link.js

@@ -419,6 +419,10 @@ export default class Link extends Base {
       this.outerLine.addEventListener('touchstart', this.onMousedown)
 
       this.eventBus.dispatch('linkPanelChange', this.annotation)
+
+      const documentViewer = this.layer.documentViewer
+      const scrollElement = documentViewer.getScrollViewElement()
+      scrollElement.style.touchAction = 'none'
     }
   }
 
@@ -456,6 +460,10 @@ export default class Link extends Base {
     if (!this.annotation.url && !this.annotation.destPage) {
       this.handleDelete()
     }
+
+    const documentViewer = this.layer.documentViewer
+    const scrollElement = documentViewer.getScrollViewElement()
+    scrollElement.style.touchAction = 'auto'
   }
 
   handleMouseDown (event) {
@@ -613,6 +621,35 @@ export default class Link extends Base {
         x2 = pageX - (startState.clickX - this.end.x);
         y2 = pageY - (startState.clickY - this.end.y);
 
+        const windowPoint1 = documentViewer.pageToWindow({
+          x: x1,
+          y: y1
+        }, this.page + 1, false)
+        const windowPoint2 = documentViewer.pageToWindow({
+          x: x2,
+          y: y2
+        }, this.page + 1, false)
+        let x = 0, y = 0
+        if (pageY > startState.clickY) {
+          y = scrollElement.offsetHeight - (windowPoint2.y - scrollElement.scrollTop - scrollElement.offsetTop)
+          y = y < 100 ? 5 : 0
+        } else if (pageY < startState.clickY) {
+          y = windowPoint1.y - scrollElement.scrollTop - scrollElement.offsetTop
+          y = y < 100 ? -5 : 0
+        }
+        if (pageX > startState.clickX) {
+          x = scrollElement.offsetWidth - (windowPoint2.x - scrollElement.scrollLeft - scrollElement.offsetLeft)
+          x = x < 100 ? 5 : 0
+        } else if (pageX < startState.clickX) {
+          x = (windowPoint1.x - scrollElement.scrollLeft - scrollElement.offsetLeft)
+          x = x < 100 ? -5 : 0
+        }
+
+        if (x || y) {
+          scrollElement.scrollTop += y
+          scrollElement.scrollLeft += x
+        }
+
         const rect = {
           width: Math.abs(start.x -end.x),
           height: Math.abs(start.y -end.y)

packages/core/src/annotation/shape.js

@@ -422,6 +422,10 @@ export default class Shape extends Base {
       this.container.append(this.outerLineContainer)
       this.outerLine.addEventListener('mousedown', this.onMousedown)
       this.outerLine.addEventListener('touchstart', this.onMousedown)
+
+      const documentViewer = this.layer.documentViewer
+      const scrollElement = documentViewer.getScrollViewElement()
+      scrollElement.style.touchAction = 'none'
     }
   }
 
@@ -440,6 +444,10 @@ export default class Shape extends Base {
     this.outerLine?.removeEventListener('mousedown', this.onMousedown)
     this.outerLine?.removeEventListener('touchstart', this.onMousedown)
     this.outerLineContainer?.remove()
+
+    const documentViewer = this.layer.documentViewer
+    const scrollElement = documentViewer.getScrollViewElement()
+    scrollElement.style.touchAction = 'auto'
   }
 
   handleMouseDown (event) {
@@ -594,10 +602,37 @@ export default class Shape extends Base {
         x1 = pageX - (startState.clickX - this.start.x);
         x2 = pageX - (startState.clickX - this.end.x);
         y2 = pageY - (startState.clickY - this.end.y);
+        const windowPoint1 = documentViewer.pageToWindow({
+          x: x1,
+          y: y1
+        }, this.page + 1, false)
+        const windowPoint2 = documentViewer.pageToWindow({
+          x: x2,
+          y: y2
+        }, this.page + 1, false)
+        let x = 0, y = 0
+        if (pageY > startState.clickY) {
+          y = scrollElement.offsetHeight - (windowPoint2.y - scrollElement.scrollTop - scrollElement.offsetTop)
+          y = y < 100 ? 5 : 0
+        } else if (pageY < startState.clickY) {
+          y = windowPoint1.y - scrollElement.scrollTop - scrollElement.offsetTop
+          y = y < 100 ? -5 : 0
+        }
+        if (pageX > startState.clickX) {
+          x = scrollElement.offsetWidth - (windowPoint2.x - scrollElement.scrollLeft - scrollElement.offsetLeft)
+          x = x < 100 ? 5 : 0
+        } else if (pageX < startState.clickX) {
+          x = (windowPoint1.x - scrollElement.scrollLeft - scrollElement.offsetLeft)
+          x = x < 100 ? -5 : 0
+        }
 
+        if (x || y) {
+          scrollElement.scrollTop += y
+          scrollElement.scrollLeft += x
+        }
         const rect = {
-          width: Math.abs(start.x -end.x),
-          height: Math.abs(start.y -end.y)
+          width: Math.abs(start.x - end.x),
+          height: Math.abs(start.y - end.y)
         }
         if (x1 < x2) {
           x1 = Math.max(0, x1)

packages/core/src/annotation/stamp.js

@@ -388,6 +388,10 @@ export default class Stamp extends Base {
       this.container.append(this.outerLineContainer)
       this.outerLine.addEventListener('mousedown', this.onMousedown)
       this.outerLine.addEventListener('touchstart', this.onMousedown)
+
+      const documentViewer = this.layer.documentViewer
+      const scrollElement = documentViewer.getScrollViewElement()
+      scrollElement.style.touchAction = 'none'
     }
   }
 
@@ -415,6 +419,10 @@ export default class Stamp extends Base {
     this.outerLine?.removeEventListener('mousedown', this.onMousedown)
     this.outerLine?.removeEventListener('touchstart', this.onMousedown)
     this.outerLineContainer?.remove()
+
+    const documentViewer = this.layer.documentViewer
+    const scrollElement = documentViewer.getScrollViewElement()
+    scrollElement.style.touchAction = 'auto'
   }
 
   handleMouseDown (event) {
@@ -574,6 +582,35 @@ export default class Stamp extends Base {
         x2 = pageX - (startState.clickX - this.end.x);
         y2 = pageY - (startState.clickY - this.end.y);
 
+        const windowPoint1 = documentViewer.pageToWindow({
+          x: x1,
+          y: y1
+        }, this.page + 1, false)
+        const windowPoint2 = documentViewer.pageToWindow({
+          x: x2,
+          y: y2
+        }, this.page + 1, false)
+        let x = 0, y = 0
+        if (pageY > startState.clickY) {
+          y = scrollElement.offsetHeight - (windowPoint2.y - scrollElement.scrollTop - scrollElement.offsetTop)
+          y = y < 100 ? 5 : 0
+        } else if (pageY < startState.clickY) {
+          y = windowPoint1.y - scrollElement.scrollTop - scrollElement.offsetTop
+          y = y < 100 ? -5 : 0
+        }
+        if (pageX > startState.clickX) {
+          x = scrollElement.offsetWidth - (windowPoint2.x - scrollElement.scrollLeft - scrollElement.offsetLeft)
+          x = x < 100 ? 5 : 0
+        } else if (pageX < startState.clickX) {
+          x = (windowPoint1.x - scrollElement.scrollLeft - scrollElement.offsetLeft)
+          x = x < 100 ? -5 : 0
+        }
+
+        if (x || y) {
+          scrollElement.scrollTop += y
+          scrollElement.scrollLeft += x
+        }
+
         const rect = {
           width: Math.abs(start.x -end.x),
           height: Math.abs(start.y -end.y)

packages/core/src/annotation/text.js

@@ -198,6 +198,35 @@ export default class Text extends Base {
       x2 = pageX - (startState.clickX - this.end.x);
       y2 = pageY - (startState.clickY - this.end.y);
 
+      const windowPoint1 = documentViewer.pageToWindow({
+        x: x1,
+        y: y1
+      }, this.page + 1, false)
+      const windowPoint2 = documentViewer.pageToWindow({
+        x: x2,
+        y: y2
+      }, this.page + 1, false)
+      let x = 0, y = 0
+      if (pageY > startState.clickY) {
+        y = scrollElement.offsetHeight - (windowPoint2.y - scrollElement.scrollTop - scrollElement.offsetTop)
+        y = y < 100 ? 5 : 0
+      } else if (pageY < startState.clickY) {
+        y = windowPoint1.y - scrollElement.scrollTop - scrollElement.offsetTop
+        y = y < 100 ? -5 : 0
+      }
+      if (pageX > startState.clickX) {
+        x = scrollElement.offsetWidth - (windowPoint2.x - scrollElement.scrollLeft - scrollElement.offsetLeft)
+        x = x < 100 ? 5 : 0
+      } else if (pageX < startState.clickX) {
+        x = (windowPoint1.x - scrollElement.scrollLeft - scrollElement.offsetLeft)
+        x = x < 100 ? -5 : 0
+      }
+
+      if (x || y) {
+        scrollElement.scrollTop += y
+        scrollElement.scrollLeft += x
+      }
+
       const rect = {
         width: Math.abs(start.x -end.x),
         height: Math.abs(start.y -end.y)
@@ -248,6 +277,10 @@ export default class Text extends Base {
     document.removeEventListener('mouseup', this.onMouseup)
     document.removeEventListener('touchmove', this.onMousemove)
     document.removeEventListener('touchend', this.onMouseup)
+
+    const documentViewer = this.layer.documentViewer
+    const scrollElement = documentViewer.getScrollViewElement()
+    scrollElement.style.touchAction = 'auto'
     this.scrollLeft = 0
     this.scrollTop = 0
 
@@ -413,6 +446,10 @@ export default class Text extends Base {
 
         this.eventBus.dispatch('annotationSelected', annotationData)
       }
+
+      const documentViewer = this.layer.documentViewer
+      const scrollElement = documentViewer.getScrollViewElement()
+      scrollElement.style.touchAction = 'none'
     }
   }
 
@@ -449,6 +486,7 @@ export default class Text extends Base {
     annotationContainer.innerHTML = this.textNoteStr
     annotationContainer.addEventListener('click', this.onClick)
     annotationContainer.addEventListener('mousedown', this.onMousedown)
+    annotationContainer.addEventListener('touchstart', this.onMousedown)
     this.annotationContainer = annotationContainer
   }
 

packages/core/src/form/check_box.js

@@ -517,6 +517,10 @@ export default class CheckBox extends Base {
       this.outerLine.addEventListener('touchstart', this.onMousedown)
 
       this.eventBus.dispatch('propertyChange', this.annotation)
+
+      const documentViewer = this.layer.documentViewer
+      const scrollElement = documentViewer.getScrollViewElement()
+      scrollElement.style.touchAction = 'none'
     }
   }
 
@@ -578,6 +582,10 @@ export default class CheckBox extends Base {
     this.outerLine?.removeEventListener('touchstart', this.onMousedown)
     this.outerLineContainer?.remove()
 
+    const documentViewer = this.layer.documentViewer
+    const scrollElement = documentViewer.getScrollViewElement()
+    scrollElement.style.touchAction = 'auto'
+
     this.eventBus._off('checkboxPropertyPanelChanged', this.handlePropertyPanel)
   }
 
@@ -734,6 +742,35 @@ export default class CheckBox extends Base {
         x2 = pageX - (startState.clickX - this.end.x);
         y2 = pageY - (startState.clickY - this.end.y);
 
+        const windowPoint1 = documentViewer.pageToWindow({
+          x: x1,
+          y: y1
+        }, this.page + 1, false)
+        const windowPoint2 = documentViewer.pageToWindow({
+          x: x2,
+          y: y2
+        }, this.page + 1, false)
+        let x = 0, y = 0
+        if (pageY > startState.clickY) {
+          y = scrollElement.offsetHeight - (windowPoint2.y - scrollElement.scrollTop - scrollElement.offsetTop)
+          y = y < 100 ? 5 : 0
+        } else if (pageY < startState.clickY) {
+          y = windowPoint1.y - scrollElement.scrollTop - scrollElement.offsetTop
+          y = y < 100 ? -5 : 0
+        }
+        if (pageX > startState.clickX) {
+          x = scrollElement.offsetWidth - (windowPoint2.x - scrollElement.scrollLeft - scrollElement.offsetLeft)
+          x = x < 100 ? 5 : 0
+        } else if (pageX < startState.clickX) {
+          x = (windowPoint1.x - scrollElement.scrollLeft - scrollElement.offsetLeft)
+          x = x < 100 ? -5 : 0
+        }
+
+        if (x || y) {
+          scrollElement.scrollTop += y
+          scrollElement.scrollLeft += x
+        }
+
         const rect = {
           width: Math.abs(start.x -end.x),
           height: Math.abs(start.y -end.y)

packages/core/src/form/combo_box.js

@@ -515,6 +515,10 @@ export default class ComboBox extends Base {
       this.outerLine.addEventListener('touchstart', this.onMousedown)
 
       this.eventBus.dispatch('propertyChange', this.annotation)
+
+      const documentViewer = this.layer.documentViewer
+      const scrollElement = documentViewer.getScrollViewElement()
+      scrollElement.style.touchAction = 'none'
     }
   }
 
@@ -552,6 +556,10 @@ export default class ComboBox extends Base {
     this.outerLine?.removeEventListener('touchstart', this.onMousedown)
     this.outerLineContainer?.remove()
 
+    const documentViewer = this.layer.documentViewer
+    const scrollElement = documentViewer.getScrollViewElement()
+    scrollElement.style.touchAction = 'auto'
+
     this.eventBus._off('comboBoxPropertyPanelChanged', this.handlePropertyPanel)
   }
 
@@ -708,6 +716,35 @@ export default class ComboBox extends Base {
         x2 = pageX - (startState.clickX - this.end.x);
         y2 = pageY - (startState.clickY - this.end.y);
 
+        const windowPoint1 = documentViewer.pageToWindow({
+          x: x1,
+          y: y1
+        }, this.page + 1, false)
+        const windowPoint2 = documentViewer.pageToWindow({
+          x: x2,
+          y: y2
+        }, this.page + 1, false)
+        let x = 0, y = 0
+        if (pageY > startState.clickY) {
+          y = scrollElement.offsetHeight - (windowPoint2.y - scrollElement.scrollTop - scrollElement.offsetTop)
+          y = y < 100 ? 5 : 0
+        } else if (pageY < startState.clickY) {
+          y = windowPoint1.y - scrollElement.scrollTop - scrollElement.offsetTop
+          y = y < 100 ? -5 : 0
+        }
+        if (pageX > startState.clickX) {
+          x = scrollElement.offsetWidth - (windowPoint2.x - scrollElement.scrollLeft - scrollElement.offsetLeft)
+          x = x < 100 ? 5 : 0
+        } else if (pageX < startState.clickX) {
+          x = (windowPoint1.x - scrollElement.scrollLeft - scrollElement.offsetLeft)
+          x = x < 100 ? -5 : 0
+        }
+
+        if (x || y) {
+          scrollElement.scrollTop += y
+          scrollElement.scrollLeft += x
+        }
+
         const rect = {
           width: Math.abs(start.x -end.x),
           height: Math.abs(start.y -end.y)

packages/core/src/form/list_box.js

@@ -480,6 +480,10 @@ export default class ListBox extends Base {
       this.outerLine.addEventListener('touchstart', this.onMousedown)
 
       this.eventBus.dispatch('propertyChange', this.annotation)
+
+      const documentViewer = this.layer.documentViewer
+      const scrollElement = documentViewer.getScrollViewElement()
+      scrollElement.style.touchAction = 'none'
     }
   }
 
@@ -528,6 +532,10 @@ export default class ListBox extends Base {
     this.outerLine?.removeEventListener('touchstart', this.onMousedown)
     this.outerLineContainer?.remove()
 
+    const documentViewer = this.layer.documentViewer
+    const scrollElement = documentViewer.getScrollViewElement()
+    scrollElement.style.touchAction = 'auto'
+
     this.eventBus._off('listBoxPropertyPanelChanged', this.handlePropertyPanel)
   }
 
@@ -684,6 +692,35 @@ export default class ListBox extends Base {
         x2 = pageX - (startState.clickX - this.end.x);
         y2 = pageY - (startState.clickY - this.end.y);
 
+        const windowPoint1 = documentViewer.pageToWindow({
+          x: x1,
+          y: y1
+        }, this.page + 1, false)
+        const windowPoint2 = documentViewer.pageToWindow({
+          x: x2,
+          y: y2
+        }, this.page + 1, false)
+        let x = 0, y = 0
+        if (pageY > startState.clickY) {
+          y = scrollElement.offsetHeight - (windowPoint2.y - scrollElement.scrollTop - scrollElement.offsetTop)
+          y = y < 100 ? 5 : 0
+        } else if (pageY < startState.clickY) {
+          y = windowPoint1.y - scrollElement.scrollTop - scrollElement.offsetTop
+          y = y < 100 ? -5 : 0
+        }
+        if (pageX > startState.clickX) {
+          x = scrollElement.offsetWidth - (windowPoint2.x - scrollElement.scrollLeft - scrollElement.offsetLeft)
+          x = x < 100 ? 5 : 0
+        } else if (pageX < startState.clickX) {
+          x = (windowPoint1.x - scrollElement.scrollLeft - scrollElement.offsetLeft)
+          x = x < 100 ? -5 : 0
+        }
+
+        if (x || y) {
+          scrollElement.scrollTop += y
+          scrollElement.scrollLeft += x
+        }
+
         const rect = {
           width: Math.abs(start.x - end.x),
           height: Math.abs(start.y - end.y)

packages/core/src/form/push_button.js

@@ -457,6 +457,10 @@ export default class PushButton extends Base {
       this.outerLine.addEventListener('touchstart', this.onMousedown)
 
       this.eventBus.dispatch('propertyChange', this.annotation)
+
+      const documentViewer = this.layer.documentViewer
+      const scrollElement = documentViewer.getScrollViewElement()
+      scrollElement.style.touchAction = 'none'
     }
   }
 
@@ -504,6 +508,10 @@ export default class PushButton extends Base {
     this.outerLine?.removeEventListener('touchstart', this.onMousedown)
     this.outerLineContainer?.remove()
 
+    const documentViewer = this.layer.documentViewer
+    const scrollElement = documentViewer.getScrollViewElement()
+    scrollElement.style.touchAction = 'auto'
+
     this.eventBus._off('pushButtonPropertyPanelChanged', this.handlePropertyPanel)
   }
 
@@ -660,6 +668,35 @@ export default class PushButton extends Base {
         x2 = pageX - (startState.clickX - this.end.x);
         y2 = pageY - (startState.clickY - this.end.y);
 
+        const windowPoint1 = documentViewer.pageToWindow({
+          x: x1,
+          y: y1
+        }, this.page + 1, false)
+        const windowPoint2 = documentViewer.pageToWindow({
+          x: x2,
+          y: y2
+        }, this.page + 1, false)
+        let x = 0, y = 0
+        if (pageY > startState.clickY) {
+          y = scrollElement.offsetHeight - (windowPoint2.y - scrollElement.scrollTop - scrollElement.offsetTop)
+          y = y < 100 ? 5 : 0
+        } else if (pageY < startState.clickY) {
+          y = windowPoint1.y - scrollElement.scrollTop - scrollElement.offsetTop
+          y = y < 100 ? -5 : 0
+        }
+        if (pageX > startState.clickX) {
+          x = scrollElement.offsetWidth - (windowPoint2.x - scrollElement.scrollLeft - scrollElement.offsetLeft)
+          x = x < 100 ? 5 : 0
+        } else if (pageX < startState.clickX) {
+          x = (windowPoint1.x - scrollElement.scrollLeft - scrollElement.offsetLeft)
+          x = x < 100 ? -5 : 0
+        }
+
+        if (x || y) {
+          scrollElement.scrollTop += y
+          scrollElement.scrollLeft += x
+        }
+
         const rect = {
           width: Math.abs(start.x -end.x),
           height: Math.abs(start.y -end.y)

packages/core/src/form/radio_button.js

@@ -518,6 +518,10 @@ export default class RadioButton extends Base {
       this.outerLine.addEventListener('touchstart', this.onMousedown)
 
       this.eventBus.dispatch('propertyChange', this.annotation)
+
+      const documentViewer = this.layer.documentViewer
+      const scrollElement = documentViewer.getScrollViewElement()
+      scrollElement.style.touchAction = 'none'
     }
   }
 
@@ -581,6 +585,10 @@ export default class RadioButton extends Base {
     this.outerLine?.removeEventListener('touchstart', this.onMousedown)
     this.outerLineContainer?.remove()
 
+    const documentViewer = this.layer.documentViewer
+    const scrollElement = documentViewer.getScrollViewElement()
+    scrollElement.style.touchAction = 'auto'
+
     this.eventBus._off('radioButtonPropertyPanelChanged', this.handlePropertyPanel)
   }
 
@@ -737,6 +745,35 @@ export default class RadioButton extends Base {
         x2 = pageX - (startState.clickX - this.end.x);
         y2 = pageY - (startState.clickY - this.end.y);
 
+        const windowPoint1 = documentViewer.pageToWindow({
+          x: x1,
+          y: y1
+        }, this.page + 1, false)
+        const windowPoint2 = documentViewer.pageToWindow({
+          x: x2,
+          y: y2
+        }, this.page + 1, false)
+        let x = 0, y = 0
+        if (pageY > startState.clickY) {
+          y = scrollElement.offsetHeight - (windowPoint2.y - scrollElement.scrollTop - scrollElement.offsetTop)
+          y = y < 100 ? 5 : 0
+        } else if (pageY < startState.clickY) {
+          y = windowPoint1.y - scrollElement.scrollTop - scrollElement.offsetTop
+          y = y < 100 ? -5 : 0
+        }
+        if (pageX > startState.clickX) {
+          x = scrollElement.offsetWidth - (windowPoint2.x - scrollElement.scrollLeft - scrollElement.offsetLeft)
+          x = x < 100 ? 5 : 0
+        } else if (pageX < startState.clickX) {
+          x = (windowPoint1.x - scrollElement.scrollLeft - scrollElement.offsetLeft)
+          x = x < 100 ? -5 : 0
+        }
+
+        if (x || y) {
+          scrollElement.scrollTop += y
+          scrollElement.scrollLeft += x
+        }
+
         const rect = {
           width: Math.abs(start.x -end.x),
           height: Math.abs(start.y -end.y)

packages/core/src/form/signature_fields.js

@@ -408,6 +408,10 @@ export default class SignatureFields extends Base {
       this.container.append(this.outerLineContainer)
       this.outerLine.addEventListener('mousedown', this.onMousedown)
       this.outerLine.addEventListener('touchstart', this.onMousedown)
+
+      const documentViewer = this.layer.documentViewer
+      const scrollElement = documentViewer.getScrollViewElement()
+      scrollElement.style.touchAction = 'none'
     }
   }
 
@@ -440,6 +444,10 @@ export default class SignatureFields extends Base {
     this.outerLine?.removeEventListener('mousedown', this.onMousedown)
     this.outerLine?.removeEventListener('touchstart', this.onMousedown)
     this.outerLineContainer?.remove()
+
+    const documentViewer = this.layer.documentViewer
+    const scrollElement = documentViewer.getScrollViewElement()
+    scrollElement.style.touchAction = 'auto'
   }
 
   handleMouseDown (event) {
@@ -595,6 +603,35 @@ export default class SignatureFields extends Base {
         x2 = pageX - (startState.clickX - this.end.x);
         y2 = pageY - (startState.clickY - this.end.y);
 
+        const windowPoint1 = documentViewer.pageToWindow({
+          x: x1,
+          y: y1
+        }, this.page + 1, false)
+        const windowPoint2 = documentViewer.pageToWindow({
+          x: x2,
+          y: y2
+        }, this.page + 1, false)
+        let x = 0, y = 0
+        if (pageY > startState.clickY) {
+          y = scrollElement.offsetHeight - (windowPoint2.y - scrollElement.scrollTop - scrollElement.offsetTop)
+          y = y < 100 ? 5 : 0
+        } else if (pageY < startState.clickY) {
+          y = windowPoint1.y - scrollElement.scrollTop - scrollElement.offsetTop
+          y = y < 100 ? -5 : 0
+        }
+        if (pageX > startState.clickX) {
+          x = scrollElement.offsetWidth - (windowPoint2.x - scrollElement.scrollLeft - scrollElement.offsetLeft)
+          x = x < 100 ? 5 : 0
+        } else if (pageX < startState.clickX) {
+          x = (windowPoint1.x - scrollElement.scrollLeft - scrollElement.offsetLeft)
+          x = x < 100 ? -5 : 0
+        }
+
+        if (x || y) {
+          scrollElement.scrollTop += y
+          scrollElement.scrollLeft += x
+        }
+
         const rect = {
           width: Math.abs(start.x -end.x),
           height: Math.abs(start.y -end.y)

packages/core/src/form/text_field.js

@@ -434,6 +434,10 @@ export default class TextField extends Base {
       this.outerLine.addEventListener('touchstart', this.onMousedown)
 
       this.eventBus.dispatch('propertyChange', this.annotation)
+
+      const documentViewer = this.layer.documentViewer
+      const scrollElement = documentViewer.getScrollViewElement()
+      scrollElement.style.touchAction = 'none'
     }
   }
 
@@ -487,6 +491,10 @@ export default class TextField extends Base {
     this.outerLine.removeEventListener('touchstart', this.onMousedown)
     this.outerLineContainer.remove()
 
+    const documentViewer = this.layer.documentViewer
+    const scrollElement = documentViewer.getScrollViewElement()
+    scrollElement.style.touchAction = 'auto'
+
     this.eventBus._off('textfieldPropertyPanelChanged', this.handlePropertyPanel)
   }
 
@@ -666,6 +674,35 @@ export default class TextField extends Base {
         x2 = pageX - (startState.clickX - this.end.x);
         y2 = pageY - (startState.clickY - this.end.y);
 
+        const windowPoint1 = documentViewer.pageToWindow({
+          x: x1,
+          y: y1
+        }, this.page + 1, false)
+        const windowPoint2 = documentViewer.pageToWindow({
+          x: x2,
+          y: y2
+        }, this.page + 1, false)
+        let x = 0, y = 0
+        if (pageY > startState.clickY) {
+          y = scrollElement.offsetHeight - (windowPoint2.y - scrollElement.scrollTop - scrollElement.offsetTop)
+          y = y < 100 ? 5 : 0
+        } else if (pageY < startState.clickY) {
+          y = windowPoint1.y - scrollElement.scrollTop - scrollElement.offsetTop
+          y = y < 100 ? -5 : 0
+        }
+        if (pageX > startState.clickX) {
+          x = scrollElement.offsetWidth - (windowPoint2.x - scrollElement.scrollLeft - scrollElement.offsetLeft)
+          x = x < 100 ? 5 : 0
+        } else if (pageX < startState.clickX) {
+          x = (windowPoint1.x - scrollElement.scrollLeft - scrollElement.offsetLeft)
+          x = x < 100 ? -5 : 0
+        }
+
+        if (x || y) {
+          scrollElement.scrollTop += y
+          scrollElement.scrollLeft += x
+        }
+
         const rect = {
           width: Math.abs(start.x -end.x),
           height: Math.abs(start.y -end.y)

packages/core/src/index.js

@@ -2293,7 +2293,7 @@ class ComPDFKitViewer {
     }
   }
 
-  pageToWindow(coordinates, pageNumber) {
+  pageToWindow(coordinates, pageNumber, initial = true) {
     if (pageNumber > this.page && pageNumber < 1) return null
     const el = this.pdfViewer._pages[pageNumber - 1].div
     const left = el.offsetLeft
@@ -2301,8 +2301,8 @@ class ComPDFKitViewer {
 
     const scale = this.scale
     return {
-      x: coordinates.x * scale + left,
-      y: coordinates.y * scale + top
+      x: (initial ? coordinates.x * scale : coordinates.x) + left,
+      y: (initial ? coordinates.y * scale : coordinates.y) + top
     }
   }
 
@@ -2327,7 +2327,6 @@ class ComPDFKitViewer {
     viewer,
     thumbnailView,
     annotationView,
-    findbarView,
     toggleButton,
   }) {
     this.scrollContainer = container

packages/core/src/worker/compdfkit_worker.js

@@ -3276,7 +3276,7 @@ function setAnnotCreationDate(data) {
   const { annotPtr, date: rawDate } = data
 
   const date = stringToNewUTF8(convertToPDFTimestamp(rawDate))
-  Module._SetAnnotCreationDate(annotPtr, date)
+  const res = Module._SetAnnotCreationDate(annotPtr, date)
 }
 
 function setAnnotRect(data) {
@@ -3822,7 +3822,10 @@ function getReplyArray(pagePtr, annotPtr) {
   let reviewAnnotState, markedAnnotState
   for (let i = 0; i < AnnotArray.length; i++) {
     const replyPtr = AnnotArray[i]
-
+    const reply = {
+      annotPtr: replyPtr,
+      repliesIndex: i + 1,
+    }
     if (Module._IsReviewStateAnnot(replyPtr)) {
       stateInt = Module._GetState(replyPtr)
       reviewAnnotState = {
@@ -3841,23 +3844,16 @@ function getReplyArray(pagePtr, annotPtr) {
     }
 
     Module._GetAnnotAuthor(replyPtr)
-    const author = U8StringData
+    reply.author = U8StringData
     Module._GetAnnotCreationDate(replyPtr)
     const rawDate = U8StringData
-    const date = parseAdobePDFTimestamp(rawDate)
+    reply.date = parseAdobePDFTimestamp(rawDate)
     Module._GetAnnotContent(replyPtr)
-    const contents = U8StringData
+    reply.contents = U8StringData
     Module._GetAnnotTitle(replyPtr)
-    const title = U8StringData
+    reply.title = U8StringData
     
-    replies.push({
-      annotPtr: replyPtr,
-      repliesIndex: i + 1,
-      author,
-      date,
-      contents,
-      title
-    })
+    replies.push(reply)
   }
 
   return { replies, reviewAnnotState, markedAnnotState }