Skip to content

widget_styles:

This is a config file reference. Click for instructions.

This page is reference material which explains every setting and option for this section of an MPF yaml config file. See the instructions for config files for formatting and other details. See our guide to config file examples for more examples of real configs in action.

Valid in
machine config files YES ✅
mode config files YES ✅

The widget_styles: section of your config is where you configure styles for your widgets.

Default styles for widget types

You can define defaults for certain widget types. A widget will use the style (name)_default if no other style is specified. For instance, a default style for all text widgets would look like:

widget_styles:
  text_default:
    font_size: 21
    color: red

Specifying widget styles

You can also specify re-usable styles and apply them to widgets. In the following example, the text "HELLO" will render at font size 100:

widget_styles:
  big_style:
    font_size: 100
slides:
  slide1:
    - type: text
      text: HELLO
      style: big_style

You can supply multiple styles to a single widget, and they will be applied in the order given.

widget_styles:
  warning_text:
    font_size: 12
    color: yellow
  bottom_left:
    anchor_x: left
    anchor_y: bottom
    x: 5
    y: 5
  hurryup:
    color: red
widgets:
  timer_runout:
    - type: text
      text: Hurry!
      style: warning_text, bottom_left, hurryup

In the above example, the text "Hurry!" will be anchored in the lower-left of the display and rendered at size 12 and color red. Notice that the color from the hurryup style overwrites the color from warning_text style, because of the order the styles are listed in the widget.

The config reference below is incomplete. You can use all settings of your widget.

Optional settings

The following sections are optional in the widget_styles: section of your config. (If you don't include them, the default will be used).

color:

Single value, type: color (color name, hex, or list of values 0-255). Default: ffffffff

The color of the widget.

Something missing or wrong? You can fix it!

This website is edited by people like you! Is something wrong or missing? Is something out of date, or can you explain it better?

Please help us! You can fix it yourself and be an official "open source" contributor!

It's easy! See our Beginner's guide to editing the docs.

Page navigation via the keyboard: < >

You can navigate this site via the keyboard. There are two modes:

General navigation, when search is not focused:

  • F , S , / : open search dialog
  • P , , : go to previous page
  • N , . : go to next page

While using the search function:

  • Down , Up : select next / previous result
  • Esc , Tab : close search
  • Enter : go to highlighted page in the results