Adding Free Prize Functionality To Your Unity Game – Part 2 – Themes and Animations

Skill level: Beginner / Intermediate
Tutorial time: 15 minutes
Implementing in your projects: 5 minutes

Part 1 – Basic Setup
Part 2 – Themes and Animations

Setting a Theme

Setting a theme is easy as the default Free Prize functionality uses the General Message dialog. You can create your own theme, or if you have the Game Framework Asset Store package you will find that this includes some themes along with all the tutorials files, other samples and resources. It also supports our effort in maintaining this framework.

To override the theme for General Message, find the DialogManager on _SceneScope. Open the Dialog Prefab Overrides property and drag the themed GeneralMessage prefab (\FlipwebApps\GameFrameworkSamples\Themes\[Theme Name]\Prefabs\Dialog) onto the GeneralMessage->Prefab field.

Dialog Manager Override

If you run the game again now you will see that the Free Prize functionality uses your theme for the dialog. See the part 5 of the Getting Started tutorial for more information on themes and how you can customise the Free Prize button also.

Themed Free Prize Window

Customised Free Prize Content

We can also add and animate additional content. The Game Framework Asset Store package includes additional models such as that used in Air Hockey Dreams.

To set this up, drag a content prefab such as PresentDialogContent (\FlipwebApps\GameFrameworkSamples\FreePrize\Prefabs) onto FreePrizeManager->Content Prefab on the _GameScope gameobject. As this is animated content then we also need to drag the corresponding animation controller PresentDialogContent (\FlipwebApps\GameFrameworkSamples\FreePrize\Animations) onto Content Animation Controller and enable Content Shows Buttons. Enabling Content Shows Buttons means that the dialog Ok button won’t be displayed straight away, but rather triggered by the animation (usually when it is complete) this stops the user clicking the button before we are ready.

Finally as we are now mixing 2D and 3D content we will need to swap to a different type of UI Canvas type.

First add a new Camera gameobject to your scene (GameObject menu->Camera) and rename it UI Camera. Set it’s Position to 0,0,-10, Clear Flags to Depth onlyCulling Mask to UI, Depth to 10 and remove the components Flare Layer, GUI Layer and Audio Listener. In _SceneScope set the DialogManager Ui Camera property to the new UI Camera gameobject.

UI Camera

If you run the scene now you will see that the FreePrize button appears before the free prize popup. That is because the button’s canvas is still set to Screen Space – Overlay. On the Canvas gameobject change the Render Mode to Screen Space – Camera and add our new UI Camera to Render Camera.

Run the game again and you should have a fully animated and themed Free Prize functionality.

Free Prize Dialog

Wrap Up

In a short amount of time we have created free prize functionality that you can easily integrate into your own game.

If you like the framework then please consider downloading from the asset store for access to the tutorial files, themes and lots of other useful samples and assets. This also helps support our efforts to develop and maintain this framework.

Be sure to also check out the Documentation Pages for more help and tutorials and also check out the Free Prize Overview

If you have any questions or feature requests then let us know below.