Creating a Starting Layout Sheet - LiruJ/GuiCookie GitHub Wiki

Overview

The layout sheet determines which elements go where and define the general structure of the UI.

Add a new XML file to the "Gui" folder from the stylesheet guide and call it "Layout.xml", ensure it is set to "Copy if newer". Add a new node called "Main".

Linking Styles

Add a new attribute to the main node called "Styles", this will define the path of every stylesheet that this layout uses. For now, just have "Gui\\Style", referring to the stylesheet created in the previous section.

Add a "DefaultStyle" attribute with a "Default" value, this means that any element without a specified style will fall back to the style called "Default".

<Main Styles="Gui\\Style" DefaultStyle="Default">

</Main>

Creating the First Element

Nodes can now be added to the main node to add elements to the layout. For now, have a TextBox node with the following settings:

<Main Styles="Gui\\Style" DefaultStyle="Default">
   <TextBox Size="15%, 10%" Text="Hello World!"/>
</Main>

See the List of Default Templates to see the templates available by default.

Next Steps

Now that the layout has been made, the next step is creating and running the UI in MonoGame.

⚠️ **GitHub.com Fallback** ⚠️