RagePixel Example #1: Walking

Download the example: WalkerTutorial.unitypackage

(RagePixel not included)

Introduction

RagePixel animation is structured around spritesheet, sprite and frames. Spritesheet holds one or several sprites and sprites hold one or several frames. All the animation frames under a single sprite are of the same size.

Sprites can be named, but frames can't. Frames can be accessed via index number. However, you can define named sub-animations for each sprite with an index range and looping type. Things like WALK and JUMP. These can be called from the scripts.

This tutorial shows how to make simple walking animation and how to execute it from a simple script.


1. Draw a simple one frame sprite. This is our standing animation.



2. Draw three more frames as a walking animation



3. Setup two named animations STAY and WALK.

4. Add this Walker-script to your gameobject:


using UnityEngine;
using System.Collections;

public class Walker : MonoBehaviour {

    //Storing the reference to RagePixelSprite -component
    private IRagePixel ragePixel;
     
    //enum for character state
    public enum WalkingState {Standing=0, WalkRight, WalkLeft};
    public WalkingState state = WalkingState.Standing;

    //walking speed (pixels per second)
    public float walkingSpeed = 10f;

    void Start () {
        ragePixel = GetComponent<RagePixelSprite>();
    }

    void Update () {

        //Check the keyboard state and set the character state accordingly
        if (Input.GetKey(KeyCode.LeftArrow))
        {
            state = WalkingState.WalkLeft;
        }
        else if (Input.GetKey(KeyCode.RightArrow))
        {
            state = WalkingState.WalkRight;
        }
        else
        {
            state = WalkingState.Standing;
        }

        Vector3 moveDirection = new Vector3();
        
        switch (state)
        {
            case(WalkingState.Standing):
                //Reset the horizontal flip for clarity
                ragePixel.SetHorizontalFlip(false);
                ragePixel.PlayNamedAnimation("STAY", false);
                break;

            case (WalkingState.WalkLeft):
                //Flip horizontally. Our animation is drawn to walk right.
                ragePixel.SetHorizontalFlip(true);
                //PlayAnimation with forceRestart=false. If the WALK animation is already running, doesn't do anything. Otherwise restarts.
                ragePixel.PlayNamedAnimation("WALK", false);
                //Move direction. X grows right so left is -1.
                moveDirection = new Vector3(-1f, 0f, 0f);
                break;

            case (WalkingState.WalkRight):
                //Not flipping horizontally. Our animation is drawn to walk right.
                ragePixel.SetHorizontalFlip(false);
                //PlayAnimation with forceRestart=false. If the WALK animation is already running, doesn't do anything. Otherwise restarts.
                ragePixel.PlayNamedAnimation("WALK", false);
                //Move direction. X grows right so left is +1.
                moveDirection = new Vector3(1f, 0f, 0f);
                break;
        }

        //Move the sprite into moveDirection at walkingSpeed pixels/sec
        transform.Translate(moveDirection * Time.deltaTime * walkingSpeed);
    }
}