1# Window Management Development 2 3## How do I obtain the height of the status bar and navigation bar? 4 5Applicable to: OpenHarmony 3.2 Beta 5 (API version 9) 6 7**Solution** 8 9Before the window content is loaded, enable listening for the **systemAvoidAreaChange** event. 10 11**Example** 12 13``` 14// MainAbility.ts 15import window from '@ohos.window'; 16 17/** 18 * Set the immersive window and obtain the height of the status bar and navigation bar. 19 * @param mainWindow Indicates the main window. 20 */ 21async function enterImmersion(mainWindow: window.Window) { 22 mainWindow.on("systemBarTintChange", (data) => { 23 let avoidAreaRect = data.regionTint[0].region; // data.regionTint is an array that contains the rectangle coordinates of the status bar and navigation bar. 24 }) 25 await mainWindow.setFullScreen(true) 26 await mainWindow.setSystemBarEnable(["status", "navigation"]) 27 await mainWindow.systemBarProperties({ 28 navigationBarColor: "#00000000", 29 statusBarColor: "#00000000", 30 navigationBarContentColor: "#FF0000", 31 statusBarContentColor: "#FF0000" 32 }) 33} 34export default class MainAbility extends Ability { 35 // Do something. 36 async onWindowStageCreate(windowStage: window.WindowStage) { 37 let mainWindow = await windowStage.getMainWindow() 38 await enterImmersion(mainWindow) 39 windowStage.loadContent('pages/index') 40 } 41 // Do something. 42} 43``` 44 45## How do I hide the status bar on the top of an application? 46 47Applicable to: OpenHarmony 3.2 Beta 5 (API version 9) 48 49**Solution** 50 51Use **setWindowSystemBarEnable** in the **onWindowStageCreate** lifecycle callback of UIAbility. 52 53**Example** 54 55``` 56onWindowStageCreate(windowStage){ 57 windowStage.getMainWindowSync().setWindowSystemBarEnable([]) 58 ...... 59} 60``` 61 62**Reference** 63 64[Window](../reference/apis/js-apis-window.md) 65