Galawana Studio

Hiero Match is a Matching/pairing game ‘tutorial’  using unity3d from the book UNITY 3 BLUEPRINTS, written by Craig Stevenson and Simon Quig, and published by Deep Pixel. This tutorial start from chapter 2 and finished to chapter 3.

In this post, I will show you how to add timer effect to the game whenever tiles didn’t match the timer is speeding up.  we would need complete game project files from the book, you can download it here.

First we add new variable with GUIStyle Type to store new Font Style, a variable to store how much time is decreased during gameplay and also a variable to save state when time is speeding up or no. here is the example

//variable to store how much time was decreased during the gameplay
var timeDepleted = 0;
//variable to save state whenever time is speeding up or no
var isTimeDecreased = false;
//variable to store a Gui font style
var Style : GUIStyle;

Now we have 3 variable we need to create our timer effect. Then we need to change font-style to our GUI Label whenever isTimeDecreased state true. Put this code into our onGUI() function, and change the line to show Timer Label into this code below.

 

//create timer string with following format MM.DD
text = String.Format("{0:00}.{1:00}", txtMinutes, txtSeconds);
if (this.isTimeDecreased == false) {
	//create GUI Label with standart GUISkin whenever time isn't speeding up
	GUI.Label(Rect(10,50,150,40), text);
}else{
	//create GUI Label with costumized GUIStyle whenever time is speeding up
	GUI.Label(Rect(10,50,150,40), text, Style);
}

Now we have our GUI code, next we must decrease our current timer by adding guitime with ‘timeDepleted’ variable. Whenever tiles didn’t match we must adding value of ‘timeDepleted’ 3 seconds, which means timer decreased 3 second when tiles didn’t match. to create speeding timer effect, we can use iteration and waitForSeconds() function when adding value of ‘timeDepleted’.

now change ‘var guiTime = Time.time – startTime;’ under conditional ‘stoptimer==false’ inside onGUI() function with this code

//change method to get guitime by adding timeDepleted variable
var guiTime = Time.timeSinceLevelLoad - startTime + timeDepleted;
//Time.timeSinceLevelLoad to reset guiTime everytime Level Loaded

to create speeding effect and to adding value of ‘timeDepleted’ we must put code below inside revealCardTwo() function when tiles didn’t match or Condition ‘if (tName1[0] != tName2[0])’.

function revealCardTwo(){
	// ~~ some revealCardTwo code() from the book

		if (tName1[0] == tName2[0]){
			// ~~ some revealCardTwo code() from the book
		}else{
			canClick = false;
			// set state isTimeDecreased true
			this.isTimeDecreased = true;
			// timer speeding up effect
			for (var i=0; i<3; i++) {
				//adding value of timeDepleted to increase guitime
				timeDepleted+=1.0f;
				// wait for 0.25 seconds to create speeding up effect
				yield new WaitForSeconds(0.25f);
			}
			// set state isTimeDecreased false
			this.isTimeDecreased = false;

			// ~~ some revealCardTwo code() from the book
		}
	// ~~ some revealCardTwo code() from the book
}

Now we have finished with our speeding effect code and we have GUIStyle variable on our tileGenerator, we have to edit it’s font style  so we can show different font style when timer is speeding up. Go to Hierarchy View and select tileGenerator Object. Expand Style properties on Inspector View and change it’s Font Size, Font’s Style and Font Color on Normal properties. For example configuration, see images below.

Note that you could modify your own Style and try to experimenting for every properties value and option as much as you like.

Now you can test it with play button on unity3D windows, and Voila, your timer will speeding up whenever we didn’t have a MATCH !

You can try the modified game here >>

and also checking our Hiero Match tutorial.
1. Hiero Match : Add New Challenge “Shuffle Tiles”
2. Hiero Match : Adding Exploding Particles Whenever Tiles Removed
3. Hiero Match : Speeding Up The Timer Whenever Tiles didn’t Matched
4. Hiero Match : Adding Start Menu GUI
5. Hiero Match : Add New Challenge “Rotating Tiles”
6. Hiero Match : Polish Your Game a Little bit ‘Shine’