图集bug修复

王士厅
Commit 5879f05ac604eef6939cd4f22a3571e45ffe6911 5879f05a 1 parent fb5d7b00
Showing 3 changed files with 36 additions and 19 deletions
sight_harmony/features/wdComponent/src/main/ets/components/MultiPictureDetailItemComponent.ets
sight_harmony/features/wdComponent/src/main/ets/components/MultiPictureDetailPageComponent.ets
sight_harmony/products/phone/src/main/ets/pages/detail/MultiPictureDetailPage.ets
--- a/sight_harmony/features/wdComponent/src/main/ets/components/MultiPictureDetailItemComponent.ets
View file @5879f05
+++ b/sight_harmony/features/wdComponent/src/main/ets/components/MultiPictureDetailItemComponent.ets
View file @5879f05
@@ -3,12 +3,12 @@ import { Logger } from 'wdKit';
 const TAG = 'MultiPictureDetailPageComponent';
+@Reusable
 @Component
 export struct MultiPictureDetailItemComponent {
   private MultiPictureDetailItem: PhotoListBean = {} as PhotoListBean
   //alt app.media.picture_loading 设计稿尺寸
   @State imageWidth:string | number = 167
-  @State ratio:number = 167/60
   async aboutToAppear() {
@@ -20,12 +20,10 @@ export struct MultiPictureDetailItemComponent {
       Image(this.MultiPictureDetailItem.picPath)
         .alt($r('app.media.picture_loading'))
         .width(this.imageWidth)
-        .aspectRatio(this.ratio)
         .objectFit(ImageFit.Contain)
         .interpolation(ImageInterpolation.High)
         .onComplete(event => {
           this.imageWidth = '100%'
-          this.ratio = this.MultiPictureDetailItem.width / this.MultiPictureDetailItem.height
         })
     }
     .height('100%')
--- a/sight_harmony/features/wdComponent/src/main/ets/components/MultiPictureDetailPageComponent.ets
View file @5879f05
+++ b/sight_harmony/features/wdComponent/src/main/ets/components/MultiPictureDetailPageComponent.ets
View file @5879f05
@@ -46,6 +46,9 @@ export struct MultiPictureDetailPageComponent {
   @State showDownload: Boolean = false // 控制是否显示下载默认隐藏
   @State publishCommentModel: publishCommentModel = new publishCommentModel()
   @State operationButtonList: string[] = ['comment', 'like', 'collect', 'share']
+  @State topSafeHeight: number = AppStorage.get<number>('topSafeHeight') as number;
+  @State windowHeight: number = AppStorage.get<number>('windowHeight') as number;
+  @State currentOffset:number = 0
   //watch监听页码回调
   onCurrentPageNumUpdated(): void {
@@ -90,9 +93,6 @@ export struct MultiPictureDetailPageComponent {
     .height('100%')
     .backgroundColor(Color.Black)
     .id('e_picture_container')
-    // 设置顶部绘制延伸到状态栏
-    // 设置底部绘制延伸到导航条
-    .expandSafeArea([SafeAreaType.SYSTEM], [SafeAreaEdge.TOP, SafeAreaEdge.BOTTOM])
   }
   @Builder
@@ -104,7 +104,7 @@ export struct MultiPictureDetailPageComponent {
             Row() {
               Stack() {
                 Image(this.getImgUrl())
-                  .borderRadius(24)
+                  .borderRadius(18)
                   .aspectRatio(1)
                   .border({ width: 1, color: Color.White, style: BorderStyle.Solid })
                   .width(36)
@@ -157,7 +157,7 @@ export struct MultiPictureDetailPageComponent {
                 .margin(0)
                 .height(17)
               Text(`${this.contentDetailData?.rmhInfo?.rmhDesc}`)
-                .fontColor('#676767')
+                .fontColor(Color.White)
                 .fontSize(12)
                 .fontFamily('PingFang SC-Regular')
                 .fontWeight(400)
@@ -201,8 +201,8 @@ export struct MultiPictureDetailPageComponent {
               }.alignItems(VerticalAlign.Center)
             }
             .borderRadius(4)
-            .backgroundColor('#B0B0B0')
-            .width(48)
+            .backgroundColor('#333333')
+            .width(54)
             .height(24)
           }
@@ -215,6 +215,7 @@ export struct MultiPictureDetailPageComponent {
       .width('100%')
       .height(44)
       .zIndex(10)
+      .margin({top:`${this.topSafeHeight + 12}px`})
       .alignRules({
         top: { anchor: "__container__", align: VerticalAlign.Top },
         middle: { anchor: "__container__", align: HorizontalAlign.Center }
@@ -235,8 +236,17 @@ export struct MultiPictureDetailPageComponent {
           .cachedCount(1)
           .indicator(false)
           .displayCount(1)
-          .onAnimationEnd(event => {
+          .onGestureSwipe((index: number, extraInfo: SwiperAnimationEvent) => {
+            console.info("onGestureSwipe current offset: " + extraInfo.currentOffset)
+            this.currentOffset = Math.abs(extraInfo.currentOffset)
+          })
+          .onTouch((event: TouchEvent) => {
+              if(event.type === 1) {
+                // if(this.currentOffset > px2vp((this.windowHeight - item.height)/2 - 100)) {
+                if(this.currentOffset > 160) {
                   router.back()
+                }
+              }
           })
         })
       }
@@ -283,6 +293,7 @@ export struct MultiPictureDetailPageComponent {
                 direction: FlexDirection.Column,
                 justifyContent: FlexAlign.Start
               }) {
+                if(this.contentDetailData?.photoList?.length) {
                   Text() {
                     Span(`${this.swiperIndex + 1}`)
                       .fontSize(24)
@@ -297,7 +308,8 @@ export struct MultiPictureDetailPageComponent {
                   }
                   .fontColor(Color.White)
                   .margin(4)
-
+                }
+                if(this.contentDetailData.newsTitle) {
                   Text(`${this.contentDetailData.newsTitle}`)
                     .fontColor(Color.White)
                     .fontSize(16)
@@ -310,6 +322,8 @@ export struct MultiPictureDetailPageComponent {
                       bottom: 4,
                       right: 0
                     })
+                }
+                if(this.contentDetailData.photoList?.[this.swiperIndex].picDesc) {
                   Text(`${this.contentDetailData.photoList?.[this.swiperIndex].picDesc}`)
                     .fontColor(Color.White)
                     .fontSize(14)
@@ -323,7 +337,8 @@ export struct MultiPictureDetailPageComponent {
                       bottom: 4,
                       right: 18
                     })
-                  .maxLines(16)
+                    .maxLines(32)
+                }
               }
             }
             .width('100%')
@@ -346,6 +361,7 @@ export struct MultiPictureDetailPageComponent {
             direction: FlexDirection.Row,
             justifyContent: FlexAlign.SpaceBetween
           }) {
+            if(this.contentDetailData?.photoList?.length) {
               Text() {
                 Span(`${this.swiperIndex + 1}`)
                   .fontSize(24)
@@ -360,7 +376,9 @@ export struct MultiPictureDetailPageComponent {
               }
               .fontColor(Color.White)
               .margin(4)
+            }
+            if(this.contentDetailData.photoList?.[this.swiperIndex].picPath) {
               ImageDownloadComponent({ url: this.contentDetailData.photoList?.[this.swiperIndex].picPath })
                 .margin({
                   top: 8,
@@ -370,6 +388,7 @@ export struct MultiPictureDetailPageComponent {
                 })
             }
           }
+        }
         .width('100%')
       }
       .visibility(this.showDownload ? Visibility.Visible : Visibility.None)
--- a/sight_harmony/products/phone/src/main/ets/pages/detail/MultiPictureDetailPage.ets
View file @5879f05
+++ b/sight_harmony/products/phone/src/main/ets/pages/detail/MultiPictureDetailPage.ets
View file @5879f05
@@ -26,7 +26,6 @@ struct MultiPictureDetailPage {
           })
       }
     }
-    .padding({top:44})
     .backgroundColor(Color.Black)
   }
@@ -57,6 +56,12 @@ struct MultiPictureDetailPage {
     Logger.info(TAG, 'onBackPress');
   }
+
+  aboutToDisappear(): void {
+    console.log(TAG, 'aboutToDisappear')
+    this.closeFullScreen()
+  }
+
   /**
    * 开启沉浸式
    * TODO:颜色待根据业务接口修改
@@ -67,11 +72,6 @@ struct MultiPictureDetailPage {
     // WindowModel.shared.setWindowSystemBarEnable([])
   }
-  aboutToDisappear(): void {
-    console.log(TAG, 'aboutToDisappear')
-    this.closeFullScreen()
-  }
-
   /**
    * 关闭沉浸式
    * TODO:颜色待根据业务接口修改