Russell Gordon

Creating and Running a New Animation

12 October, 2020

    Before following this tutorial, be sure you've read about the illusion of movement.

    This tutorial explains how to create a new sketch to make further changes in. You'll need to do this every time you want to set up a new animation.

    Two-finger tap on the Animation folder, and choose New File....

    Naming conventions are:

    • no spaces
    • each word in the file name begins with a capital letter

    This time, let's name the new file MovingSquare.swift.

    Now, open the EmptySketch.swift file. This is a template. Ideally, never change the code in this file. Instead, place your cursor in the file and press Command-A to select all the code. Then press Command-C to copy the code to your clipboard.

    Now go back to the MovingSquare.swift file. Place your cursor anywhere in the file, and press Command-A. Then, press Command-V to paste all the code from your clipboard, replacing the existing code.

    Now you need to rename the class. Change line 13 to read:

    class MovingSquare: NSObject, Sketchable {
    

    Typically, the name of your class should always match the file name you selected. In this case, we went with MovingSquare.

    Finally, we need to tell the Animation project to use this new MovingSquare class when it draws an animation.

    Change to the Sketch.swift file.

    Highlight line 11, then comment it out using the Command-/ keyboard shortcut.

    Now add this line of code below line 18:

    var currentDrawing = MovingSquare()
    

    The Animation project will now create an instance of the MovingSquare class when it draws an animation.

    To summarize, this is how to set up a new file that you can create an animation within.

    If you run the animation now, you'll notice nothing happens. That's because the MovingSquare class doesn't have any instructions for how to draw an animation – it's a bare-bones template.

    In the next tutorial, learn how to define an animation and adjust how elements move within that animation.