HarmonyOS 鸿蒙Next全屏状态栏未设顶部距离，List嵌套tabs滚动至顶部吸顶后无法点击tab，最新版本

对于全屏后，页面布局不会避让状态栏和导航栏其重叠，可以使用setWindowSystemBarProperties()或者setWindowSystemBarEnable()隐藏状态栏或设置状态栏颜色为透明，参考链接：

https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V13/js-apis-window-V13

//在entryability.ets文件中添加
//设置窗口全屏
      let windowClass=windowStage.getMainWindowSync()
      AppStorage.setOrCreate(‘windowClass’,windowClass)
      windowClass.setWindowLayoutFullScreen(true)

index.ets

import  WindowManager  from ‘…/Utils/WindowManager’
@Entry
@Component
struct Index_231204142752067 {
  @State height1: number = 0
  @StorageProp(‘statusBarHeight’) statusBarHeight: number = 20
  @StorageProp(‘bottomRectHeight’) bottomRectHeight: number = 0
  onPageShow(): void {
    // WindowManager.enableFullScreen()
    WindowManager.settingStatusBarLight(’#ffffff’)
    // WindowManager.settingStatusBarColor(’#ffffff’)
  }
  build() {
    Stack() {
      // 主内容
      Scroll() {
        Column() {
          Row() {
          }
          .backgroundColor(Color.Pink)
          .height(300)
          .width(‘100%’)
          .onVisibleAreaChange([0.0, 1.0], (isVisible: boolean, currentRatio: number) => {
            if (isVisible) {
              this.height1 = 0
            }
            if (!isVisible && currentRatio <= 0.0) {
              this.height1 = this.statusBarHeight
              WindowManager.settingStatusBarLight(’#000000’)
            }else{
              WindowManager.settingStatusBarLight(’#ffffff’)
              this.height1=0
            }
          })
          // 主内容
          ScrollMainArea({ height1: this.height1 })
        }.width(“100%”)
      }
      .edgeEffect(EdgeEffect.None)
      .friction(0.6)
      .backgroundColor(’#ffffff’)
      .scrollBar(BarState.Off)
      .width(‘100%’)
      .height(‘100%’)
    }
  }
}
@Component
struct ScrollMainArea {
  private scrollerForList: Scroller = new Scroller();
  @State arr: number[] = [1, 2, 3, 4, 5, 6]
  @State currentIndex: number = 0
  @State fontColor: string = ‘#182431’
  @State selectedFontColor: string = ‘#007DFF’
  private controller: TabsController = new TabsController()
  @Prop height1: number
  @Builder
  tabBuilder(index: number, name: string) {
    Column() {
      Text(name)
        .fontColor(this.currentIndex === index ? this.selectedFontColor : this.fontColor)
        .fontSize(16)
        .fontWeight(this.currentIndex === index ? 500 : 400)
        .lineHeight(22)
        .margin({ top: 17, bottom: 7 })
      Divider()
        .strokeWidth(2)
        .color(’#007DFF’)
        .opacity(this.currentIndex === index ? 1 : 0)
    }.width(‘100%’)
  }
  @Styles
  listCard() { .backgroundColor(Color.White).height(200).width(“100%”).borderRadius(12)
  }
  build() {
    Column() {
      Tabs({ barPosition: BarPosition.Start, index: this.currentIndex, controller: this.controller }) {
        TabContent() {
          List({ space: 10, scroller: this.scrollerForList }) {
            ListItemGroup() {
              ForEach(this.arr, (item: number) => {
                ListItem() {
                  Text(“item” + item).fontSize(16)
                }.listCard()
              }, (item: string) => item)
            }
          }
          // .sticky(StickyStyle.Header)
          .width(“100%”)
          .height(‘100%’)
          .edgeEffect(EdgeEffect.None)
          .nestedScroll({ scrollForward: NestedScrollMode.PARENT_FIRST, scrollBackward: NestedScrollMode.SELF_FIRST })
        }.tabBar(this.tabBuilder(0, ‘green’))
        TabContent() {
          Column().width(‘100%’).height(‘100%’).backgroundColor(’#007DFF’)
        }.tabBar(this.tabBuilder(1, ‘blue’))
        TabContent() {
          Column().width(‘100%’).height(‘100%’).backgroundColor(’#FFBF00’)
        }.tabBar(this.tabBuilder(2, ‘yellow’))
        TabContent() {
          Column().width(‘100%’).height(‘100%’).backgroundColor(’#E67C92’)
        }.tabBar(this.tabBuilder(3, ‘pink’))
      }
      .vertical(false)
      .barMode(BarMode.Fixed)
      .barWidth(360)
      .barHeight(56)
      .animationDuration(400)
      .onChange((index: number) => {
        this.currentIndex = index
      })
      .width(‘100%’)
      .height(‘100%’)
      .padding({ top: this.height1 })
    }.width(‘100%’).height(‘100%’)
  }
}

新建工具类 &nbsp;文件夹Utils /WindowManager.ets

import { window } from ‘@kit.ArkUI’
export default  class WindowManager{
  static settingStatusBarLight(color:string) {
    let win: window.Window = AppStorage.get(‘windowClass’)!
    win.setWindowSystemBarProperties({ statusBarContentColor: color }) //设置安全区字体颜色为白色
  }
}