Differences

This shows you the differences between two versions of the page.

--- dragengine:modules:dragonscript:xmlguitheme:guitheme [2018/02/26 15:28] – [Widget Designers] dragonlord
+++ dragengine:modules:dragonscript:xmlguitheme:guitheme [2018/03/01 08:57] (current) – [Named Gui Themes] dragonlord
@@ Line 50: / Line 50: @@
 </code>
-Widget designers are selected using the //setDesignrSelector// parameter of widgets. Selectors compose of dot separated names, for example //Label.MyUIComponent.SpecialVersion//. The selector is matched first in its entire length against all defined widget designers. The last widget designer with the exact matching name is chosen. If no widget designer matches the last dot separated name is removed and the matching restarts. In the this example the next match attempt would be with the full name //Label.MyUIComponent//. If this does still not match another component is remove matching now against //Label//. If even this does not match no widget designer is used for the widget. In short the first matching designer from the list below is chosen:
+Widget designers are selected using the //setDesignerSelector// parameter of widgets. Selectors compose of dot separated names, for example //Label.MyUIComponent.SpecialVersion//. The selector is matched first in its entire length against all defined widget designers. The last widget designer with the exact matching name is chosen. If no widget designer matches the last dot separated name is removed and the matching restarts. In the this example the next match attempt would be with the full name //Label.MyUIComponent//. If this does still not match another component is remove matching now against //Label//. If even this does not match no widget designer is used for the widget. In short the first matching designer from the list below is chosen:
   * Label . MyUIComponent . SpecialVersion
@@ Line 61: / Line 61: @@
 ====== Named Gui Themes ======
+Gui Themes define one set of widget designers. Sometimes it is useful to have named gui themes for individual UI parts. For example it can be simpler to use one gui theme for the main menu and another for an in-game component. You can create different gui themes for each of this situation but this requires storing and managing individual gui themes loaded from file. Using named gui themes this can be made simpler avoiding the need to manually track gui theme XML files.
+Each gui theme has a list of named child gui themes. Widgets have a //setThemeSelector()// method. If set the widget uses not the gui theme found in the parent widget but instead picks the named child gui theme from it. Once chosen the gui theme is used as if set to the widget manually.
+Named gui themes are organized in a tree. The top level gui theme has a list of child gui themes which in turn can have more child gui themes. The selector set for the widget composes of a dot separated name, for example //InGame.InventoryWindow//. The parent of the widget has the top level gui theme assigned. The widget then selects first the named gui theme //InGame//. If found it uses this gui theme to continue choosing the named gui theme //InventoryWindow//. This way the widget digs into the theme three picking the best gui theme it can find (meaning the last one which matches). If one gui theme along the path is not found the last found one is used.
+<code xml>
+<!-- Create named gui theme from scratch. -->
+<guiTheme name='MyTheme'>
+   <!-- content... -->
+</guiTheme>
+<!-- Load gui theme from XML file and modify it with the content in the tag. -->
+<guiTheme name='MyTheme2' extend='mytheme.guitheme.xml'>
+   <!-- content... -->
+</guiTheme>
+<!-- Modify a previously defined gui theme by name. -->
+<guiTheme name='MyTheme3' extendNamed='MyTheme'>
+   <!-- content... -->
+</guiTheme>
+</code>
+//setDesignerSelector()// and //setThemeSelector()// both allow to select what widget designer to use for a widget widget but both work slightly different and have their specific use case. Using //setDesignerSelector()// you choose individual styles for individual widgets. Using //setThemeSelector()// you can use different sets of widget designers with the same name. For example If you use a designer selector //Button.MyButton// then you can have only one designer in your gui theme matching this name. If you use //setThemeSelector()// though you can have different themes for the same button. Each theme has a widget designer with the same name but depending on what theme is chosen a different designer is used. This allows to change a UI theme on-the-fly and allows easy modding with the help of named gui themes.
 ====== Importing ======
-Parts of Gui Themes can be placed in external files to reuse definitions. This reduces typing effort and allows to better organize your gui themes. Gui themes can be imported in two ways into the
+Parts of Gui Themes can be placed in external files to reuse definitions. This reduces typing effort and allows to better organize your gui themes. Importing works as if the tags in the referenced file are defined right instead of the import tag. This example shows how this is done:
+<code xml>
+<!-- Import definitions from XML file as if written here. -->
+<import>sharedDefintions.guitheme.xml</import>
+</code>

Drag[en]gine Wiki

User Tools

Site Tools

Differences

Page Tools