自动签页面

src/main/ets/view/RefreshView.ets

@@ -5,57 +5,76 @@ type ItemType = (string | number | Object)
 @Preview
 @Component
 export struct RefreshView {
-  @Prop isLoading: boolean
-  @Prop data: ItemType[]
-  loadMore(){}
-  refresh(){}
+  @Link isLoading: boolean
+  @Prop data: Array<object>
+  onLoadMore?: () => void
+  onRefresh?: () => void
+  private startY: number = 0
+  private endY: number = 0
+  private lastNum: number = 0
+  private _openMore: boolean = false
 
   aboutToAppear(): void {
-    this.refresh()
+    // this.onRefresh && this.onRefresh()
   }
 
   // 使用父组件@Builder装饰的方法初始化子组件@BuilderParam
-  @BuilderParam customBuilderParam: (item:string) => void
+  @BuilderParam customBuilderParam: (item: ESObject, index: number) => void
 
   build() {
 
     Refresh({ refreshing: $$this.isLoading }) {
-      List() {
-        ForEach(this.data ?? [], (item: string) => {
-          ListItem() {
-            this.customBuilderParam(item)
+      if (this.data && this.data.length > 0) {
+        List() {
+          ForEach(this.data ?? [], (item: ESObject, index: number) => {
+            ListItem() {
+              this.customBuilderParam(item, index)
+            }
+          }, (index: number) => index.toString())
+        }
+        .onTouch((event: TouchEvent) => {
+          const e1 = event.touches[0]
+          switch (event.type) {
+            case TouchType.Down:
+              this._openMore = this.data && this.lastNum >= this.data.length && !this.isLoading
+              this.startY = e1.y
+              break
+          // case TouchType.Move:
+          //   this.endY = e1.y
+          //   if (this.endY - this.startY < -100) {
+          //     this.loadMore&&this.loadMore()
+          //   }
+          // break
+            case TouchType.Up:
+              this.endY = e1.y
+              if (this.endY - this.startY < -100 && this._openMore) {
+                this.onLoadMore && this.onLoadMore()
+              }
+              break
           }
-          .backgroundColor('blue')
-        }, (index: number) => index.toString())
+        })
+        .onScrollIndex((first: number, last: number) => {
+          this.lastNum = last
+        })
+        .width('100%')
+        .height('100%')
+        .alignListItem(ListItemAlign.Center)
+        .scrollBar(BarState.Off)
+      } else {
+        Text('暂无数据')
+          .width('100%')
+          .height('100%')
+          .textAlign(TextAlign.Center)
+        
       }
-      .onScrollStart(() => {
-        ToolsHelper.log('onScrollStart')
-      })
-      .onScrollStop(() => {
-        ToolsHelper.log('onScrollStop')
-      })
-      .onTouch((event: TouchEvent) => {
-        const e1 = event.touches[0]
-        ToolsHelper.log(`onTouch ${event.type}-${e1.x.toString()}-${e1.y.toString()}`)
-      })
-      .onScrollIndex((first: number, last: number) => {
-        ToolsHelper.log(`${first.toString()}-${last.toString()}`)
-      })
-      .width('100%')
-      .height('100%')
-      .alignListItem(ListItemAlign.Center)
-      .scrollBar(BarState.Off)
-    }.width('100%')
-    .backgroundColor('red')
+    }
+    .width('100%')
     .height('100%')
     .onStateChange((refreshStatus: RefreshStatus) => {
       ToolsHelper.log('Refresh onStatueChange state is ' + refreshStatus)
     })
     .onRefreshing(() => {
-      setTimeout(() => {
-        this.isLoading = false
-      }, 2000)
-      ToolsHelper.log('onRefreshing test')
+      this.onRefresh && this.onRefresh()
     })
   }
 }