Creating a widget - Revision history

Tectu: /* Examples */

2021-09-09T10:09:12Z

‎Examples

Tectu: /* Example */

2016-08-11T13:48:11Z

‎Example

Tectu: /* Object structure */

2016-05-28T18:16:49Z

‎Object structure

Tectu: /* Object structure */

2016-05-28T18:16:21Z

‎Object structure

Tectu: /* Flags */

2016-04-13T20:18:52Z

‎Flags

Tectu: /* Example */

2016-04-13T20:18:16Z

‎Example

Tectu: /* Theory of operation */

2016-04-13T20:14:45Z

‎Theory of operation

Tectu: /* Creating the widget */

2016-04-13T19:49:25Z

‎Creating the widget

Tectu: /* Creating the widget */

2016-04-13T19:49:02Z

‎Creating the widget

Tectu: /* Creating the widget */

2016-04-13T19:48:50Z

‎Creating the widget

← Older revision		Revision as of 10:09, 9 September 2021
Line 268:		Line 268:

	== Examples ==		== Examples ==
−	Various examples can be found in the download section: https://community.ugfx.~~org~~/files/category/1-%C2%B5gfx-library/	+	Various examples can be found in the download section: https://community.ugfx.io/files/category/1-%C2%B5gfx-library/

@@ Line 267: / Line 267: @@
 Besides those rules it's possible to pass additional parameters that change the behavior of the widget. For example, the [[frame]] widget takes an additional ''flags'' parameters which specify whether there are close and min-max buttons in the widget decoration.
-== Example ==
+== Examples ==
-This part of the article will show how to actually implement a widget. As an example we'll implement a statusbar. The statusbar is very application specific. It consists of a time label, a button to open a settigs dialog and two icons that show whether a USB connection and an SD-Card are present.
+Various examples can be found in the download section: https://community.ugfx.org/files/category/1-%C2%B5gfx-library/
-Note that there are plenty of other examples readily available: The existing widgets. As the source of the µGFX library is completely open all existing, built-in widgets can be used as examples. The built-in widgets can be found in the following location: ''/src/gwin/''.

@@ Line 33: / Line 33: @@
 * Text
 * [[Widgets#Widget_Style|WidgetStyle]]
-* [[GWIN#Widget_tag|Widget Tag]]
+* [[Widgets#Tag|Widget Tag]]
 * Flags
 The widget object is the widget itself: It's what the user of the widget will create an instance of. The widget object must be available to the outside world. Therefore, the widget object must be declared in the header file (referred to as <code>mywidget.h</code> above).

@@ Line 32: / Line 32: @@
 * [[Font_rendering|Font]]
 * Text
-* [[GWIN#Widget_Style|WidgetStyle]]
+* [[Widgets#Widget_Style|WidgetStyle]]
 * [[GWIN#Widget_tag|Widget Tag]]
 * Flags

@@ Line 39: / Line 39: @@
 ==== Flags ====
 The flags need some explanation: The <code>GWindowObject</code> contains a field of the type <code>uint32_t</code> and can therefore represent 32 flags. Some of these flags are used by the GWIN module internally to store certain information like the enable state, the visibility, whether the widget was allocated dynamically and so on. However, the first 8 bits are reserved for widget internal use. For example, the [[PushButton|pushbutton widget]] uses one of these bits to keep record of the pressed/release state. The [[Label|label widget]] uses the flags to keep the information whether the a border around the text should be rendered and so on.
-Flags are usually used to define the state of a widget and are therefore often used in the rendering routine. For example, the [[pushbutton]] widget uses the flags to store the ''pressed/released'' state. As it's possible to create a [[custom rendering routine]] outside of the widget the author of the custom rendering routine needs to have access to those flags. Therefore, the flags should be defined in the header file.
+Flags are usually used to define the state of a widget and are therefore often used in the rendering routine. For example, the [[PushButton]] widget uses the flags to store the ''pressed/released'' state. As it's possible to create a [[custom rendering routine]] outside of the widget the author of the custom rendering routine needs to have access to those flags. Therefore, the flags should be defined in the header file.
 === VMT ===

← Older revision		Revision as of 20:18, 13 April 2016
Line 269:		Line 269:
	== Example ==		== Example ==
	This part of the article will show how to actually implement a widget. As an example we'll implement a statusbar. The statusbar is very application specific. It consists of a time label, a button to open a settigs dialog and two icons that show whether a USB connection and an SD-Card are present.		This part of the article will show how to actually implement a widget. As an example we'll implement a statusbar. The statusbar is very application specific. It consists of a time label, a button to open a settigs dialog and two icons that show whether a USB connection and an SD-Card are present.
		+	Note that there are plenty of other examples readily available: The existing widgets. As the source of the µGFX library is completely open all existing, built-in widgets can be used as examples. The built-in widgets can be found in the following location: ''/src/gwin/''.

@@ Line 7: / Line 7: @@
 == Theory of operation ==
 A widget consists of three main parts: The '''object structure''', the '''VMT''' and the '''rendering routine'''.
 === Object structure ===
@@ Line 34: / Line 35: @@
 * [[GWIN#Widget_tag|Widget Tag]]
 * Flags
 ==== Flags ====
 The flags need some explanation: The <code>GWindowObject</code> contains a field of the type <code>uint32_t</code> and can therefore represent 32 flags. Some of these flags are used by the GWIN module internally to store certain information like the enable state, the visibility, whether the widget was allocated dynamically and so on. However, the first 8 bits are reserved for widget internal use. For example, the [[PushButton|pushbutton widget]] uses one of these bits to keep record of the pressed/release state. The [[Label|label widget]] uses the flags to keep the information whether the a border around the text should be rendered and so on.
 === VMT ===
@@ Line 123: / Line 126: @@
 </source>
 Note how the VMTs reflect the inheritance of the GWIN elements: [[Windows]], [[widgets]] and [[containers]]. If you want to implement a widget, you don't have to implement the container VMT.
 ==== Function pointers ====

@@ Line 231: / Line 231: @@
 So far we looked at how a widget is defined and how the VMT is filled in. However, we still need to actually ''create'' the widget so we can use it - the widget needs a constructor. The constructor (from here on also referred to as ''"the create function"'') is responsible for allocation and initializing the widget object and therefore the <code>GWidgetObject</code> base class.
 The create function has to follow a couple of rules in order to blend into the GWIN module:
-* It returns a GHandle ''(See [[GWIN#GHandle]])''
+* It returns a GHandle ''(See [[GWIN#GHandle|GHandle]])''
-* It takes a <code>GDisplay*</code> pointer ''(See [[GDISP#GDisplay]])''
+* It takes a <code>GDisplay*</code> pointer ''(See [[GDISP#GDisplay|GDisplay]])''
 * It takes a pointer to the widget object which it initializes
-* It takes a pointer to a <code>GWidgetInit</code> structure ''(See [[Widgets#Initialization]])''
+* It takes a pointer to a <code>GWidgetInit</code> structure ''(See [[Widgets#Initialization|widget initialization]])''
 * If the widget object pointer is a null pointer the function has to dynamically allocate the widget object
 An example would look like this:

@@ Line 244: / Line 244: @@
          return 0;
+     }
      // Initialize the object struct
      wo->myVariable1 = 0;
      wo->currentValue = 0;