Learn how to use the new Unity® UI with ORK Framework.

You can find more information on the new UI here.

Some basic UI prefabs can be downloaded here.

Basic Settings

Open the ORK Framework editor and navigate to Menus > Menu Settings and change the following settings.

ORK Framework will now use the new GUI system. There are additional settings (e.g. for using a camera to render the UI instead of the default overlay), you can find more information about them directly in the ORK Framework editor.

GUI Prefabs

The legacy GUI system used GUISkins to create the GUI – in ORK Framework they’ve been defined in the Default GUI Skins in the Menu Settings and the individual GUI Boxes could override those settings. You’ll notice that the GUISkin fields are no longer available when using the New GUI – instead of using GUISkins, the new GUI will use prefabs to create the GUI. If you don’t select prefabs, ORK will create empty (undecorated) game objects to keep the GUI working.

The created game objects will be updated according to the GUI box they’re used for, i.e. their position and size will be set to the values defined by the GUI box (e.g. content box, name box, choices, ok/cancel buttons). If you want to use input fields, you must define prefabs for them, they wont work otherwise.

Let’s take a look at the individual settings. The Content Box Settings are used for the prefab to create the content box of the GUI box.

• Content Box Prefab
  This prefab is used to create the content box of the GUI box.
  You can add an image to the prefab to display a background box.
• Content Box Child
  You can use this setting if you want the content (i.e. text, choices, etc.) to be placed on a child object of your prefab.
• Content Mask
  The content will be displayed within a Mask using the padding to the border of the content box.
  You can select an image to be used as mask, otherwise the content bounds will define the mask.

The Name Box Settings define the prefab for the name box of the GUI box.

• Name Box Prefab
  This prefab is used to create the name box of the GUI box.
  You can add an image to the prefab to display a background box.
• Name Box Child
  You can use this setting if you want the name content to be placed on a child object of your prefab.

The Button Settings define the prefabs for choices and ok/cancel buttons of the GUI box.

• Choice Prefab
  This prefab is used to create the choices of the GUI box.
  If no ok/cancel button prefabs are defined, this prefab will also be used for them.
  If you define a prefab, make sure to add a Button component to it.
• OK Button Prefab
  This prefab is used to create the ok button.
• Cancel Button Prefab
  This prefab is used to create the cancel button.

The Tab Settings define the prefab used for tabs of the GUI box.

• Tab Prefab
  This prefab is used to create the tabs of the GUI box.
  If no prefab is selected, the choice prefab is used instead.
• Tab Mask
  Like the content mask, you can define a mask image for the tab button area.

The Scrollbar Settings define the prefab used for scrollbars when the GUI box is scrollable.

• Scrollbar Prefab
  This prefab is used to create the scrollbar of the GUI box.
  Don’t select a prefab if you don’t want to use a scrollbar.

The Value Input Settings define the prefabs used for value input fields of the GUI box. ORK Framework will create the field names automatically, you don’t have to add them to the prefabs. Make sure the prefabs have the matching components (e.g. toggle requires a Toggle component).

• Text Input Prefab
  This prefab is used to create text input fields.
  If the text input isn’t displayed correctly, try setting Horizontal Overflow and Vertical Overflow to Overflow in the Text component used to display the input of the input field.
• Toggle Input Prefab
  This prefab is used to create bool input fields.
• Slider Input Prefab
  This prefab is used to create int/float input fields.

UI Interactions

You can start interactions (e.g. Event Interaction or Item Collector components) from UI game objects, e.g. from a Button. Use this setting in the interaction component.

In the UI component settings, add a new event to the event list (e.g. On Click () when using a Button). Select the game object the interaction component is attached to and select the UI Start function from the used component (e.g. when using an Event Interaction component, you’d use EventInteraction > UIStart() or EventInteraction > UIStart(GameObject)).

When using UIStart(GameObject), you can select a game object that will be used as starting object for the interaction.