SpriteUI Tutorial

This is a place holder for the Tutorial on Getting Started with SpriteUI.

I expect to be building it over the next few days.

Little Angel

I am finding that I just don't have time to complete this page properly, and SpriteUI in general is getting a little stale. If you need help, PM on the Unity3d Forums (Little Angel) and I'll either add more here or give you a hand.

Getting started with SpriteUI

SpriteUI is a simple UI system built on top of the SpriteManager by CedarParkDad.

This unity package has a working example using all of the C# scripts needed to run SpriteUI, including a working version of SpriteManager.

For safety's sake you can at this point create a new empty project and install this unity package and test the contents.

There are elements that are ultimately unnecessary for your project (including a texture atlas for testing), and once testing is done, can be safely discarded.

All the files (except one) needed to run SpriteUI for your project will be found in the Plugins folder. The only file not in the Plugins folder is the SampleUIManager script.

Test this package and look at how the scripts work in a safe environment.

SpriteUI for your project

At this point you can either move or copy these files in the finder to your current project, or reinstall them into your current project using the unity package you've downloaded. You may deselect all of the unnecessary files such as the texture atlas.

All the files (except for the SampleUIManager) needed to run SpriteUI for your project should go into the Plugins folder. For reasons related to compilation order, especially if you have a Unity.js project, you should not place them anywhere else.

The only file not in the Plugins folder is the SampleUIManager script, which can be renamed. I use MyUIManager as to prevent confusion with UIManager.cs - which needs to stay in the Plugins folder. This file (which I'll call MyUIManager from now on) can be placed in the the folder of your choice, e.g.: Scripts, or GUI.

Setting up SpriteUI

Once you have installed of the scripts, you need to set them up.

Create an empty object at 0,0,0. Name it something identifiable. I use UIManagerObject. Move this object to a new layer, which in the example is simply called "UI Layer". Now add the SpriteUI script from the Plugins folder to this object.

Setup the SpriteManager settings in the SpriteUI script according to its documentation*. The main thing to remember is to allocate enough space for all elements and buttons. Now set the following:

UILayer - The layer in which the UI will live

Zero Location - Where on the screen 0,0 will be

Vertical Orientation - The value to set iPhoneSettings.verticalOrientation

Next you will need to go to the main camera and remove the UILayer (in this example "UI Layer") from the Culling Mask.

The you need to use a MyUIManager script. (I'd suggest just copying/renaming the SampleUIManager and using that as it implements all of the UIManager interface.)

Here is the opening of my MyUIManager.js (note the class extension of the top - more to come on this). This is a place to get started. More to come! Including use in either C# or Unity.js. I'll include the Unity.js translation of "SampleUIManager". I'll show some examples of bar graphs and rotating indicators, and functions that pop up splash screens, etc.. You'll just have to bear with me. If you have any immediate questions or suggestions, you can put them in the SpriteUI thread. If you want to edit this page, feel free!

[SpriteUI page 9 has one of the most complete Unity.js versions of MyUIManager... and see what I've posted below: