• Home
  • News
  • Software
  • Knowledge
  • MMO
  • Tips
  • Security
  • Network
  • Office
AnonyViet - English Version
  • Home
  • News
  • Software
  • Knowledge
  • MMO
  • Tips
  • Security
  • Network
  • Office
No Result
View All Result
  • Home
  • News
  • Software
  • Knowledge
  • MMO
  • Tips
  • Security
  • Network
  • Office
No Result
View All Result
AnonyViet - English Version
No Result
View All Result

[Lập trình Game] Lesson 3: Tilemap and Tileset to create Map Game

AnonyViet by AnonyViet
February 3, 2023
in Tips
0

Next in the series Game programming with Godot I will teach you about tilemap and tileset and use it instead of moving surface. So what are Tilemaps and Tilesets?

Join the channel Telegram of the AnonyViet 👉 Link 👈
  • Tilemap: tilemap is a grid of brick used to create the map (map) for the game. Or in general Tilemap used for design level yours or can be understood as design sense your house, traps, clouds…
  • Tilesets: is the library of tilemap. If you don’t understand, you can understand as follows. Tileset is the power supply brick for tilemap your.

Create game maps with Tilemap and Tileset

Here is a picture of tilemap & tileset:

[Lập trình Game]  Lesson 3: Tilemap and Tileset to create Map Game 45 [Lập trình Game]  Lesson 3: Tilemap and Tileset to create Map Game 46 [Lập trình Game]  Lesson 3: Tilemap and Tileset to create Map Game 47

You can download assets that Anonyviet has provided here, you can either use the self-created version or download it online.

Download Link

(Backup)

How to create Tilemaps and Tilesets

First you download the asset and put it in the folder where the project is saved:

[Lập trình Game]  Lesson 3: Tilemap and Tileset to create Map Game 48

Then you create yourself a new sense by clicking plus next to tab World

[Lập trình Game]  Lesson 3: Tilemap and Tileset to create Map Game 49

And make yourself one node, 2D or Black Node All is fine, can’t use User or 3D. Oh and don’t save it

Open section tileset out and toss it in sense.

[Lập trình Game]  Lesson 3: Tilemap and Tileset to create a 50 . Map Game [Lập trình Game]  Lesson 3: Tilemap and Tileset to create Map Game 51

Zoom up if you see a blurry image, do the following:

Click import tab next to sense

[Lập trình Game]  Lesson 3: Tilemap and Tileset to create Map Game 52

Select 2D pixels then press Reimport it’s done

[Lập trình Game]  Lesson 3: Tilemap and Tileset to create Map Game 53

Next, click on sence in the left corner of the screen, down to the section Convert to and choose tileset:

[Lập trình Game]  Lesson 3: Tilemap and Tileset to create Map Game 54

You can save it for yourself anywhere but remember to name it .tres behind you

[Lập trình Game]  Lesson 3: Tilemap and Tileset to create Map Game 55

Close the sense you just finished.

LIVE World create Node new name is Tilemap

[Lập trình Game]  Lesson 3: Tilemap and Tileset to create Map Game 56

[Lập trình Game]  Lesson 3: Tilemap and Tileset to create Map Game 57

Then drag the part Tile sets just finished go to the right place of Tilemap (as shown below)

[Lập trình Game]  Lesson 3: Tilemap and Tileset to create Map Game 58

And okay

[Lập trình Game]  Lesson 3: Tilemap and Tileset to create Map Game 59

Next, click on Tile sets [Lập trình Game]  Lesson 3: Tilemap and Tileset to create Map Game 60

Click on the red circle, the new place tileset in there.

Then select the one with the picture by clicking on it

[Lập trình Game]  Lesson 3: Tilemap and Tileset to create Map Game 61

And you will see 1 tileset right in front of you

[Lập trình Game]  Lesson 3: Tilemap and Tileset to create Map Game 62

And the pixel it is is 32 so it’s a bit big now I will adjust it down to 16×16 by the following way:

Click on the yellow box in general, inside the yellow box, click when it appears tileseteditor tab is to be.

[Lập trình Game]  Lesson 3: Tilemap and Tileset to create Map Game 63

Look to the right, Adjust Step x 32, y 32 > x 16, y 16

[Lập trình Game]  Lesson 3: Tilemap and Tileset to create Map Game 64

And you can see that the tileset fits the tile very well

[Lập trình Game]  Lesson 3: Tilemap and Tileset to create Map Game 65

You click New Atlas and zoning like the photo

[Lập trình Game]  Lesson 3: Tilemap and Tileset to create Map Game 66

[Lập trình Game]  Lesson 3: Tilemap and Tileset to create Map Game 67

That is used to create a group of tileset

And we continue to create until we run out, after zoning, press New Altas to make a new one.

And I’m done:

[Lập trình Game]  Lesson 3: Tilemap and Tileset to create Map Game 68

Click Tilemap

[Lập trình Game]  Lesson 3: Tilemap and Tileset to create Map Game 69

Notice it shows up tile set that we just circled

[Lập trình Game]  Lesson 3: Tilemap and Tileset to create Map Game 70

But you can see some that don’t have pictures.

Complete Tilemap Design

To change the image, do the following:

Go back to the old part choose 1 Atlas

[Lập trình Game]  Lesson 3: Tilemap and Tileset to create Map Game 71

Select item Icon

[Lập trình Game]  Lesson 3: Tilemap and Tileset to create Map Game 72

And click any in that frame, it can be used to classify tileset

However, when done, but your tileset is still not available Collsion So now you have to create it.

Select Collsion

[Lập trình Game]  Lesson 3: Tilemap and Tileset to create Map Game 73

Select a box and then press the blue square above, near the trash can and next to the arrow

Okay like this

[Lập trình Game]  Lesson 3: Tilemap and Tileset to create Map Game 74

Then click on another box

[Lập trình Game]  Lesson 3: Tilemap and Tileset to create Map Game 75

And keep doing it until it’s done

For the squares that have a cross-section, do the following:

Select the one next to the square

[Lập trình Game]  Lesson 3: Tilemap and Tileset to create Map Game 76

Click to select 2 corners as shown, if you try to click in another direction to round like the picture, it won’t work

[Lập trình Game]  Lesson 3: Tilemap and Tileset to create Map Game 77

To round, do the following:

Turn off the one like the picture

[Lập trình Game]  Lesson 3: Tilemap and Tileset to create Map Game 78

And do

[Lập trình Game]  Lesson 3: Tilemap and Tileset to create Map Game 79

Please click to connect the points

Let’s finish it now

I’m done:

[Lập trình Game]  Lesson 3: Tilemap and Tileset to create Map Game 80

Now the next thing is level design

Press tile map to come back

Remove Node wall Go

[Lập trình Game]  Lesson 3: Tilemap and Tileset to create Map Game 81

Correction pixels become 16

When you try to place tilesets down will see it inverse ratio with sense right

[Lập trình Game]  Lesson 3: Tilemap and Tileset to create Map Game 82

So how to fix the solution just resize the tileset by clicking O Cell on the right tab

[Lập trình Game]  Lesson 3: Tilemap and Tileset to create Map Game 83

Change 64×64 wall 16×16 = with the size we created.

[Lập trình Game]  Lesson 3: Tilemap and Tileset to create Map Game 84

Your next task is to design it:

[Lập trình Game]  Lesson 3: Tilemap and Tileset to create Map Game 85

Looks good not too bad

[Lập trình Game]  Lesson 3: Tilemap and Tileset to create Map Game 86

That’s it, creating the map in the game with tilemap and tileset. In the next episode, I will guide you to create characters ^^. Bye

DeathGM!

The article achieved: 5/5 – (100 votes)

Tags: createGamelậpLessonMapTilemapTilesettrình
Previous Post

Use Zaza Remote to control infrared devices with your phone

Next Post

Download Bot to create EDU mail automatically in bulk, save information automatically

AnonyViet

AnonyViet

Related Posts

How to view web access history in the anonymous mode (Incognito) of Chrome
Tips

How to view web access history in the anonymous mode (Incognito) of Chrome

August 22, 2025
How to graft the peach branch based on electric poles, family cycling, uncle
Tips

How to graft the peach branch based on electric poles, family cycling, uncle

August 21, 2025
Unlock checkpoint 72h often have photos already but hang nick
Tips

Unlock checkpoint 72h often have photos already but hang nick

August 19, 2025
GIF image creation tips with high quality snipping tool
Tips

GIF image creation tips with high quality snipping tool

August 19, 2025
How to unlock Facebook to download your latest photos
Tips

How to unlock Facebook to download your latest photos

August 18, 2025
Instructions on how to format text on the Windows 11 notepad
Tips

Instructions on how to format text on the Windows 11 notepad

August 16, 2025
Next Post
Download Bot to create EDU mail automatically in bulk, save information automatically

Download Bot to create EDU mail automatically in bulk, save information automatically

0 0 votes
Article Rating
Subscribe
Login
Notify of
guest

guest

0 Comments
Oldest
Newest Most Voted
Inline Feedbacks
View all comments

Recent News

Đá Gà Online Sonclub Đỉnh Cao Giải Trí 2025

August 22, 2025
How to view web access history in the anonymous mode (Incognito) of Chrome

How to view web access history in the anonymous mode (Incognito) of Chrome

August 22, 2025
How to automatically erase the web history after escaping to absolutely secure

How to automatically erase the web history after escaping to absolutely secure

August 22, 2025
Stainless steel flange price list at Asia Industry

Stainless steel flange price list at Asia Industry

August 21, 2025

Đá Gà Online Sonclub Đỉnh Cao Giải Trí 2025

August 22, 2025
How to view web access history in the anonymous mode (Incognito) of Chrome

How to view web access history in the anonymous mode (Incognito) of Chrome

August 22, 2025
How to automatically erase the web history after escaping to absolutely secure

How to automatically erase the web history after escaping to absolutely secure

August 22, 2025
AnonyViet - English Version

AnonyViet

AnonyViet is a website share knowledge that you have never learned in school!

We are ready to welcome your comments, as well as your articles sent to AnonyViet.

Follow Us

Contact:

Email: anonyviet.com[@]gmail.com

Main Website: https://anonyviet.com

Recent News

Đá Gà Online Sonclub Đỉnh Cao Giải Trí 2025

August 22, 2025
How to view web access history in the anonymous mode (Incognito) of Chrome

How to view web access history in the anonymous mode (Incognito) of Chrome

August 22, 2025
  • Home
  • Home 2
  • Home 3
  • Home 4
  • Home 5
  • Home 6
  • Next Dest Page
  • Sample Page

©2024 AnonyVietFor Knowledge kqxs hôm nay xem phim miễn phí mm88 8XBET mm88 trang chủ new88

No Result
View All Result
  • Home
  • News
  • Software
  • Knowledge
  • MMO
  • Tips
  • Security
  • Network
  • Office

©2024 AnonyVietFor Knowledge kqxs hôm nay xem phim miễn phí mm88 8XBET mm88 trang chủ new88

wpDiscuz
0
0
Would love your thoughts, please comment.x
()
x
| Reply