Showing
1 changed file
with
64 additions
and
5 deletions
| @@ -2,6 +2,8 @@ import { Action, NewspaperListBean, NewspaperListItemBean, NewspaperPositionItem | @@ -2,6 +2,8 @@ import { Action, NewspaperListBean, NewspaperListItemBean, NewspaperPositionItem | ||
| 2 | import { ExtraDTO } from 'wdBean/src/main/ets/bean/component/extra/ExtraDTO' | 2 | import { ExtraDTO } from 'wdBean/src/main/ets/bean/component/extra/ExtraDTO' |
| 3 | import { WDRouterRule } from 'wdRouter/Index' | 3 | import { WDRouterRule } from 'wdRouter/Index' |
| 4 | import { ENewspaperPageDialog } from '../dialog/ENewspaperPageDialog' | 4 | import { ENewspaperPageDialog } from '../dialog/ENewspaperPageDialog' |
| 5 | +import { Logger } from 'wdKit'; | ||
| 6 | +import { window } from '@kit.ArkUI'; | ||
| 5 | 7 | ||
| 6 | /** | 8 | /** |
| 7 | * 读报纸半屏弹窗 | 9 | * 读报纸半屏弹窗 |
| @@ -35,6 +37,12 @@ export struct ENewspaperListDialog { | @@ -35,6 +37,12 @@ export struct ENewspaperListDialog { | ||
| 35 | // listDialogController: CustomDialogController | 37 | // listDialogController: CustomDialogController |
| 36 | public closeDialog?: () => void | 38 | public closeDialog?: () => void |
| 37 | 39 | ||
| 40 | + // 手势滑动相关 | ||
| 41 | + private panOption: PanGestureOptions = new PanGestureOptions({ direction: PanDirection.Up | PanDirection.Down }) | ||
| 42 | + private topFixedHeight = 124 | ||
| 43 | + @State topHeight: number = 124 | ||
| 44 | + private deviceHeight: number = 0 | ||
| 45 | + | ||
| 38 | //watch监听报纸页码回调 | 46 | //watch监听报纸页码回调 |
| 39 | onCurrentPageNumUpdated(): void { | 47 | onCurrentPageNumUpdated(): void { |
| 40 | console.log("ENewspaperListDialog-onCurrentPageNumUpdated", "currentPageNum:", this.currentPageNum) | 48 | console.log("ENewspaperListDialog-onCurrentPageNumUpdated", "currentPageNum:", this.currentPageNum) |
| @@ -46,7 +54,13 @@ export struct ENewspaperListDialog { | @@ -46,7 +54,13 @@ export struct ENewspaperListDialog { | ||
| 46 | } | 54 | } |
| 47 | } | 55 | } |
| 48 | 56 | ||
| 49 | - aboutToAppear(): void { | 57 | + async aboutToAppear() { |
| 58 | + // 屏幕高度 - 滑动高度计算 | ||
| 59 | + let windowClass: window.Window = await window.getLastWindow(getContext(this)); | ||
| 60 | + let changeHeight = 85 + 44 + px2vp(windowClass.getWindowAvoidArea(window.AvoidAreaType.TYPE_SYSTEM).topRect.height) | ||
| 61 | + changeHeight += px2vp(windowClass.getWindowAvoidArea(window.AvoidAreaType.TYPE_SYSTEM).bottomRect.height) | ||
| 62 | + this.deviceHeight = px2vp(windowClass.getWindowProperties().windowRect.height) - changeHeight | ||
| 63 | + | ||
| 50 | this.isCurrentViewOpen = true | 64 | this.isCurrentViewOpen = true |
| 51 | console.log("ENewspaperListDialog-aboutToAppear", "currentPageNum:", this.currentPageNum) | 65 | console.log("ENewspaperListDialog-aboutToAppear", "currentPageNum:", this.currentPageNum) |
| 52 | let _scrollIndex = Number.parseInt(this.currentPageNum) | 66 | let _scrollIndex = Number.parseInt(this.currentPageNum) |
| @@ -56,15 +70,13 @@ export struct ENewspaperListDialog { | @@ -56,15 +70,13 @@ export struct ENewspaperListDialog { | ||
| 56 | } | 70 | } |
| 57 | 71 | ||
| 58 | aboutToDisappear() { | 72 | aboutToDisappear() { |
| 59 | - // if (this.pageListDialogController) { | ||
| 60 | - // this.pageListDialogController = null | ||
| 61 | - // } | ||
| 62 | this.isCurrentViewOpen = false | 73 | this.isCurrentViewOpen = false |
| 63 | } | 74 | } |
| 64 | 75 | ||
| 65 | build() { | 76 | build() { |
| 66 | Stack() { | 77 | Stack() { |
| 67 | Column() { | 78 | Column() { |
| 79 | + Column() { | ||
| 68 | Row() | 80 | Row() |
| 69 | .width(43) | 81 | .width(43) |
| 70 | .height(4) | 82 | .height(4) |
| @@ -110,6 +122,24 @@ export struct ENewspaperListDialog { | @@ -110,6 +122,24 @@ export struct ENewspaperListDialog { | ||
| 110 | .height(6) | 122 | .height(6) |
| 111 | .margin({ top: 20, left: 16, right: 16 }) | 123 | .margin({ top: 20, left: 16, right: 16 }) |
| 112 | .objectFit(ImageFit.Contain) | 124 | .objectFit(ImageFit.Contain) |
| 125 | + } | ||
| 126 | + .width('100%') | ||
| 127 | + .gesture( | ||
| 128 | + PanGesture(this.panOption) | ||
| 129 | + .onActionStart((event: GestureEvent) => { | ||
| 130 | + Logger.debug('ENewspaperListDialog','Pan start') | ||
| 131 | + }) | ||
| 132 | + .onActionUpdate((event: GestureEvent) => { | ||
| 133 | + if (this.topFixedHeight + event.offsetY >= this.topFixedHeight) { | ||
| 134 | + this.topHeight = this.topFixedHeight + event.offsetY | ||
| 135 | + } | ||
| 136 | + Logger.debug('ENewspaperListDialog', 'topHeight:' + this.topHeight) | ||
| 137 | + }) | ||
| 138 | + .onActionEnd(() => { | ||
| 139 | + this.onCloseGestureDialog() | ||
| 140 | + }) | ||
| 141 | + ) | ||
| 142 | + | ||
| 113 | 143 | ||
| 114 | List({ scroller: this.listScroller, initialIndex: this.scrollIndex }) { | 144 | List({ scroller: this.listScroller, initialIndex: this.scrollIndex }) { |
| 115 | ForEach(this.newspaperListBean?.list, (item: NewspaperListItemBean, index: number) => { | 145 | ForEach(this.newspaperListBean?.list, (item: NewspaperListItemBean, index: number) => { |
| @@ -252,7 +282,9 @@ export struct ENewspaperListDialog { | @@ -252,7 +282,9 @@ export struct ENewspaperListDialog { | ||
| 252 | // } | 282 | // } |
| 253 | }) | 283 | }) |
| 254 | } | 284 | } |
| 255 | - .margin({ top: 124 }) | 285 | + // .margin({ top: 124 }) |
| 286 | + .margin({ top: this.topHeight }) | ||
| 287 | + | ||
| 256 | .width('100%') | 288 | .width('100%') |
| 257 | .backgroundColor(Color.White) | 289 | .backgroundColor(Color.White) |
| 258 | .expandSafeArea([SafeAreaType.SYSTEM], [SafeAreaEdge.BOTTOM]) | 290 | .expandSafeArea([SafeAreaType.SYSTEM], [SafeAreaEdge.BOTTOM]) |
| @@ -267,6 +299,33 @@ export struct ENewspaperListDialog { | @@ -267,6 +299,33 @@ export struct ENewspaperListDialog { | ||
| 267 | this.closeDialog() | 299 | this.closeDialog() |
| 268 | } | 300 | } |
| 269 | }) | 301 | }) |
| 302 | + .gesture( | ||
| 303 | + PanGesture(this.panOption) | ||
| 304 | + .onActionStart((event: GestureEvent) => { | ||
| 305 | + Logger.debug('ENewspaperListDialog','Pan start') | ||
| 306 | + }) | ||
| 307 | + .onActionUpdate((event: GestureEvent) => { | ||
| 308 | + if (event) { | ||
| 309 | + if (this.topFixedHeight + event.offsetY >= this.topFixedHeight) { | ||
| 310 | + this.topHeight = this.topFixedHeight + event.offsetY | ||
| 311 | + } | ||
| 312 | + Logger.debug('ENewspaperListDialog', 'topHeight:' + this.topHeight) | ||
| 313 | + } | ||
| 314 | + }) | ||
| 315 | + .onActionEnd(() => { | ||
| 316 | + this.onCloseGestureDialog() | ||
| 317 | + }) | ||
| 318 | + ) | ||
| 319 | + } | ||
| 320 | + | ||
| 321 | + onCloseGestureDialog() { | ||
| 322 | + if (this.topHeight >= this.deviceHeight ) { | ||
| 323 | + if (this.closeDialog) { | ||
| 324 | + this.closeDialog() | ||
| 325 | + } | ||
| 326 | + } else { | ||
| 327 | + this.topHeight = this.topFixedHeight | ||
| 328 | + } | ||
| 270 | } | 329 | } |
| 271 | 330 | ||
| 272 | updateRecordsData() { | 331 | updateRecordsData() { |
-
Please register or login to post a comment