Confirmedusers, Bureaucrats, editor, Administrators
1,522
edits
Modding:GUIs: Difference between revisions
From Vintage Story Wiki
m
VeryGoodDog moved page GUIs to Modding:GUIs
VeryGoodDog (talk | contribs) m (VeryGoodDog moved page GUIs to Modding:GUIs) |
|||
| (7 intermediate revisions by one other user not shown) | |||
| Line 16: | Line 16: | ||
===General Purpose GUI=== | ===General Purpose GUI=== | ||
For any other uses, inerhit from the general purpose class <code>GuiDialog</code>, from which HudElement and GuiDialogBlockEntity also inherit from. You can override | For any other uses, inerhit from the general purpose class <code>GuiDialog</code>, from which HudElement and GuiDialogBlockEntity also inherit from. You can override <code>ToggleKeyCombinationCode</code> to something like "yourAweseomeHotkeyCode" and use <code>capi.Input.RegisterHotKey</code> + <code>capi.Input.SetHotKeyHandler</code> to have your own keyboard key mapped to opening/closing your GUI (example: [https://github.com/anegostudios/vsessentialsmod/blob/master/Systems/WorldMap/WorldMapManager.cs#L105 World Map]) | ||
== GUI Basics == | == GUI Basics == | ||
| Line 56: | Line 56: | ||
Some explanations: | Some explanations: | ||
* <code>ElementStdBounds</code>: Contains a bunch of often used element bounds configurations. See also | * <code>ElementStdBounds</code>: Contains a bunch of often used element bounds configurations. See also [https://github.com/anegostudios/vsapi/blob/master/Client/UI/ElementStdBounds.cs ElementStdBounds] on Github. | ||
* <code>ElementBounds.Fixed(0, 0, 300, 300)</code>: Create a new bounds instance with fixedX/Y at 0/0 and a fixed widt/height of 300/300 pixels. | * <code>ElementBounds.Fixed(0, 0, 300, 300)</code>: Create a new bounds instance with fixedX/Y at 0/0 and a fixed widt/height of 300/300 pixels. | ||
* <code>CairoFont.WhiteDetailText()</code>: Create a new font configuration based on a often used size and color, in this case white with font size 14 | * <code>CairoFont.WhiteDetailText()</code>: Create a new font configuration based on a often used size and color, in this case white with font size 14 | ||
* <code>SingleComposer</code>: This property is defined in the <code>GuiDialog</code> class. Its a getter/setter to the <code>Composers</code> dictionary. It contains all the "windows" of this dialog which are then rendered / handled by this GuiDialog instance | * <code>SingleComposer</code>: This property is defined in the <code>GuiDialog</code> class. Its a getter/setter to the <code>Composers</code> dictionary. It contains all the "windows" of this dialog which are then rendered / handled by this GuiDialog instance | ||
==Fancying it up== | |||
This is of course the absolute minimum example that will only show some text. Let's add a title bar and a dialog background: | This is of course the absolute minimum example that will only show some text. Let's add a title bar and a dialog background: | ||
| Line 94: | Line 94: | ||
This covers some of the most basic parts. There is a grand amount of various pre-built UI elements that each come with their own argument list that are in dire need of Documentation. Here's an overview of some of the more commonly used ones | This covers some of the most basic parts. There is a grand amount of various pre-built UI elements that each come with their own argument list that are in dire need of Documentation. Here's an overview of some of the more commonly used ones | ||
===Dialog / Graphics=== | ====Dialog / Graphics==== | ||
* <code>.AddShadedDialogBG</code>: Draws a pretty background and dialog border | * <code>.AddShadedDialogBG</code>: Draws a pretty background and dialog border | ||
* <code>.AddDialogTitleBar</code>: Draws a title bar with a close button and a button to move around the dialog | * <code>.AddDialogTitleBar</code>: Draws a title bar with a close button and a button to move around the dialog | ||
| Line 113: | Line 113: | ||
* <code>.AddNumberInput</code>: Adds an editable text field built for entering numbers | * <code>.AddNumberInput</code>: Adds an editable text field built for entering numbers | ||
* <code>.AddTextArea</code>: Adds multiple line editable text field | * <code>.AddTextArea</code>: Adds multiple line editable text field | ||
====Tables/Grids/Inventory==== | |||
* <code>.AddItemSlotGrid</code>: Create a grid displaying the contents of supplied inventory (example: [https://github.com/anegostudios/vsessentialsmod/blob/master/Gui/GuiDialogCarcassContents.cs GuiDialogCarcassContents]) | |||
* <code>.AddSkillItemGrid</code>: Create a grid of custom elements (example: [https://github.com/anegostudios/vssurvivalmod/blob/master/Gui/GuiDialogBlockEntityRecipeSelector.cs GuiDialogBlockEntityRecipeSelector]) | |||
====Other==== | ====Other==== | ||
