Time for action – grabbing the picture clock graphics

As per our agreement, all the pretty pictures are pre-drawn for you. Download the Unity assets package for this chapter. When you're ready to import it, navigate to Assets | Import Package | Custom Package… and find the .unitypackage file. Open it up, and there she be! If only obtaining game graphics in a real production environment was this easy.

Let's get right to work by creating some code to make use of two of the graphics in the package—a blue clock background bar, and a shiny yellow foreground bar that will slowly shrink as time marches on.

1. Let's go back to the top of the ClockScript and create a variable to store the elapsed time as a percentage:

   var clockIsPaused : boolean = false;
   var startTime : float; //(in seconds)
   var timeRemaining : float; //(in seconds)
   var percent:float;
   

2. Create some variables to store the foreground (FG) and background (BG) textures, as well as the initial width of the yellow foreground bar:

   var percent:float...