Game CutTree
Sử dụng sách Beginning C++ Game Programming, quyển này ưu điểm là dành cho C++ very beginner và sử dụng SFML để làm game. SFML là library nên gần như các code đều rất gần với C++ nguyên bản chứ không như các Game Engine khác (Như Unreal Engine hay Esenthel).
1 SFML Game development¶
Tôi chuyển qua sách https://github.com/SFML/SFML-Game-Development-Book để hiểu rõ hơn về cấu trúc và cách làm game, vì sách Beginning C++ programming không thật sự tối ưu với các code. Có lẽ tác giả không phải C++ kinh nghiệm? Nhiều đoạn code rất khó hiểu.
Sách này sẽ hướng dẫn làm dạng game Shoot-em-up, điều khiển aircraft.
Để tạo 1 game bằng SFML trước tiên tạo 1 dàn bài cho game, bao gồm các thành phần như sau
2 Game CutTree¶
2.1 Dàn ý của SFML¶
#include <iostream>
#include <SFML/Graphics.hpp>
using namespace sf;
int main()
{
// Create video mode "object" from SFML
sf::VideoMode vm(1920, 1080);// Nếu đã dùng namespace sf thì chỉ cần viết sf::VideoMode vm(1920, 1080);
// Render Window game
sf::RenderWindow window(vm, "CutTree Game",sf::Style::Fullscreen);
while (window.isOpen()) // Khi màn hình Window Game còn mở thì thực hiện các lệnh dưới đây
{
//Player keyboard input
//Update scene
//Draw scene
//Clear everything from last scene
//Show everything we just draw
}
return 0;
}
2.2 Chuẩn bị assets, spites¶
2.2.1 Tạo Sprite tĩnh như background¶
Sau khi Tạo Video Mode cho game thì cần phải có các asset và vật thể của game, gọi là sprite
// Tạo object Texture cho background của Game
Texture textureBackground;
// Load ảnh từ computer lên object Texture
textureBackground.loadFromFile("graphics/background.png");
// Tạo object là Sprite, được gọi là vật thể, có thể là nhân vật, có khả năng di chuyển. Texture chỉ là vỏ bề ngoài của các Sprite này
Sprite spriteBackground;
// Attach texture to sprite
spriteBackground.setTexture(textureBackground); //Bây giờ thì vật thể spriteBackground đã được mặc một bộ quần áo là textureBackground
// Set position for spriteBackground
spriteBackground.setPosition(0, 0);
Trong SFML thì hệ toạ độ như sau:
Tức là spriteBackground được đặt tại toạ độ gốc. Nếu background này có độ phân giải là 1920x1080 thì sẽ full màn hình, vì VideoMode đã được set là 1920x1080
Để hiển thị Sprite ra màn hình thì cần dùng lệnh Draw
//Draw spritebackground vào window
window.draw(spriteBackground);
//Show everything we just draw
window.display();
Kết quả được như sau
2.2.2 Tạo sprite có animation¶
Bây giờ sẽ tạo 1 sprite là Bee có khả năng di chuyển (animation)
Texture textureBee;
textureBee.loadFromFile("graphics/bee.png");
Sprite spriteBee;
spriteBee.setTexture(textureBee);
spriteBee.setPosition(0, 800); // sẽ đi từ bên trái màn hình x= 0, từ phía dưới y = 800 (max là 1080)
// variable khai báo Bee có active hay không
bool beeActive = false;
// Speed of Bee
float beeSpeed = 0.0f;
Để tính toán speed của Bee thì cần dựa vào chiều dài của màn hình, tức là 1920px.
1 sprite Bee có kích thước vd là 100px. Bây giờ đã có quảng đường, để có speed cần phải có thể thời gian.
SFML có function là Clock. Khai báo biến này trước. Và Time cần phải được update liên tục khi Window Open
Để các vòng lặp có random speed khác nhau thì cần sử dụng seed random (srand)
// Set up Bee.
if (!beeActive)//!beeActive==true, tức là nếu Bee đứng im (active=False) thì thực hiện các lệnh sau
{//Nếu active=fasle thì reset vị trí của Bee
//Random Speed của Bee
srand((int)time(0)); // srand là set seed for rand(), time(0) là current time.
// Nếu không dùng seed rand thì kết quả rand() sẽ giống như nhau trong các vòng lặp
beeSpeed = (rand() % 200 + 200); // Speed sẽ là 0--> 199 + 200px trên mỗi giây, là 200 - 399
// Set Position của Bee sau mỗi Frame
srand((int)time(0) * 10);
float height = (rand() % 1350) + 500;
spriteBee.setPosition(1880, height); // set Bee ở bên phải màn hình
beeActive = true;
}else //Move the bee
{
spriteBee.setPosition(
spriteBee.getPosition().x - beeSpeed * dt.asSeconds(), // vị trí x sẽ được - speed * time. Đi từ phải qua trái
spriteBee.getPosition().y);// vị trí của y sẽ không đổi
//Nếu đi hết màn hình
if (spriteBee.getPosition().x < 0) beeActive = false; // Cho Bee về lại vị trí ban đầu
}
2.3 Tạo GUI control¶
Tạo New Game, Pause, Exit cho Game
2.3.1 Add text, font¶
Cần phải khai báo các library khác để hiển thị text ra màn hình chứ không ra terminal nữa
// Add font Text
Font font;
font.loadFromFile("fonts/KOMIKAP_.ttf");
Text messageText;
Text scoreText;
messageText.setFont(font); // Choose font for this text
scoreText.setFont(font);
// Assign the actual message
messageText.setString("Press Enter to start!");
scoreText.setString("Score = 0");
messageText.setCharacterSize(75);
scoreText.setCharacterSize(75);
// Set position of Text
messageText.setPosition(1920 / 2.0f, 1080 / 2.0f);
scoreText.setPosition(20, 20);
Game này tạm thời OK rồi. Bây giờ sẽ nhảy qua làm Game dạng Top-down. Mình skip qua Game Pong vì thấy hơi chán. Nhưng cũng bỏ qua học OOP, hy vọng ko ảnh hưởng quá lớn.
Backlinks¶
The following pages link to this page:
Created : Mar 15, 2022
Recent Posts
- 2024-11-02: BUỔI 10 - Phân tích thị trường
- 2024-11-02: BUỔI 11 - Phân tích thị trường
- 2024-11-02: BUỔI 12 - Phân tích sóng tăng
- 2024-11-02: BUỔI 13 - Phân tích hỏi đáp
- 2024-11-02: BUỔI 14 - Yếu tố kiểm soát
- 2024-11-02: BUỔI 15 - Hỏi đáp
- 2024-11-01: BUỔI 6 - Ôn lại và bổ sung
- 2024-11-01: BUỔI 7 - Chiến thuật Trend
- 2024-11-01: BUỔI 8 - Công thức điểm vào lệnh
- 2024-11-01: K2023 - BUỔI 9 - Quy trình vào lệnh