• Home
  • Line#
  • Scopes#
  • Navigate#
  • Raw
  • Download
1# Graphics and Image Development
2
3## Why do the isStatusBarLightIcon and isNavigationBarLightIcon attributes not take effect when window.setSystemBarProperties() is called?
4
5Applicable to: OpenHarmony SDK 3.2.5.3, stage model of API version 9
6
7In effect, the **isStatusBarLightIcon** and **isNavigationBarLightIcon** attributes turn the font white when set to **true**. If **statusBarContentColor** is also set in **window.setSystemBarProperties()**, the **isStatusBarLightIcon** attribute does not take effect. Similarly, if **navigationBarContentColor** is set, the **isNavigationBarLightIcon** attribute does not take effect.
8
9## How do I set the style of the system bar?
10
11Applicable to: OpenHarmony SDK 3.2.3.5, stage model of API version 9
12
13Import the **\@ohos.window** module, and call **window.setSystemBarProperties()**.
14
15## How do I hide the status bar to get the immersive effect?
16
17Applicable to: OpenHarmony SDK 3.2.6.3, stage model of API version 9
18
191. Use the **onWindowStageCreate** to obtain a **windowClass** object.
20
21   ```
22   onWindowStageCreate(windowStage) {
23     // When the main window is created, set the main page for this ability.
24     console.log("[Demo] MainAbility onWindowStageCreate")
25     windowStage.getMainWindow((err, data) => {
26       if (err.code) {
27         console.error('Failed to obtain the main window.')
28         return;
29       }
30       // Obtain a windowClass object.
31       globalThis.windowClass = data;
32     })
33   }
34   ```
35
362. Enable the full-screen mode for the window and hide the status bar.
37
38   ```
39    globalThis.windowClass.setFullScreen(isFullScreen, (err, data) => {
40     if (err.code) {
41       console.error('Failed to enable the full-screen mode. Cause:' + JSON.stringify(err));
42       return;
43     }
44       console.info('Succeeded in enabling the full-screen mode. Data: ' + JSON.stringify(data));
45     });
46   ```
47
48## How do I obtain the window width and height?
49
50Applicable to: OpenHarmony SDK 3.2.3.5, stage model of API version 9
51
52Use **window.getProperties()** to obtain the window properties. The **windowRect** field in the properties specifies the window width and height.
53
54Example:
55
56
57```
58let promise = windowClass.getProperties();
59promise.then((data)=> {
60  console.info('Succeeded in obtaining the window properties. Data: ' + JSON.stringify(data.windowRect));
61}).catch((err)=>{
62  console.error('Failed to obtain the window properties. Cause: ' + JSON.stringify(err));
63});
64```
65
66## How do I set the color of the system bar?
67
68Applicable to: OpenHarmony SDK 3.2.5.5, stage model of API version 9
69
70Refer to the following code:
71
72
73```
74window.getTopWindow(globalThis.mainContext).then(win => {
75  var systemBarProperties = {
76    statusBarColor: '#19B6FF', // Set the background color of the status bar.
77    navigationBarColor: '#19B6FF', // Set the background color of the navigation bar.
78    isStatusBarLightIcon: false, // Set the icon on the status bar not to be highlighted.
79    isNavigationBarLightIcon: true, // Set the icon on the navigation bar to be highlighted.
80    statusBarContentColor: '#0D0500', // Set the text color of the status bar.
81    navigationBarContentColor: '#FFA500' // Set the text color of the navigation bar.
82  };
83  win.setSystemBarProperties(systemBarProperties).catch(err => {
84    INDEX_LOGGER.info(`set System Bar Properties failed:${err}`)
85  })
86})
87.catch(err => {
88  INDEX_LOGGER.info(`get top window failed:${err}`)
89})
90```
91