Skip to content

Button Colour Customisation

Eliran Wong edited this page May 3, 2022 · 4 revisions

Material Menu Layout ONLY

Icon colour customisation is available only if you use Material menu layout.

To proceed, first make sure you are using Material menu layout.

Select "Material" from menu layout options as shown below:

Screenshot 2022-04-27 at 21 46 16

Basics

Colour appearance of Material menu layout icons are controlled by the following configuration values.

materialIconMaskColor - Use this color for masking material icon.

maskBackground - Either mask background or foreground color of material icon. Set True to mask background color. Set False to mask foreground color.

pushButtonBackgroundColor - Push button background color in 'material' menu layout.

pushButtonForegroundColor - Push button foreground color in 'material' menu layout.

pushButtonBackgroundColorHover - Push button background color in 'material' menu layout, when a button is hovered.

pushButtonForegroundColorHover - Push button foreground color in 'material' menu layout, when a button is hovered.

pushButtonBackgroundColorPressed - Push button background color in 'material' menu layout, when a button is pressed.

pushButtonForegroundColorPressed - Push button foreground color in 'material' menu layout, when a button is pressed.

An Example

To make a colour change, you need to edit the configuration file, UniqueBible/config.py.

  1. Make sure you quit UniqueBible app first before you edit the configuration file "config.py".

  2. Locate the following default values in the file "config.py"

materialIconMaskColor = '#e7e7e7'
maskBackground = True
pushButtonBackgroundColor = '#e7e7e7'
pushButtonForegroundColor = 'black'
pushButtonBackgroundColorHover = '#f8f8a0'
pushButtonForegroundColorHover = 'black'
pushButtonBackgroundColorPressed = '#a2a934'
pushButtonForegroundColorPressed = 'white'

Screenshot 2022-04-27 at 21 44 50
  1. The following modification changes the icon background colour to black and foreground colour to red:

materialIconMaskColor = 'red'
maskBackground = False
pushButtonBackgroundColor = 'black'
pushButtonForegroundColor = 'red'

Screenshot 2022-04-27 at 21 41 24

Graphical User Interface GUI

You can edit the settings via a GUI dialog available in Material menu layout:

UniqueBible > UBA Preferences > General > Button Colour Customisation

Screenshot 2022-05-02 at 23 12 52

Select the button on the left side to change each colour setting.

Screenshot 2022-05-02 at 23 15 07

You can select a colour simply with a mouse click or enter manually if you know actually what you want.

Screenshot 2022-05-03 at 12 14 39

An example of changing colours with GUI dialog.

Screenshot 2022-05-03 at 12 13 30
Clone this wiki locally