Day 103 — Starting out with Tilemap in Unity
Hey and welcome!
Before we get started with Tilemap we’ll need a new project to work with! Go ahead and create one calling it what you want and this time make sure that you choose a 2D template this time instead of 3D or URP.
Once the project has finished loading up head to Window > 2D > Tile Palette and slot that in next to your scene view.
This handy tool is going to be helping us put our Tilemap together. If you have Filebase you’ll find a 2D Mobile Adventure Assets package under the tutorials section and these are what I’ll be using for the duration of this project.
In your Tile Palette choose the Create New Palette option from the dropdown and save it somewhere you’ll remember as you’ll need to create a few palettes for different parts of your environment. The reason for this is because Tilemaps function like layers, meaning that some parts can have priority over others similar to our experience with layers before in the 2D Space Shooter project. We’re going to start with the ground first so call this palette Ground Items.
Before we get started with painting we’ll need to create a Tilemap object which can be done by going to 2D Object > Tilemap > Rectangular in the right-click menu in the hierarchy. Call this one Ground Tilemap or similar. Now head over to Dummy > Environment > Level in your assets and then click on the Ground image in there.
If you’re wanting to follow along, this is just a regular png image but it’s comprised of 64 squares that are 128 x 128 pixels each. The dimensions don’t have to be the same as mine but you’ll want the height and the width matching in order to make life easier on yourself.
In the inspector change the Texture Type for this into a Sprite (2D and UI) and then change the Sprite Mode from Single to Multiple. Now click on the sprite editor option and choose Slice from the top menu here, switch the type to Grid By Cell Size and enter in 128 x 128 for the pixels or to whatever you have for each unit.
Once you’re happy click on Apply and this will create individual sprites for each of the units that you’ve cut and will make them a child of your png image. Lastly in the inspector under the Sprite Mode section update the Pixels Per Unit option to 128 to match the tiles and then click on apply.
That’s your image now ready to be used in the Tile Palette, go ahead and drag it into there and save it into a Tiles folder called Ground so that you can find it easily. With that done you’re all set to play about with this, it’s as easy as clicking on the tile you want from your palette and then clicking anywhere in your scene to see it take form!