From 8743372d9b4ae7bc3646c8d31fe5029f1fc994bb Mon Sep 17 00:00:00 2001
From: linju <linju@dcloud.io>
Date: Tue, 5 Sep 2023 14:48:46 +0800
Subject: [PATCH] =?UTF-8?q?=E6=9B=B4=E6=96=B0=20=E7=A4=BA=E4=BE=8B?=
 =?UTF-8?q?=E9=A1=B9=E7=9B=AE=20pull-zoom-image=20=E6=BB=9A=E5=8A=A8?=
 =?UTF-8?q?=E5=88=B0=E5=BA=95=E5=90=8E=E7=A6=81=E6=AD=A2=E4=B8=8A=E6=8B=89?=
 =?UTF-8?q?=EF=BC=8C=E4=BC=98=E5=8C=96=E8=99=9A=E6=8B=9F=E6=BB=9A=E5=8A=A8?=
 =?UTF-8?q?=E6=83=AF=E6=80=A7?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../pull-zoom-image/pull-zoom-image.uvue      | 47 ++++++++++++-------
 1 file changed, 30 insertions(+), 17 deletions(-)

diff --git a/pages/template/pull-zoom-image/pull-zoom-image.uvue b/pages/template/pull-zoom-image/pull-zoom-image.uvue
index 6a7f36bf..0ff6e971 100644
--- a/pages/template/pull-zoom-image/pull-zoom-image.uvue
+++ b/pages/template/pull-zoom-image/pull-zoom-image.uvue
@@ -38,19 +38,20 @@
           5. 请向上\向下拖动页面观察效果。
         </text>
       </view>
-      <view class="content-item" v-for="(item,index) in 10" :key="index">
-        <text class="text">content-{{item}}</text>
+      <view class="content-item" v-for="(item,index) in 15" :key="index">
+        <text class="text" style="padding-left: 4px;">{{item + 5}}. 占位</text>
       </view>
     </view>
   </view>
 </view>
 </template>
 
-<script>
+<script>
   let sY : number = 0,
       dY : number = 0,
       maxScrollTop:number = 0,
-      moveIng:boolean = false;
+      moveIng:boolean = false,
+      startMoveTime:number = 0;
   export default {
     data() {
       return {
@@ -62,7 +63,7 @@
     onReady() {
       uni.getSystemInfo({
         success: (e) => {
-          maxScrollTop = 1425 - e.screenHeight
+          maxScrollTop = 1750 - e.screenHeight
         }
       })
     },
@@ -77,13 +78,23 @@
         this.setINodeStyle("body", 'transform', `translateY(${this.y})`)
       },
       touchstart(e : TouchEvent) {
-        sY = e.touches[0].screenY;
+        sY = e.touches[0].screenY;
+        //计时
+        startMoveTime = 0
       },
       touchmove(e : TouchEvent) {
         this.y += e.touches[0].screenY - sY;
         dY = e.touches[0].screenY - sY
         sY = e.touches[0].screenY;
+        // 限制滚动到底后上拉
+        if(this.y < maxScrollTop*-1){
+          this.y = maxScrollTop*-1
+        }
         this.doMove()
+        //计时
+        if(startMoveTime === 0){
+          startMoveTime = Date.now()
+        }
       },
       touchend() {
         // console.log('touchend')
@@ -91,18 +102,18 @@
           return
         }
         moveIng = true
-        function moveTo(y : number, callback : () => void, speed : number = 10) {
+        function moveTo(y : number, callback : () => void, speed : number = 10,acceleration : number = 0.2) {
           let interval : number = 0
-          let acceleration : number = 1
+          let _acceleration : number = 1
           interval = setInterval(() => {
             // 加速度
-            acceleration += 0.2
+            _acceleration += acceleration
 
             const dy = y - this.y
-            if (Math.abs(dy) < 1) {
+            if (Math.abs(dy) < 3) {
               this.y = y
             } else {
-              this.y += dy / speed * acceleration
+              this.y += dy / speed * _acceleration
             }
 
             this.doMove()
@@ -113,10 +124,14 @@
           }, 16)
         }
         // console.log('dY',dY);
-        console.log('this.y',this.y);
+        // console.log('this.y',this.y);
         if(this.y < 0){
-          // console.log(dY);
-          let endY = this.y + dY * 30
+          let speed:number = dY/(Date.now() - startMoveTime) * 1000
+          let inertia = speed * 3
+          if( Math.abs(inertia) < 100 ){
+            inertia = inertia > 0 ? 100 : -100;
+          }
+          let endY = this.y + inertia
           // 滚动边界限制
           if(endY < maxScrollTop*-1){
             endY = maxScrollTop*-1
@@ -126,12 +141,10 @@
           }
           // console.log('endY',endY);
           moveTo(endY, () => {
-            // console.log('done');
             moveIng = false
-          },5)
+          },10,0.1)
         }else{
           moveTo(0, () => {
-            // console.log('done');
             moveIng = false
           })
         }
-- 
GitLab