Difference between revisions of "emWin Widgets"

From SEGGER Wiki
Jump to: navigation, search
(Available widgets)
(Available widgets)
 
(6 intermediate revisions by the same user not shown)
Line 1: Line 1:
emWin '''Widgets''' are [[windows]] with object-like properties. They are used to make up elements of a user interface and react automatically to certain events (e.g. a click of a [[BUTTON]]).
+
'''emWin Widgets''' are [[windows]] with object-like properties. They are used to make up elements of a user interface and react automatically to certain events (e.g. a click of a [[BUTTON]]).
   
 
Widgets require the [[Window Manager]]. Once a widget is created, it is treated just like any other window. Like windows, widgets are also referred to by handles.
 
Widgets require the [[Window Manager]]. Once a widget is created, it is treated just like any other window. Like windows, widgets are also referred to by handles.
Line 7: Line 7:
 
emWin offers many widgets that can be used in an application. The following table gives an overview of all of the widgets that are available.
 
emWin offers many widgets that can be used in an application. The following table gives an overview of all of the widgets that are available.
   
{| class="wikitable"
+
{| class="wikitable" style="width: 80%;"
 
|-
 
|-
 
! Widget name !! Screenshot !! Description
 
! Widget name !! Screenshot !! Description
 
|-
 
|-
  +
| [[BUTTON]]
| [[BUTTON]] || [[File: Button.gif]] || Button which can be pressed. Text or bitmaps may be displayed on a button.
 
  +
| [[File: Button.gif|center]]
  +
| Button which can be pressed. Text or bitmaps may be displayed on a button.
 
|-
 
|-
  +
| [[CHECKBOX]]
| [[CHECKBOX]] || [[File: Checkbox.gif]] || Check box which may be checked or unchecked.
 
  +
| [[File: Checkbox.gif|center]]
  +
| Check box which may be checked or unchecked.
 
|-
 
|-
  +
| [[DROPDOWN]]
| [[DROPDOWN]] || [[File: Dropdown.gif]] || Dropdown listbox, opens a listbox when pressed.
 
  +
| [[File: Dropdown.gif|center]]
  +
| Dropdown listbox, opens a listbox when pressed.
 
|-
 
|-
  +
| [[EDIT]]
| [[EDIT]] || [[File: Edit.gif]] || Single-line edit field which prompts the user to type a number or text.
 
  +
| [[File: Edit.gif|center]]
  +
| Single-line edit field which prompts the user to type a number or text.
 
|-
 
|-
  +
| [[FRAMEWIN]]
| [[FRAMEWIN]] || [[File: Framewin.gif]] || Frame window. Creates the typical GUI look.
 
  +
| [[File: Framewin.gif|center]]
  +
| Frame window. Creates the typical GUI look.
 
|-
 
|-
  +
| [[GAUGE]]
| [[GRAPH]] || [[File: GRAPH.gif|200px]] || Graph widget, used to show curves or measured values.
 
  +
| [[File:GAUGE.png|center]]
  +
| Gauge widget, basically a radial progress bar.
 
|-
 
|-
  +
| [[GRAPH]]
| [[HEADER]] || [[File: Header.gif]] || Header control, used to manage columns.
 
  +
| [[File: GRAPH.gif|200px|center]]
  +
| Graph widget, used to show curves or measured values.
 
|-
 
|-
  +
| [[HEADER]]
| [[ICONVIEW]] || [[File: Iconview.png|200px]] || Icon view widget. Useful for icon based platforms as found in common hand held devices.
 
  +
| [[File: Header.gif|center]]
  +
| Header control, used to manage columns.
 
|-
 
|-
  +
| [[ICONVIEW]]
| [[IMAGE]] || [[File: Image.png]] || Image widget. Displays several image formats automatically.
 
  +
| [[File: Iconview.png|200px|center]]
  +
| Icon view widget. Useful for icon based platforms as found in common hand held devices.
 
|-
 
|-
  +
| [[IMAGE]]
| [[KNOB]] (deprecated) || [[File: Knob.png|200px]] || Knob widget which can be used to adjust uncountable values.
 
  +
| [[File: Image.png|center]]
  +
| Image widget. Displays several image formats automatically.
 
|-
 
|-
  +
| [[KEYBOARD]]
| [[LISTBOX]] || [[File: Listbox.gif]] || Listbox which highlights items as they are selected by the user.
 
  +
| [[File: KEYBOARD.png|300px|center]]
  +
| Keyboard widget which can be used as a screen keyboard for user input to EDIT/MULTIEDIT widgets.
 
|-
 
|-
  +
| [[LISTBOX]]
| [[LISTVIEW]] || [[File: Listview.gif]] || Listview widgets are used to creates tables.
 
  +
| [[File: Listbox.gif|center]]
  +
| Listbox which highlights items as they are selected by the user.
 
|-
 
|-
  +
| [[LISTVIEW]]
| [[LISTWHEEL]] || [[File: Listwheel.png|200px]] || Listwheel widget. The data can be moved and accelerated via pointer input device.
 
  +
| [[File: Listview.gif|center]]
  +
| Listview widgets are used to creates tables.
 
|-
 
|-
  +
| [[MENU]]
| [[MENU]] || [[File: Menu.png]] || Menu widgets are used to create horizontal and vertical menus.
 
  +
| [[File: Menu.png|center]]
  +
| Menu widgets are used to create horizontal and vertical menus.
 
|-
 
|-
  +
| [[MULTIEDIT]]
| [[MULTIEDIT]] || [[File: MULTIEDIT.gif]] || Multiedit widgets are used to edit multiple lines of text.
 
  +
| [[File: MULTIEDIT.gif|center]]
  +
| Multiedit widgets are used to edit multiple lines of text.
 
|-
 
|-
  +
| [[MULTIPAGE]]
| [[MULTIPAGE]] || [[File: MULTIPAGE.png]] || Multipage widgets are used to create dialogs with multiple pages.
 
  +
| [[File: MULTIPAGE.png|center]]
  +
| Multipage widgets are used to create dialogs with multiple pages.
 
|-
 
|-
  +
| [[PROGBAR]]
| [[PROGBAR]] || [[File: Progbar.gif]] || Progress bar used for visualization.
 
  +
| [[File: Progbar.gif|center]]
  +
| Progress bar used for visualization.
 
|-
 
|-
  +
| [[QRCODE]]
| [[RADIO]] || [[File: Radio.gif]] || Radio button which may be selected. Only one button may be selected at a time.
 
  +
| [[File:QRCodeWidget.gif|center]]
  +
| QR code.
 
|-
 
|-
  +
| [[RADIO]]
| [[ROTARY]] || [[File: ROTARY.png]] || Rotary widget which can be rotated to return uncountable values.
 
  +
| [[File: Radio.gif|center]]
  +
| Radio button which may be selected. Only one button may be selected at a time.
 
|-
 
|-
  +
| [[ROTARY]]
| [[SCROLLBAR]] || [[File: Scrollbar.gif]] || Scrollbar which may be horizontal or vertical.
 
  +
| [[File: ROTARY.png|center]]
  +
| Rotary widget which can be rotated to return uncountable values.
 
|-
 
|-
  +
| [[SCROLLER]]
| [[SLIDER]] || [[File: Slider.gif]] || Slider bar used for changing values.
 
  +
| [[File: SCROLLER.png|center]]
  +
| Smartphone-like scrollbar widget which may be horizontal or vertical.
 
|-
 
|-
  +
| [[SLIDER]]
| [[SPINBOX]] || [[File: SPINBOX.png]] || Spinning box to display and adjust a specific value.
 
  +
| [[File: Slider.gif|120px|center]]
  +
| Slider bar used for changing values.
 
|-
 
|-
  +
| [[SPINBOX]]
| [[SWIPELIST]] || [[File: SWIPELIST.png|200px]] || Swipelist widgets are used for creating swipeable lists which could be moved by swiping the finger (or any other PID) over the touch screen.
 
  +
| [[File: SPINBOX.png|100px|center]]
  +
| Spinning box to display and adjust a specific value.
 
|-
 
|-
  +
| [[SWIPELIST]]
| [[SWITCH]] || [[File: SWITCH.png]] || Switch widget which can be toggled.
 
  +
| [[File: SWIPELIST.png|200px|center]]
  +
| Swipelist widgets are used for creating swipeable lists which could be moved by swiping the finger (or any other PID) over the touch screen.
 
|-
 
|-
  +
| [[SWITCH]]
| [[TEXT]] || [[File: Text.gif]] || Static text typically used in dialogs.
 
  +
| [[File: SWITCH.png|center]]
  +
| Switch widget which can be toggled.
 
|-
 
|-
  +
| [[TEXT]]
| [[TREEVIEW]] || [[File: Treeview.gif]] || Treeview widget for managing hierarchical lists.
 
  +
| [[File: Text.gif|60px|center]]
  +
| Static text typically used in dialogs.
 
|-
 
|-
  +
| [[TREEVIEW]]
| [[WINDOW]] || || Simple window.
 
  +
| [[File: Treeview.gif|center]]
  +
| Treeview widget for managing hierarchical lists.
  +
|-
  +
| [[WHEEL]]
  +
| [[File: WHEEL.png|center]]
  +
| Scrollable rotating wheel that displays lists of texts and/or bitmaps.
  +
|-
  +
| [[WINDOW]]
  +
|
  +
| Simple window.
  +
|}
  +
  +
=== Obsolete widgets ===
  +
  +
The following widgets are obsolete but are still included in emWin for compatibility reasons.
  +
The widgets have been replaced with newer versions which are also listed below.
  +
  +
{| class="wikitable" style="width: 80%;"
  +
|-
  +
! Widget name !! Screenshot !! Replaced by !! Description
  +
|-
  +
| [[KNOB]]
  +
| [[File: Knob.png|200px|center]]
  +
| [[ROTARY]]
  +
| Knob widget which can be used to adjust uncountable values.
  +
|-
  +
| [[LISTWHEEL]]
  +
| [[File: Listwheel.png|200px|center]]
  +
| [[WHEEL]]
  +
| Listwheel widget. The data can be moved and accelerated via pointer input device.
  +
|-
  +
| [[SCROLLBAR]]
  +
| [[File: Scrollbar.gif|center]]
  +
| [[SCROLLER]]
  +
| PC-style scrollbar which may be horizontal or vertical.
 
|}
 
|}

Latest revision as of 10:37, 14 June 2022

emWin Widgets are windows with object-like properties. They are used to make up elements of a user interface and react automatically to certain events (e.g. a click of a BUTTON).

Widgets require the Window Manager. Once a widget is created, it is treated just like any other window. Like windows, widgets are also referred to by handles.

Available widgets

emWin offers many widgets that can be used in an application. The following table gives an overview of all of the widgets that are available.

Widget name Screenshot Description
BUTTON
Button.gif
Button which can be pressed. Text or bitmaps may be displayed on a button.
CHECKBOX
Checkbox.gif
Check box which may be checked or unchecked.
DROPDOWN
Dropdown.gif
Dropdown listbox, opens a listbox when pressed.
EDIT
Edit.gif
Single-line edit field which prompts the user to type a number or text.
FRAMEWIN
Framewin.gif
Frame window. Creates the typical GUI look.
GAUGE
GAUGE.png
Gauge widget, basically a radial progress bar.
GRAPH
GRAPH.gif
Graph widget, used to show curves or measured values.
HEADER
Header.gif
Header control, used to manage columns.
ICONVIEW
Iconview.png
Icon view widget. Useful for icon based platforms as found in common hand held devices.
IMAGE
Image.png
Image widget. Displays several image formats automatically.
KEYBOARD
KEYBOARD.png
Keyboard widget which can be used as a screen keyboard for user input to EDIT/MULTIEDIT widgets.
LISTBOX
Listbox.gif
Listbox which highlights items as they are selected by the user.
LISTVIEW
Listview.gif
Listview widgets are used to creates tables.
MENU
Menu.png
Menu widgets are used to create horizontal and vertical menus.
MULTIEDIT
MULTIEDIT.gif
Multiedit widgets are used to edit multiple lines of text.
MULTIPAGE
MULTIPAGE.png
Multipage widgets are used to create dialogs with multiple pages.
PROGBAR
Progbar.gif
Progress bar used for visualization.
QRCODE
QRCodeWidget.gif
QR code.
RADIO
Radio.gif
Radio button which may be selected. Only one button may be selected at a time.
ROTARY
ROTARY.png
Rotary widget which can be rotated to return uncountable values.
SCROLLER
SCROLLER.png
Smartphone-like scrollbar widget which may be horizontal or vertical.
SLIDER
Slider.gif
Slider bar used for changing values.
SPINBOX
SPINBOX.png
Spinning box to display and adjust a specific value.
SWIPELIST
SWIPELIST.png
Swipelist widgets are used for creating swipeable lists which could be moved by swiping the finger (or any other PID) over the touch screen.
SWITCH
SWITCH.png
Switch widget which can be toggled.
TEXT
Text.gif
Static text typically used in dialogs.
TREEVIEW
Treeview.gif
Treeview widget for managing hierarchical lists.
WHEEL
WHEEL.png
Scrollable rotating wheel that displays lists of texts and/or bitmaps.
WINDOW Simple window.

Obsolete widgets

The following widgets are obsolete but are still included in emWin for compatibility reasons. The widgets have been replaced with newer versions which are also listed below.

Widget name Screenshot Replaced by Description
KNOB
Knob.png
ROTARY Knob widget which can be used to adjust uncountable values.
LISTWHEEL
Listwheel.png
WHEEL Listwheel widget. The data can be moved and accelerated via pointer input device.
SCROLLBAR
Scrollbar.gif
SCROLLER PC-style scrollbar which may be horizontal or vertical.