Tạo Tilemap Trong Cocos2d-x 3.x.x

Tilemap là gì?

Đây là một Tilemap 20x15.

Tilemap được tạo từ nhiều tile. Tile là một cụm chứa những hình ảnh dùng để tạo nên tilemap được gọi là tileset. Cũng có thể hiểu tileset là một sprite trong một sprite sheet.

Ưu điểm

Việc sử dụng tileset để vẽ một map làm cho kích thước của tập tin giảm, dễ nâng cấp và sửa chữa. Công việc thiết kế map là một công việc tốn thời gian nhưng nhờ nó có thể tiết kiệm công sức và dễ dàng trong việc thiết kế.

Các thành phần trong một tilemap

• Orientation: Có hai loại Tilemap là isometric và orthogonal.
• Map size: Số lượng tile trong map.
• Tile size: Kích thước của một tileset.
• ID tileset/ GID: Đây là vị trí của của tileset trong sprite sheet duy nhất. Được tính từ trái qua phải từ trên xuống dưới. Đối với mỗi tile, cần phải có cách nào đó để liên kết nó với một tileset và một địa điểm cụ thể về tileset đó.
• Tọa độ map.

Thiết kế và sử dụng

Quá trình thiết kế và sử dụng tile để tạo maps được hoạt động theo các bước sau.

1. Chọn kích thước maps và kích thước của tile.
2. Thêm tilesets từ sprite sheet.
3. Đặt tilesets lên map.
4. Thêm một số đối tượng bổ sung cho một cái gì đó khác.
5. Lưu map thành một file format TMX.
6. Dùng các file format TMX này trong game.

Tạo map với ứng dụng Tiled

Làm sao để có thể tạo ra một tilemap? Hiện nay có nhiều công cụ có thể làm được điều này. Tiled là một công cụ phổ biến, có được tích cự phát triển và có một cộng đồng người dùng lớn. Cocos2d-x hỗ trợ map được tạo từ Tiled Map Editor và lưu ở định dạng TMX.

Download tại https://www.mapeditor.org/. Cài đặt như các phần mềm thông thường khác.

Sau khi chạy chạy Tiled, chọn File->New và thiết lập các giá trị của Map.

Tiếp đến cần thêm tileset để vẽ map. Chọn trên Map ở thanh Menu, sau đó chọn New Tileset.

Sau khi thiết lập xong cho Titleset chọn OK sẽ được màn hình như ở dưới.

Dưới đây là sản phẩm sau khi thiết kế.

Sau khi thiết kế xong Map. Chọn save

Ở đây sẽ được một file format .tmx.

Chú ý:

• Trong Resources của dự án. Lưu cả file format và file sprite sheet chứa các titelset để có thể sử dụng trong Cocos2d-x.
• Map được tạo bởi nhiều Tile Layer, tùy vào logic game mà sử dụng những Tile Layer sao cho hợp lý. Ví dụ trên đây chỉ dùng 1 Tile Layer. Cũng có thể dùng nhiều Tile Layer để tạo một Map nhìn tương đương.

Khởi tạo một TMX Map

// reading in a tiled map.
 auto map = TMXTiledMap::create("TileMap.tmx"); 
​addChild(map, 0, 99); // with a tag of '99'

Get-Add-Delete-Modify một Title

Để lấy được một Tile (Sprite) trong Map.

// www.stdio.vn
// Get title.
auto layer = map->layerNamed("Tile Layer 1");
auto tile = layer->tileAt(Vec2(1.0f, 1.0f));

Lấy một GID trong Map tại tọa độ (1,1).

// Get GID.
unsigned int gid = layer->tileGIDAt(Vec2(1.0f, 1.0f));

Xóa một tile trong Map tại tọa độ (5,5).

// Xóa một tile
layer->removeTileAt(Vec2(5.0f, 5.0f));

Thay một tile trong Map bằng một GID mới bằng 1 tại tọa độ (1,1).

layer->setTileGID(1, Vec2(1.0f, 1.0f));

Vòng lặp của một layer.

// www.stdio.vn
Size s = layer->getLayerSize();
for (int x = 0; x < s.width; ++x)
{
    // logic game
    for (int y = 0; y < s.height; ++y)
    {
        // logic game
    }
}

Tham khảo

https://www.cocos2d-x.org