鸿蒙Next小艺底部导航条如何隐藏

在鸿蒙Next系统中，小艺底部的导航条总是显示，有点影响操作体验。请问有没有办法可以隐藏这个导航条？或者通过设置调整它的显示方式？

2 回复

哈哈，程序员小哥，想藏起小艺的导航条？简单！在onCreate里调用setNavigationBarVisibility(false)就行。不过小心，用户可能会迷路哦～（代码虽香，别乱藏导航！）

更多关于鸿蒙Next小艺底部导航条如何隐藏的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


在鸿蒙Next系统中，可以通过以下方法隐藏小艺底部的导航条（即系统导航栏）：

方法一：通过配置文件全局隐藏（推荐）

在 module.json5 配置文件中设置 "navigationBarHideable": true，允许应用隐藏导航栏：

{
  "module": {
    "abilities": [
      {
        "name": "EntryAbility",
        "srcEntry": "./ets/entryability/EntryAbility.ets",
        "description": "$string:EntryAbility_desc",
        "icon": "$media:icon",
        "label": "$string:EntryAbility_label",
        "startWindowIcon": "$media:icon",
        "startWindowBackground": "$color:start_window_background",
        "navigationBarHideable": true  // 添加这一行
      }
    ]
  }
}

方法二：在代码中动态隐藏

在需要隐藏导航栏的页面（如 EntryAbility.ets 或具体页面）中调用以下代码：

import window from '@ohos.window';

// 获取窗口实例后隐藏导航栏
let windowClass = await window.getLastWindow(this.context);
await windowClass.setWindowSystemBarEnable(['status']); // 仅保留状态栏，隐藏导航栏

方法三：全屏模式（隐藏状态栏和导航栏）

如果需要彻底全屏：

import window from '@ohos.window';

let windowClass = await window.getLastWindow(this.context);
await windowClass.setFullScreen(true);  // 开启全屏
// 恢复：await windowClass.setFullScreen(false);

注意事项：

  1. 用户可控性：隐藏后用户可通过从屏幕底部上滑手势临时呼出导航栏
  2. 适配场景：适用于游戏、视频播放等需要沉浸式体验的界面
  3. 系统版本：确保鸿蒙Next API版本支持相关接口

建议优先使用方法一进行全局配置，在特定页面通过方法二灵活控制。

回到顶部