Child pages
  • GUI - Customisation - Live UI


Contents

Starting with firmware version 10.1.21.0, the graphical user interface can be completely adapted. It is now possible to not only change the background image of the screen, but also modify the colour and transparency settings of all elements of the GUI.


Here are two examples of what is possible:


Personal background image

In the first example of the "Dream Tree Hotels", the background colour of the screen has been exchanged by an image. This can be easily done by providing the URL to the server where the phone can find the image. 

<custom_bg_image_url perm="PERMISSIONFLAG">VALIDVALUE</custom_bg_image_url>

Correct Path to Background Image: 

  • To setup your own background image on the phone, a reachable valid URL to an image has to be set in this setting. 
    As soon as the setting is changed, the background image will be replaced. 

  • You can change this setting via setting URL or over WUI → Preferences→ Appearance.

     


  • If this setting is empty or the URL or the image is wrong, then the default phone background image will be used.

  • Example: http://<IP>/alternate_background.png 
                    (http://192.168.1.1/alternate_background.png)

    The image needs to be stored on a Webserver, because we use a HTTP Request for the download.

Backgrund colour to be set to invisible

To see the Background Image, you currently have to set the standard background Color to zero, because the background pictures are located in the background layer of the standard background colour.

e.g. background_color=242 242 242 0 

 

Starting from firmware version 10.1.33.33, the background color transparency will adopt automatically to the background image shown on the phone.

Image specifications

The background image has to be saved in PNG format, and needs to fit the size of the screen.

Phone model

File type

Image size in pixel

Example image
D735.png320 x 240

D765.png320 x 240

D785.png480 x 272

D375.png480 x 272

D385.png480 x 272


Change colours and transparencies of other GUI elements

In order to ensure a perfect visibility of all information displayed on the screen, and to furthermore adopt e.g. the corporate identity of a company, you can now also change the colours of all other GUI elements. 














Image 1: New settings parameters for GUI customisation

Related Settings

Setting nameValid valuesDefault value
titlebar_text_colorA group of 3 or 4 numbers, each >=0 and <=255.
First number is the red value, followed by green, blue and optional alpha
(alpha=visibility, will default to 255 if it is not set)





51 51 51 255
text_color51 51 51
subtext_color123 124 126 255
extratext_color123 124 126 255
extratext2_color123 124 126 255
titlebar_background_color226 226 226 255
background_color242 242 242 255
fkey_background_color242 242 242 255
fkey_pressed_background_color61 133 198 255
fkey_separator_color182 183 184 255
fkey_label_color123 124 126 255
fkey_pressed_label_color242 242 242 255
selected_line_background_color255 255 255 255
selected_line_indicator_color61 133 198 255
selected_line_text_color61 133 198 255
line_separator_color226 226 226 255
scrollbar_color182 183 184 255
cursor_color61 133 198 255
status_msgs_background_color242 242 242 255
status_msgs_border_color182 183 184 255

You can define the value to each setting by using the web user interface (WUI) (from 10.1.25.0 onwards), or by including the parameters into your auto-provisioning configuration file.


Image 2: New tab Appearance in the phone preferences


Related Links: