UITextEntryLine Theming Parameters

The UITextEntryLine theming block id is 'text_entry_line'.

Colours

../_images/text_entry_line_colour_parameters.png

A diagram of which part of the element is themed by which colour parameter.

UITextEntryLine makes use of these colour parameters in a 'colours' block. All of these colours can also be a colour gradient except the text cursor:

  • "dark_bg" - The default colour/gradient of the background to the entry line element.
  • "selected_bg" - The colour/gradient the background changes to when the text above it is selected.
  • "normal_text" - The default colour/gradient of text entered into the element.
  • "selected_text" - The colour/gradient of text when it has been selected.
  • "normal_border" - The colour/gradient of the border around the text entry element.
  • "text_cursor" - The colour of the text cursor.

Font

UITextEntryLine accepts a font specified in the theme via a 'font' block. A 'font' block has these parameters:

  • "name" - Necessary to make a valid block. This is the name that this font goes by in the UI, if this is a new font then subsequent font instances with different styles or sizes should use the same name.
  • "locale" - Optional parameter to set this font as belonging to a particular locale only. See the Localization guide. You will need to keep repeating the locale specifier if using prototypes to make a hierarchy.
  • "size" - Necessary to make a valid block. This is the point size of the font to use on the text entry line.
  • "bold" - Optional parameter. Set it to "1" to make this font bold.
  • "italic" - Optional parameter. Set it to "1" to make this font italic.

There are two methods to refer to font resource locations. First, using packaged resources:

  • "regular_resource - The location of this font's file with no particular style applied.
    • package - The name of the python package containing this resource - e.g. 'data.fonts'
    • resource - The file name of the resource - e.g. 'FiraCode-Regular.ttf'
  • "bold_resource" - The location of this font's file with bold style applied.
    • package - The name of the python package containing this resource - e.g. 'data.fonts'
    • resource - The file name of the resource - e.g. 'FiraCode-Bold.ttf'
  • "italic_resource" - The location of this font's file with italic style applied.
    • package - The name of the python package containing this resource - e.g. 'data.fonts'
    • resource - The file name of the resource - e.g. 'FiraMono-Italic.ttf'
  • "bold_italic_resource" - The location of this font's file with bold and italic style applied.
    • package - The name of the python package containing this resource - e.g. 'data.fonts'
    • resource - The file name of the resource - e.g. 'FiraMono-BoldItalic.ttf'

Second using paths:

  • "regular_path" - The path to this font's file with no particular style applied.
  • "bold_path" - The path to this font's file with bold style applied.
  • "italic_path" - The path to this font's file with italic style applied.
  • "bold_italic_path" - The path to this font's file with bold and italic style applied.

You only need to specify locations if this is the first use of this font name in the GUI.

Misc

UITextEntryLine accepts the following miscellaneous parameters in a 'misc' block:

  • "shape" - Can be one of 'rectangle' or 'rounded_rectangle'. Different shapes for this UI element.
  • "shape_corner_radius" - Only used if our shape is 'rounded_rectangle'. It sets the radius used for the rounded corners.
  • "border_width" - the width of the border around the element in pixels. Defaults to "1".
  • "shadow_width" - the width of the shadow around the element in pixels. Defaults to "1".
  • "padding" - the horizontal and vertical 'padding' between the border and where we render the text. Defaults to "4,2".
  • "tool_tip_delay" - time in seconds before the button's tool tip (if it has one) will appear. Default is "1.0".

Example

Here is an example of a text entry line block in a JSON theme file using all the parameters described above.

text_entry_line.json
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
 {
     "text_entry_line":
     {
         "colours":
         {
             "dark_bg": "#25292e",
             "selected_bg": "#55595e",
             "normal_text": "#AAAAAA",
             "selected_text": "#FFFFFF",
             "normal_border": "#FFFFFF"
         },
         "font":
         {
             "name": "montserrat",
             "size": "12",
             "bold": "0",
             "italic": "1",
             "regular_resource": {
                  "package": "data.fonts",
                  "resource": "Montserrat-Regular.ttf"
             },
             "bold_resource": {
                  "package": "data.fonts",
                  "resource": "Montserrat-Bold.ttf"
             },
             "italic_resource": {
                  "package": "data.fonts",
                  "resource": "Montserrat-Italic.ttf"
             },
             "bold_italic_resource": {
                  "package": "data.fonts",
                  "resource": "Montserrat-BoldItalic.ttf"
             },
         },
         "misc":
         {
             "shape": "rounded_rectangle",
             "shape_corner_radius": 5,
             "border_width": "2",
             "shadow_width": "2",
             "padding": "6,4"
         }
     }
 }