No Starch preSS e arly acceSS progr am: Feedback welcome! Welcome to the Early Access edition of the as yet unpublished 2D Unity by Jeff W. Murray! As a prepublication title, this book may be incomplete and some chapters may not have been proofread. Our goal is always to make the best books possible, and we look forward to hearing your thoughts. If you have any comments or questions, email us at [email protected]. If you have specific feedback for us, please include the page number, book title, and edition date in your note, and we’ll be sure to review it. We appreciate your help and support! We’ll email you as new chapters become available. In the meantime, enjoy! 2d U Nit y JeFF w . mU rray Early Access edition, 11/20/15 Copyright © 2015 by Jeff W. Murray. ISBN-13: 978-1-59327-701-7 Publisher: William Pollock Production Editor: Serena Yang Cover Illustration: Josh Ellingson Interior Design: Octopod Studios Developmental Editor: Hayley Baker Technical Reviewer: Mike Desjardins Copyeditor: Anne Marie Walker Compositor: Susan Glinert Stevens Proofreader: Paula L. Fleming No Starch Press and the No Starch Press logo are registered trademarks of No Starch Press, Inc. Other product and company names mentioned herein may be the trademarks of their respective owners. Rather than use a trademark symbol with every occurrence of a trade- marked name, we are using the names only in an editorial fashion and to the benefit of the trademark owner, with no intention of infringement of the trademark. All rights reserved. No part of this work may be reproduced or transmitted in any form or by any means, electronic or mechanical, including photocopying, recording, or by any informa- tion storage or retrieval system, without the prior written permission of the copyright owner and the publisher. The information in this book is distributed on an “As Is” basis, without warranty. While every precaution has been taken in the preparation of this work, neither the author nor No Starch Press, Inc. shall have any liability to any person or entity with respect to any loss or damage caused or alleged to be caused directly or indirectly by the information contained in it. coNte Nt S Introduction Chapter 1: Getting Started in Unity . . . . . . . . . . . . . . . . . . . . . . . . . 1 Chapter 2: Graphics for Your Games . . . . . . . . . . . . . . . . . . . . . . . 17 Chapter 3: Using Unity to Animate 2D Sprites . . . . . . . . . . . . . . . . . 37 Chapter 4: Introduction to Programming . . . . . . . . . . . . . . . . . . . . . 51 Chapter 5: Programming Player Controls and Game Physics . . . . . . . 71 Chapter 6: Introduction to Unity’s User Interface System Chapter 7: Building a Tile-Based Level System Chapter 8: Making a Platform Game Chapter 9: Enemies and Coins Chapter 10: Building an In-Game User Interface Chapter 11: Extras The chapters in red are included in this Early Access PDF. coN teNtS i N d e tail 1 GettinG Started in Unity 1 Creating a Unity Project . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 1 The Main Editor . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 3 Anatomy of a Unity Project . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 5 Project Directories . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 5 Navigating a Scene . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 6 Selecting and Manipulating Objects . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 7 The Hierarchy Panel in Depth . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 7 Rotation and Scale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 8 Snap and Grid Settings . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 9 Copying, Pasting, Duplicating, and Deleting . . . . . . . . . . . . . . . . . . . . . . . . 10 Adding Components . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 11 Gizmos . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 12 Previewing Aspect Ratio and Screen Resolution . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 13 Checking Your Game’s Stats . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 14 Closing Thoughts . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 15 2 GraphicS for yoUr GameS 17 Key Graphical Elements in 2D Games . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 18 Image Formats in Unity . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 19 Choosing Image Size . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 19 Obtaining Premade Graphics . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 20 Buying Stock Assets . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 20 Using Royalty-Free or Public Domain Assets . . . . . . . . . . . . . . . . . . . . . . . . . 20 Create Classic Pixel Art with GrafX2 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 20 Downloading and Installing GrafX2 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 21 Getting Started with GrafX2 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 22 Making a Brick Tile . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 24 Set the Image Size . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 24 Draw the Brick Tile . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 25 Making an Animated Player Sprite . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 27 Set the Image Size . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 27 Draw Your Character . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 28 Animate! . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 31 Generate a Sprite Sheet with Piskel . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 33 Closing Thoughts . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 36 3 USinG Unity to animate 2d SpriteS 37 Cameras . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 37 Importing Images . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 39 Optimizing Your Images . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 42 Import Settings . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 42 Texture Type . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 43 Sprite Mode . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 43 Pixels To Units . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 43 Pivot . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 44 The Sprite Editor Button . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 44 Generate Mip Maps Checkbox . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 44 Filter Mode . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 44 Max Size and Formats . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 44 Character Animation . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 45 Slicing Spritesheets Automatically . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 45 Create an Animation File for Your Character . . . . . . . . . . . . . . . . . . . . . . . . 47 Slicing Spritesheets Manually . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 47 Closing Thoughts . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 49 4 introdUction to proGramminG 51 What Is C#? . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 52 Getting Started . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 52 Bouncing a Ball . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 52 Libraries . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 53 Classes and Inheritance . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 53 Variables . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 54 Game Logic . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 57 Controlling a Moving Bat . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 60 More About Objects . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 60 The Game Loop . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 62 Move the Bat . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 63 Breaking Bricks! . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 64 Use a Loop to Make Bricks . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 65 Color Your Bricks with Arrays . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 67 Closing Words . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 70 5 proGramminG player controlS and Game phySicS 71 Dodging Falling Bricks . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 72 Add the Player Sprite to the Scene . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 73 Programming Player Controls . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 74 Game Physics . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 78 Setting Up Physics and Collisions . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 79 Add Physics to the Player . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 79 Add the Ground . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 79 Create the Brick Object Prefab . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 79 Creating a Game Controller Script . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 81 Adding Polish . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 85 Create a Smashing Brick Particle Effect . . . . . . . . . . . . . . . . . . . . . . . . . . . . 85 Flip the Player . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 90 Closing Thoughts . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 92 2D Unity (Early Access), © 2015 by Jeff W. Murray 1 ge t tiNg Started iN UNit y Unity signaled the beginning of a major shift in who had access to high-end tools. Today, virtually anyone has access to this free and amazing development environment capable of making commercial games. In this chapter, you’ll start by learning your way around Unity’s main editor, also known as the integrated development environment (IDE), where almost everything happens. Then you’ll explore a Unity project and learn how to manipulate objects. creating a Unity project Start Unity and you should see its splash screen followed by the login win- dow. If you don’t already have a Unity account, you can set up one now. The process is simple, so I won’t outline it here; just follow the instructions 2D Unity (Early Access), © 2015 by Jeff W. Murray on the screen. Once you’re logged in, Unity will display a project loading screen (Figure 1-1). Recently opened projects will appear in the Projects section, which makes it easy to pick up where you left off. To open a project that’s not in the recent projects list, you would click Open other. Figure 1-1: The Unity project loading screen Let’s make a new project. Click the New Project button to get started. The New Project window (Figure 1-2) appears and contains two choices for the type of project you want to create, 2D or 3D. Figure 1-2: The New Project window 2 Chapter 1 2D Unity (Early Access), © 2015 by Jeff W. Murray Enter the project name Making2DGamesProject in the Project name text field. Below that you’ll see the default file location for your project. To change it, click the three dots to the right of the text field. Next, click the 2D button and then click Create project. the main editor Before I explain each of the main editor’s panels, let’s change the layout. When Unity creates a project for the first time, the editor loads the default layout (Figure 1-3). The default layout is nice, but it can be a little difficult to use because it forces you to toggle between two of the panels you’re going to be spending a lot of time with. Thankfully, just about everything in Unity is customizable, so you can tailor the panel layout to your liking. Figure 1-3: The main window of the Unity editor in a blank 2D project A selection of preset layouts is available, but use the same 2-by-3 layout that I use so that your experience matches what you see in this book. Click the Layout button at the top right of the editor and change it to 2 by 3. Note When you finish this chapter, be sure to test drive the other layout options. But for now, stick with 2 by 3 so you can see all of the main panels as I describe each one. The layout should now look like the one in Figure 1-4. This layout has five main panels, drop-down menus at the top left, and several tools along the top. Getting Started in Unity 3 2D Unity (Early Access), © 2015 by Jeff W. Murray      Figure 1-4: The Unity editor’s 2-by-3 layout in a blank 2D project You should see two stacked panels on the left. The Scene panel u is a gateway to your game world. It provides a place to build and edit objects in a scene using a free-roaming camera and some tools. The Game panel v is where you test your game to see how it looks to the player. Press the Play button at the top of the screen to test your game at any time. The Hierarchy panel w lists every GameObject that the currently loaded scene contains. GameObject is the base class for the objects that make up your game’s models, cameras, particle effects, sounds, and so on, and the Hierarchy lets you select, change, and create new GameObjects. The Hierarchy displays GameObjects in the order in which they were added to the scene, so the first object you add appears at the top and subsequent items appear underneath. However, you can drag and drop items to place them in any order you like. The Project panel x shows all the assets—the files and folders that con- tain your game’s content—that belong to your Unity project. Just as with a regular file browser, you can create, copy, drag, and drop your files in this panel. The Create menu at the top left of the Project panel lets you add new assets and subfolders to the currently selected folder. The Assets panel, a separate panel within the Project panel, shows cur- rently selected items. The Project panel is fully searchable. The search box runs along top of the panel; you can search by asset name, type of asset, or both by clicking the drop-down arrow next to the magnifying glass. The Inspector panel y is context sensitive: when you select an item in the Project or Hierarchy panel, any editable properties will appear in the Inspector. 4 Chapter 1