HarmonyOS 鸿蒙Next怎么修改顶部状态栏和底部虚拟导航栏的背景色？

HarmonyOS 鸿蒙Next怎么修改顶部状态栏和底部虚拟导航栏的背景色？ 一开始我以为把内容全屏展示，顶部状态栏颜色透明，底部虚拟导航颜色和自己应用的tab颜色一致，就叫做沉浸式导航。不过查了下并非如此，沉浸式导航是把状态栏和底部的虚拟导航栏给隐藏了。我现在的需求是想内容区域从屏幕顶部开始展示，状态栏背景透明，底部的虚拟导航栏背景色和我的tab颜色一致，请问如何修改呢？


更多关于HarmonyOS 鸿蒙Next怎么修改顶部状态栏和底部虚拟导航栏的背景色？的实战教程也可以访问 https://www.itying.com/category-93-b0.html

5 回复 
楼主使用这种方式有效吗，我这里设置完没有效果。

```javascript
windowStage.loadContent('pages/MainPage', (err, data) => {
  if (err.code) {
    hilog.error(0x0000, 'testTag', 'Failed to load the content. Cause: %{public}s', JSON.stringify(err) ?? '');
    return;
  }
  windowClass.setWindowBackgroundColor('#FFFFFF');
  hilog.info(0x0000, 'testTag', 'Succeeded in loading the content. Data: %{public}s', JSON.stringify(data) ?? '');
});

更多关于HarmonyOS 鸿蒙Next怎么修改顶部状态栏和底部虚拟导航栏的背景色？的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


参照这种设置，

  • 字体大小
  • 行间距
  • 边距
  • 对齐方式

好的，我去试试。谢谢，

在HarmonyOS Next中，修改顶部状态栏和底部虚拟导航栏的背景色可以通过使用Window组件的statusBarColor和navigationBarColor属性来实现。你可以在Ability的onWindowStageCreate生命周期方法中设置这些属性。例如：

import window from '@ohos.window';

onWindowStageCreate(windowStage: window.WindowStage) {
    let windowClass = windowStage.getMainWindow();
    windowClass.setStatusBarColor('#FF0000'); // 设置状态栏背景色为红色
    windowClass.setNavigationBarColor('#00FF00'); // 设置导航栏背景色为绿色
}

setStatusBarColor用于设置顶部状态栏的背景色，setNavigationBarColor用于设置底部虚拟导航栏的背景色。颜色值可以使用十六进制格式。

回到顶部