HarmonyOS 鸿蒙Next Navigation在分栏模式下,如何设置某个NavDestination全屏显示

发布于 1周前 作者 sinazl 来自 鸿蒙OS

HarmonyOS 鸿蒙Next Navigation在分栏模式下,如何设置某个NavDestination全屏显示 在Navigation分栏模式下,右侧显示二级页面,当某个二级页面期望铺满屏幕时,需要如何处理?

比如有一个播放视频的二级页面,当进入该页时,期望铺满屏幕播放视频,而不是出现在右侧的分栏中。

2 回复

可以通过
@StorageLink('isSplit') isSplit: boolean = false;
AppStorage.set('isSplit',true)
来实现。
在需要的地方修改isSplit的值来触发界面刷新。
请参考代码:

// Index.ets
@Entry
@Component
struct Index {
  @State nav:NavPathStack = new NavPathStack()
  @StorageLink('isSplit') isSplit: boolean = false;
  aboutToAppear(): void {
    AppStorage.setOrCreate('isSplit',false);
    AppStorage.setOrCreate('pathStack',this.nav)
  }
  build() {
    Navigation(this.nav){
      Column()
        .backgroundColor('#f00')
        .width('100%').height('100%')
        .onClick(()=>{
          this.nav.pushPathByName('Page','')
        })
    }
    .mode(this.isSplit? NavigationMode.Split : NavigationMode.Stack)
    .hideTitleBar(true)
    .hideToolBar(true)
  }
}

// Page.ets
@Builder
export function PageBuilder() {
  Page()
}

@Entry
@Component
struct Page {
  onPageShow(): void {
    AppStorage.set('isSplit',true)
  }
  build() {
    NavDestination(){
      RelativeContainer() {
        Text('Hello')
          .alignRules({
            center: { anchor: '__container__', align: VerticalAlign.Center },
            middle: { anchor: '__container__', align: HorizontalAlign.Center }
          })
      }
      .onClick(()=>{
        let a = AppStorage.get<boolean>('isSplit')
        if (a == false || a == undefined) {
          AppStorage.set('isSplit',true)
        }else{
          AppStorage.set('isSplit',false)
        }
      })
      .height('100%')
      .width('100%')
    }
  }
}

更多关于HarmonyOS 鸿蒙Next Navigation在分栏模式下,如何设置某个NavDestination全屏显示的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


在HarmonyOS鸿蒙系统的Next Navigation组件中,若想在分栏模式下设置某个NavDestination全屏显示,可以通过调整该目的地的布局和窗口属性来实现。具体步骤如下:

  1. 修改布局文件:确保目标NavDestination的布局文件占满整个屏幕。这通常意味着其根布局(如DirectionalLayoutAbilitySlice的布局容器)应设置为match_parent宽高。

  2. 配置窗口属性:在导航到该NavDestination时,动态调整窗口的布局参数,使其占据整个屏幕空间。这可以通过在对应的Ability或Fragment中调用系统API来设置窗口属性,比如使用WindowManager.LayoutParams来调整窗口大小。

  3. 确保导航逻辑正确:在导航逻辑中,确保当选择该NavDestination时,上述布局和窗口属性的调整能够正确触发。

  4. 测试与验证:在不同的设备和屏幕尺寸上测试该功能,确保全屏显示效果一致且没有布局问题。

请注意,由于HarmonyOS系统的API和框架可能会随着版本更新而变化,上述步骤的具体实现细节可能需要根据实际使用的HarmonyOS版本进行调整。

如果问题依旧没法解决请联系官网客服, 官网地址是

回到顶部