OpenHarmony开发者论坛

标题: ArkUI应用开发——设置导航栏、状态栏的可见模式 [打印本页]

作者: 离北况归 时间: 2023-10-17 15:21
标题: ArkUI应用开发——设置导航栏、状态栏的可见模式
[md]本期笔者介绍如何使用@ohos.window模块的setWindowSystemBarEnable接口来设置导航栏、状态栏的可见模式

---

往期回顾：

- [ArkUI应用开发笔记[1]——Blank空白填充组件的使用](https://ost.51cto.com/posts/26605)

---

## 1.setWindowSystemBarEnable接口

- https://gitee.com/openharmony/do ... dowsystembarenable9

![image.png](https://dl-harmonyos.51cto.com/i ... rocess=image/resize,w_820,h_258)

通过设置setWindowSystemBarEnable接口的names参数来控制导航栏、状态栏的可见模式

- names参数设置为`['navigation']`，设置顶部状态栏不可见。
- names参数设置为`['status']`，设置底部导航栏不可见。
- names参数设置为空,即`[]`，设置底部导航栏、顶部状态栏都不可见

## 2.设置顶部状态栏不可见

![image.png](https://dl-harmonyos.51cto.com/i ... rocess=image/resize,w_480,h_854)
src/main/ets/entryability/EntryAbility.ts中，names参数设置为`['navigation']`

```js
onWindowStageCreate(windowStage: window.WindowStage) {
...
...
let names: Array<'status' | 'navigation'> = ['navigation'];
let windowClass = null;
windowStage.getMainWindow((err, data) => {
if (err.code) {
   console.error('Failed to obtain the main window. Cause: ' + JSON.stringify(err));
   return;
}
windowClass = data;
console.info('Succeeded in obtaining the main window. Data: ' + JSON.stringify(data));
windowClass.setWindowSystemBarEnable(names, (err) => {
   if (err.code) {
      console.error('Failed to set the system bar to be invisible. Cause:' + JSON.stringify(err));
      return;
   }
   console.info('Succeeded in setting the system bar to be invisible.');
});
  });
...
...
}
```

## 3.设置底部导航栏不可见

![image.png](https://dl-harmonyos.51cto.com/i ... rocess=image/resize,w_480,h_854)
src/main/ets/entryability/EntryAbility.ts中，names参数设置为`['status']`

```js
onWindowStageCreate(windowStage: window.WindowStage) {
...
...
let names: Array<'status' | 'navigation'> = ['status'];
let windowClass = null;
windowStage.getMainWindow((err, data) => {
if (err.code) {
   console.error('Failed to obtain the main window. Cause: ' + JSON.stringify(err));
   return;
}
windowClass = data;
console.info('Succeeded in obtaining the main window. Data: ' + JSON.stringify(data));
windowClass.setWindowSystemBarEnable(names, (err) => {
   if (err.code) {
      console.error('Failed to set the system bar to be invisible. Cause:' + JSON.stringify(err));
      return;
   }
   console.info('Succeeded in setting the system bar to be invisible.');
});
  });
...
...
}
```

## 4.设置底部导航栏、顶部状态栏都不可见

![image.png](https://dl-harmonyos.51cto.com/i ... rocess=image/resize,w_480,h_854)

src/main/ets/entryability/EntryAbility.ts中，names参数设置为空

```js
onWindowStageCreate(windowStage: window.WindowStage) {
...
...
let names: Array<'status' | 'navigation'> = [];
let windowClass = null;
windowStage.getMainWindow((err, data) => {
if (err.code) {
   console.error('Failed to obtain the main window. Cause: ' + JSON.stringify(err));
   return;
}
windowClass = data;
console.info('Succeeded in obtaining the main window. Data: ' + JSON.stringify(data));
windowClass.setWindowSystemBarEnable(names, (err) => {
   if (err.code) {
      console.error('Failed to set the system bar to be invisible. Cause:' + JSON.stringify(err));
      return;
   }
   console.info('Succeeded in setting the system bar to be invisible.');
});
  });
...
...
}
```

[/md]

欢迎光临 OpenHarmony开发者论坛 (https://forums.openharmony.cn/)