In this article, we're be building on our project from the previous article, by using Coroutines and LeanTween to animate the different operational steps of the selection sort algorithm. This will be delivered through multiple instructional videos and supplementary exercises. They should be completed in order, and it's recommended that you pause and re-watch any parts that you have trouble following.

1. Pausing with Coroutines

When we run our project that we’ve developed, we can see that the cubes are sorted almost instantly. However, what we want is to actually visualise the sorting process itself. To do this we need to introduce some delay between the steps of the selection sort algorithm, which will give us some time to appreciate the process. One approach to introduce some delay is using coroutines. A coroutine is similar to a function, and looks almost identical when it’s written in C#. With a coroutine, we can use the yield statement, which is similar to return, but it instead pauses execution of the current function and automatically resume it at the next frame.

Watch video

Try using coroutines to pause at different stages throughout the selection sort algorithm. Experiment with different timings, as 1 second is not always ideal for a transition.

2. Animation with LeanTween

Now, we’re going to use LeanTween within our new coroutine, to improve our visualisation of the selection sort process. LeanTween will allow us to create some smooth transitions, both for our movement and any colour changes.

Watch video

At the end of the video we introduced our first colour transition. Using the colour changing code as a starting point, use colour changes in combination with the coroutine to produce something similar to the clip of the "final product" from the start of the video. 

3. Creating a User Interface

Finally, we're going to start creating our user interface to control our visualisation. We'll add three elements: a start button, a reset button, and a text input field to specify the number of cubes we want to sort.

Watch video

Exercise 1:
The user interface will have many bugs, most of these around error checking. Some to consider:

  1. You can click the start button multiple times which will have unintended behaviour.
  2. You can enter something other than a number into the # Cubes box which will have unintended behaviour.

Fix these and anything else you can identify.

Exercise 2:

Extend the application to enable the following features:

  1. Allow the user to specify the minimum/maximum height of the cubes through two text input fields in the user interface.
  2. Change the code so that we are sorting a list of floats instead of ints.
  3. Do some research on how to adjust the camera to always keep the cubes in view. E.g., if you set the number of cubes to sort as 100, then they will be out of view.
  4. Do some research on how to introduce a Pause feature, and then allow the user to pause/resume the visualisation with a button.

Extra. Create a Game

Extend the Unity project in this GitHub repository: to create an interesting game.

Leave a Reply

Close Menu