Displaying graphics on the top and bottom bar

Avatar
  • updated

Hi everyone.

Since I created the dark theme of visualization, light color of the top and bottom bar is even more annoying (dark interface is less readable, because bright top and bottom strips hurt eyes). Is there any possibility to change this color (applications run on Apple iPad/iPhone devices).
The second issue is truncated texts where names are displayed on two lines. One solution could be to define the space between individual buttons of the bottom menu so that longer text fits on one line. Of course, ideal solution would be the automatic height of bottom bar, depending on displayed texts, or possibility of its definition by the user.

Image 2789




Image 2790


I checked that the top bar is black in Android version. However, truncated texts are still displayed on the bottom bar.

Are there any plans to correct such shortcomings?

Regards,

Grzegorz

Avatar
Grzegorz Kulinski

Hi, everyone.

I installed the latest versions of bOS Client 4.8.20 (release date: 25.09.2026), on my iPad Pro 12.9” (M2) and iPhone 12 Pro Max (both devices updated to the latest version of iOS 27.0). I tested the long-awaited fix regarding the colors of the top and bottom system bars.

bOS Configurator version: 4.11.61

The colors are being overridden, but there are some differences. I tested this update for iPad and iPhone, with three different color schemes for the background/side menu.

Below are the GUI color components and the colors read from the top and bottom bars:

Image 5646

Image 5650

TEST 1:

Theme:

  • Side Menu Color (Alpha; R; G; B): 255; 24; 24; 24
  • Side Menu Button Color (Alpha; R; G; B): 240; 40; 40; 40
  • Forms Color (Alpha; R; G; B): 240; 40; 40; 40
  • Forms Button Color (Alpha; R; G; B): 240; 48; 48; 48
  • Forms Label Color (Alpha; R; G; B): 240; 40; 40; 40
  • Frame Color (Alpha; R; G; B): 16; 0; 0; 0
  • Button Color (Alpha; R; G; B): 180; 255; 255; 255
  • Label Color (Alpha; R; G; B): 50; 0; 0; 0
  • Selected Text Color (Alpha; R; G; B): 255; 58; 130; 247

Apperance:

  • Background Color (Alpha; R; G; B): 255; 24; 24; 24
  • Background Image: [Empty]

Result colors:

  • Top Bar (Alpha; R; G; B) [iPad]: 255; 23; 24; 23
  • Top Bar (Alpha; R; G; B) [iPhone]: 255; 24; 24; 24
  • Bottom Bar (Alpha; R; G; B) [iPad/iPhone]: 255, 43, 43, 42

TEST 2:

Theme:

  • Side Menu Color (Alpha; R; G; B): 255; 124; 124; 124
  • Side Menu Button Color (Alpha; R; G; B): 240; 40; 40; 40
  • Forms Color (Alpha; R; G; B): 240; 40; 40; 40
  • Forms Button Color (Alpha; R; G; B): 240; 48; 48; 48
  • Forms Label Color (Alpha; R; G; B): 240; 40; 40; 40
  • Frame Color (Alpha; R; G; B): 16; 0; 0; 0
  • Button Color (Alpha; R; G; B): 180; 255; 255; 255
  • Label Color (Alpha; R; G; B): 50; 0; 0; 0
  • Selected Text Color (Alpha; R; G; B): 255; 58; 130; 247

Apperance:

  • Background Color (Alpha; R; G; B): 255; 124; 124; 124
  • Background Image: [Empty]

Result colors:

  • Top Bar (Alpha; R; G; B) [iPad]: 255; 123; 124; 123
  • Top Bar (Alpha; R; G; B) [iPhone]: 255; 124; 124; 124
  • Bottom Bar (Alpha; R; G; B) [iPad/iPhone]: 255, 93, 93, 92

TEST 3:

Theme:

  • Side Menu Color (Alpha; R; G; B): 255; 224; 224; 224
  • Side Menu Button Color (Alpha; R; G; B): 240; 40; 40; 40
  • Forms Color (Alpha; R; G; B): 240; 40; 40; 40
  • Forms Button Color (Alpha; R; G; B): 240; 48; 48; 48
  • Forms Label Color (Alpha; R; G; B): 240; 40; 40; 40
  • Frame Color (Alpha; R; G; B): 16; 0; 0; 0
  • Button Color (Alpha; R; G; B): 180; 255; 255; 255
  • Label Color (Alpha; R; G; B): 50; 0; 0; 0
  • Selected Text Color (Alpha; R; G; B): 255; 58; 130; 247

Apperance:

  • Background Color (Alpha; R; G; B): 255; 224; 224; 224
  • Background Image: [Empty]

Result colors:

  • Top Bar (Alpha; R; G; B) [iPad]: 255; 223; 223; 223
  • Top Bar (Alpha; R; G; B) [iPhone]: 255; 224; 224; 224
  • Bottom Bar (Alpha; R; G; B) [iPad/iPhone]: 255, 142, 142, 142

I also noticed another inconvenience: after editing custom colors assigned to specific panel properties, bOS Configurator doesn’t refresh them automatically. To refresh them, you must select the “Reload” option from the “hamburger menu” in the upper-right corner of the screen. It’s quite a hassle, especially when the system is already up and running at the customer’s site and minor adjustments are being made to the visual design.

Avatar
Grzegorz Kulinski

Unfortunately, it is not possible to set fullscreen option in the Apple iOS application. And in iOS version bars are displayed in white color, regardless of the dark mode under iOS.

Avatar
Jürgen Jürgenson

The top bar is android own color, you need to change android theme to dark mode, or you can use Full screen option in the bOS app settings, that will hide the top bar.
The bottom bar is as it is, there is no option to change the font size for them as far as i know. You need to limit the text length there so it wont get hidden. 

Edit: I misread that you want them to change on Android not on iOS, i don't even know if iOS has a dark theme option, so full screen is maybe your only solution.