ref |> 图文详情页 适配全屏

@@ -61,6 +61,7 @@ export struct ImageAndTextPageComponent {
   @State likeNum: number = 0
   @State likeNum: number = 0
   @State reachEndIncreament: number = 0
   @State reachEndIncreament: number = 0
   @State bottomSafeHeight: number = AppStorage.get<number>('bottomSafeHeight') || 0
   @State bottomSafeHeight: number = AppStorage.get<number>('bottomSafeHeight') || 0
+  @State topSafeHeight: number = AppStorage.get<number>('topSafeHeight') || 0
   @State isScrollTop: boolean = true
   @State isScrollTop: boolean = true
   @State offsetY: number = 0
   @State offsetY: number = 0
   pageShowTime:number = 0;
   pageShowTime:number = 0;
@@ -88,7 +89,7 @@ export struct ImageAndTextPageComponent {
               action: this.action,
               action: this.action,
               isPageEnd: $isPageEnd
               isPageEnd: $isPageEnd
             })
             })
-              .padding({ top: 15, bottom: 10 })
+              .padding({ bottom: 10 })
             Column() {
             Column() {
               // 点赞
               // 点赞
               if (this.contentDetailData?.openLikes && this.contentDetailData?.likesStyle !== 4) {
               if (this.contentDetailData?.openLikes && this.contentDetailData?.likesStyle !== 4) {
@@ -159,8 +160,8 @@ export struct ImageAndTextPageComponent {
           }
           }
           .id('imgTextContainer')
           .id('imgTextContainer')
         }
         }
+        .padding({bottom: 44})
         .width(CommonConstants.FULL_WIDTH)
         .width(CommonConstants.FULL_WIDTH)
-        .height(CommonConstants.FULL_HEIGHT)
         .scrollBar(BarState.Off)
         .scrollBar(BarState.Off)
         .align(Alignment.Top)
         .align(Alignment.Top)
         .onReachEnd(() => {
         .onReachEnd(() => {
@@ -174,10 +175,10 @@ export struct ImageAndTextPageComponent {
             retry: () => {
             retry: () => {
               this.getDetail()
               this.getDetail()
             }
             }
-          }).padding({ bottom: 200 })
+          }).padding({ bottom: 44 })
         } else {
         } else {
           if (!this.isPageEnd) {
           if (!this.isPageEnd) {
-            detailedSkeleton().padding({ bottom: this.bottomSafeHeight })
+            detailedSkeleton().padding({ bottom: 44 })
           }
           }
         }
         }
         // 底部交互区
         // 底部交互区
@@ -206,12 +207,10 @@ export struct ImageAndTextPageComponent {
             this.isScrollTop = !this.isScrollTop
             this.isScrollTop = !this.isScrollTop
           }
           }
         })
         })
-          .position({ y: '100%' })
       }
       }
+      .margin({top: `${this.topSafeHeight}px`, bottom: `${this.bottomSafeHeight}px`})
       .width(CommonConstants.FULL_WIDTH)
       .width(CommonConstants.FULL_WIDTH)
-      .height(CommonConstants.FULL_HEIGHT)
-      .expandSafeArea([SafeAreaType.SYSTEM], [SafeAreaEdge.TOP, SafeAreaEdge.BOTTOM])
-      .padding({ top: 38 })
+      // .height(CommonConstants.FULL_HEIGHT)
 
 
       // 发布时间
       // 发布时间
       Column() {
       Column() {
@@ -242,6 +241,7 @@ export struct ImageAndTextPageComponent {
         .backgroundColor(Color.White)
         .backgroundColor(Color.White)
       }.backgroundColor(Color.White)
       }.backgroundColor(Color.White)
     }
     }
+    .margin({top: `${this.topSafeHeight}px`, bottom: `${this.bottomSafeHeight}px`})
     .width(CommonConstants.FULL_WIDTH)
     .width(CommonConstants.FULL_WIDTH)
     .height(CommonConstants.FULL_HEIGHT)
     .height(CommonConstants.FULL_HEIGHT)
     .backgroundColor(Color.White)
     .backgroundColor(Color.White)