Showing
1 changed file
with
57 additions
and
36 deletions
| @@ -36,6 +36,7 @@ export struct MultiPictureDetailPageComponent { | @@ -36,6 +36,7 @@ export struct MultiPictureDetailPageComponent { | ||
| 36 | private contentId: string = '' | 36 | private contentId: string = '' |
| 37 | private relType: string = '' | 37 | private relType: string = '' |
| 38 | private displayTool = display.getDefaultDisplaySync() | 38 | private displayTool = display.getDefaultDisplaySync() |
| 39 | + @State nShowDownloadTitleHeight: number = 0 | ||
| 39 | @State titleHeight: number = 0 | 40 | @State titleHeight: number = 0 |
| 40 | @State index: number = 0 | 41 | @State index: number = 0 |
| 41 | @State currentIndex: number = 0 | 42 | @State currentIndex: number = 0 |
| @@ -50,6 +51,7 @@ export struct MultiPictureDetailPageComponent { | @@ -50,6 +51,7 @@ export struct MultiPictureDetailPageComponent { | ||
| 50 | @State swiperIndex: number = 0; | 51 | @State swiperIndex: number = 0; |
| 51 | @Provide followStatus: string | undefined = undefined // 关注状态 | 52 | @Provide followStatus: string | undefined = undefined // 关注状态 |
| 52 | @Provide showCommentList: boolean = false | 53 | @Provide showCommentList: boolean = false |
| 54 | + private subScroller: Scroller = new Scroller() | ||
| 53 | private scroller: Scroller = new Scroller() | 55 | private scroller: Scroller = new Scroller() |
| 54 | @State netStatus: number | undefined = undefined // 存储网络状态用来展示缺省图 | 56 | @State netStatus: number | undefined = undefined // 存储网络状态用来展示缺省图 |
| 55 | @State isOffLine: boolean = false // 存储视频下线状态用来展示缺省图 | 57 | @State isOffLine: boolean = false // 存储视频下线状态用来展示缺省图 |
| @@ -63,6 +65,7 @@ export struct MultiPictureDetailPageComponent { | @@ -63,6 +65,7 @@ export struct MultiPictureDetailPageComponent { | ||
| 63 | followUserId: string = '' | 65 | followUserId: string = '' |
| 64 | followUserName: string = '' | 66 | followUserName: string = '' |
| 65 | @State isEnableSwipe: boolean = true; | 67 | @State isEnableSwipe: boolean = true; |
| 68 | + @State isScrollerTop: boolean = false; | ||
| 66 | 69 | ||
| 67 | //watch监听页码回调 | 70 | //watch监听页码回调 |
| 68 | onCurrentPageNumUpdated(): void { | 71 | onCurrentPageNumUpdated(): void { |
| @@ -74,7 +77,8 @@ export struct MultiPictureDetailPageComponent { | @@ -74,7 +77,8 @@ export struct MultiPictureDetailPageComponent { | ||
| 74 | 77 | ||
| 75 | async aboutToAppear() { | 78 | async aboutToAppear() { |
| 76 | //获取宽高尺寸 | 79 | //获取宽高尺寸 |
| 77 | - this.titleHeight = this.displayTool.width * 178 / 375 | 80 | + this.titleHeight = this.displayTool.width * 227 / 375 |
| 81 | + this.nShowDownloadTitleHeight = this.displayTool.width * 311 / 375 | ||
| 78 | //注册字体 | 82 | //注册字体 |
| 79 | // font.registerFont({ | 83 | // font.registerFont({ |
| 80 | // familyName: 'BebasNeueBold', | 84 | // familyName: 'BebasNeueBold', |
| @@ -353,34 +357,34 @@ export struct MultiPictureDetailPageComponent { | @@ -353,34 +357,34 @@ export struct MultiPictureDetailPageComponent { | ||
| 353 | @Builder | 357 | @Builder |
| 354 | NShowDownload() { | 358 | NShowDownload() { |
| 355 | Column() { | 359 | Column() { |
| 356 | - Row() { | ||
| 357 | - Scroll(this.scroller) { | ||
| 358 | - Row() { | ||
| 359 | - Flex({ | ||
| 360 | - direction: FlexDirection.Column, | ||
| 361 | - justifyContent: FlexAlign.Start | ||
| 362 | - }) { | ||
| 363 | - if (this.contentDetailData?.photoList?.length) { | ||
| 364 | - Text() { | ||
| 365 | - Span(`${this.swiperIndex + 1}`) | ||
| 366 | - .fontSize(24) | ||
| 367 | - .fontFamily('PingFang SC-Medium') | ||
| 368 | - .fontWeight(500) | ||
| 369 | - .lineHeight(28) | ||
| 370 | - Span(`/${this.contentDetailData?.photoList?.length}`) | ||
| 371 | - .fontSize(14) | ||
| 372 | - .fontFamily('PingFang SC-Medium') | ||
| 373 | - .fontWeight(500) | ||
| 374 | - .lineHeight(19) | ||
| 375 | - } | ||
| 376 | - .fontColor(Color.White) | ||
| 377 | - .margin({ | ||
| 378 | - top: 4, | ||
| 379 | - left: 18, | ||
| 380 | - bottom: 4, | ||
| 381 | - right: 4 | ||
| 382 | - }) | ||
| 383 | - } | 360 | + Scroll(this.scroller) { |
| 361 | + Flex({ | ||
| 362 | + direction: FlexDirection.Column, | ||
| 363 | + justifyContent: FlexAlign.Start | ||
| 364 | + }) { | ||
| 365 | + if (this.contentDetailData?.photoList?.length) { | ||
| 366 | + Text() { | ||
| 367 | + Span(`${this.swiperIndex + 1}`) | ||
| 368 | + .fontSize(24) | ||
| 369 | + .fontFamily('PingFang SC-Medium') | ||
| 370 | + .fontWeight(500) | ||
| 371 | + .lineHeight(28) | ||
| 372 | + Span(`/${this.contentDetailData?.photoList?.length}`) | ||
| 373 | + .fontSize(14) | ||
| 374 | + .fontFamily('PingFang SC-Medium') | ||
| 375 | + .fontWeight(500) | ||
| 376 | + .lineHeight(19) | ||
| 377 | + } | ||
| 378 | + .fontColor(Color.White) | ||
| 379 | + .margin({ | ||
| 380 | + top: 4, | ||
| 381 | + left: 18, | ||
| 382 | + bottom: 4, | ||
| 383 | + right: 4 | ||
| 384 | + }) | ||
| 385 | + } | ||
| 386 | + List() { | ||
| 387 | + ListItem(){ | ||
| 384 | if (this.contentDetailData.newsTitle) { | 388 | if (this.contentDetailData.newsTitle) { |
| 385 | Text(`${this.contentDetailData.newsTitle}`) | 389 | Text(`${this.contentDetailData.newsTitle}`) |
| 386 | .fontColor(Color.White) | 390 | .fontColor(Color.White) |
| @@ -396,6 +400,8 @@ export struct MultiPictureDetailPageComponent { | @@ -396,6 +400,8 @@ export struct MultiPictureDetailPageComponent { | ||
| 396 | }) | 400 | }) |
| 397 | .width('92%') | 401 | .width('92%') |
| 398 | } | 402 | } |
| 403 | + } | ||
| 404 | + ListItem(){ | ||
| 399 | if (this.contentDetailData.photoList?.[this.swiperIndex].picDesc) { | 405 | if (this.contentDetailData.photoList?.[this.swiperIndex].picDesc) { |
| 400 | Text(`${this.contentDetailData.photoList?.[this.swiperIndex].picDesc}`) | 406 | Text(`${this.contentDetailData.photoList?.[this.swiperIndex].picDesc}`) |
| 401 | .fontColor(Color.White) | 407 | .fontColor(Color.White) |
| @@ -415,15 +421,30 @@ export struct MultiPictureDetailPageComponent { | @@ -415,15 +421,30 @@ export struct MultiPictureDetailPageComponent { | ||
| 415 | } | 421 | } |
| 416 | } | 422 | } |
| 417 | } | 423 | } |
| 418 | - .width('100%') | 424 | + .nestedScroll( |
| 425 | + { | ||
| 426 | + scrollForward: NestedScrollMode.PARENT_FIRST, | ||
| 427 | + scrollBackward: NestedScrollMode.SELF_FIRST | ||
| 428 | + } | ||
| 429 | + ) | ||
| 430 | + .constraintSize ( | ||
| 431 | + { | ||
| 432 | + maxHeight: px2vp(this.titleHeight) | ||
| 433 | + } | ||
| 434 | + ) | ||
| 419 | } | 435 | } |
| 420 | - .scrollable(ScrollDirection.Vertical) | ||
| 421 | - .scrollBarWidth(0) | ||
| 422 | - .constraintSize({ | ||
| 423 | - maxHeight: px2vp(this.titleHeight) | ||
| 424 | - }) | ||
| 425 | - .align(Alignment.Bottom) | 436 | + .width('100%') |
| 426 | } | 437 | } |
| 438 | + .scrollable(ScrollDirection.Vertical) | ||
| 439 | + .scrollBarWidth(0) | ||
| 440 | + .constraintSize ( | ||
| 441 | + { | ||
| 442 | + maxHeight: px2vp(this.nShowDownloadTitleHeight) | ||
| 443 | + } | ||
| 444 | + ) | ||
| 445 | + // .initialOffset({ | ||
| 446 | + // yOffset: px2vp(this.titleHeight)/2 | ||
| 447 | + // }) | ||
| 427 | 448 | ||
| 428 | OperRowListView({ | 449 | OperRowListView({ |
| 429 | contentDetailData: this.contentDetailData, | 450 | contentDetailData: this.contentDetailData, |
-
Please register or login to post a comment