UI editor

Launcher_release 2018-04-17 13-33-40-70.png

As you go into the UI editor all states or canvases are toogled on, which means you can see all the UI for the different menus and the ingame UI. In this case the ingame UI happends to be behind the background image from a menu so it is not vissible.

Launcher_release 2018-04-17 13-33-50-74.png

Everything except main menu is now toggled off and the the only thing showing is what the player would see when he/she is in the main menu.

Launcher_release 2018-04-17 13-35-50-92.png

By pressing the "Create Button" button you create a button with a couple of attributes. 

Button Attributes

  • Tag/Stat
    • Decides what state it should be shown in, for example in what menu or if it should be shown in the game.
  • Function
    • Decide which function from the game should be run when the button is pressed.
    • Here a designer can decide for themself how the navigation should work between menus.
  • Sprite
    • Scroll between allready loaded sprites.
  • Material
    • Scroll between allready loaded shaders.
  • Position
    • Move around around the sprite or set an exact position on the spirte.
  • Dimension
    • Width and height of the buttons, aswell as the collision box.
  • Color
    • Here you can change the color if needed.
  • Hover Color
    • Decides that color it changes to when the player hovers onto the button.
  • Layer
    • Layer decided in what order the buttons should be rendered in, a higher value renders above lower values.
  • Then there is three buttons left. You got "Release" which untoggles the current selected buttons or sprite, "Save" which saves the current setup of UI, and "Load" which loads the saved UI. So if needed you can reset back to the previously saved UI.
Launcher_release 2018-04-17 13-35-47-28.png

By pressing the "Create Spirte" button you can create a sprite with a couple of attributes.

Sprite Attributes

Like buttons sprite also have,

  • Tag/State
  • Sprite
  • Material
  • Position
  • Dimension
  • Color
  • Layer

But with one extra attribute,

  • EXID
    • This is the id of a varible that get sent to the shader of the sprite.
    • This value the shader get is handle depending on the shader.
      • In our game we send in for example the health of the player as a value between 0 and 1, and the shader uses that value to render the health on the healthbar and make it blink when the player is on low health.
      • It is also used when to display the amount of ammo left in a weapon.
      • Which weapon that is active.
      • And in options menu, the volume bars are also handled with shaders.