C/C++

Draw Text Trong SDL

Giới thiệu

Việc xuất hiện những dòng thông báo, hướng dẫn trong game là khá quan trọng. Giúp cho người dùng có thể hiểu và tiếp cận với game của chúng ta một cách nhanh chóng và dễ dàng nhất. Vậy những dòng text đó được vẽ lên màn hình như thế nào, thì bài viết này tôi sẽ hướng dẫn các bạn vẽ những dòng text đó sử dụng một thư viện mở rộng của SDL có tên là SDL_ttf (TrueType  Font).

Tiền đề bài viết

Tiếp nối những bài viết hướng dẫn lập trình với framework SDL (Simple DirectMedia Layer).

Đối tượng hướng đến

Những lập trình viên đã có kiến thức vững chắc về ngôn ngữ lập trình C++, mong muốn xây dựng game cơ bản sử dụng framework SDL.

Cài đặt thư viện

Đầu tiên các bạn vào trang https://www.libsdl.org/projects/SDL_ttf/. Tại mục Development Libraries download file SDL2_ttf-devel-2.0.12-VC.zip (vì ở đây tôi đang sử dụng nền tảng Windows).

sdl_text_ss_01

Sau khi download xong và giải nén ra ta được hai thư mục là include lib. Việc tính hợp thư việnSDL_ttf vào project trong Visual Studio hoàn toàn tương tự như đối với thư viện SDL_mixer. Các bạn có thể xem phần Cài đặt thư viện SDL_mixer ở bài viết Play Audio Trong SDL.

Chúng ta cần phải thêm chỉ thị #include <SDL_tff.h> vào đầu mỗi file muốn sử dụng thư viện này:

Draw Text lên màn hình

Trước khi bắt đầu thao tác với các hàm trong bộ thư viện chúng ta phải khởi tạo bằng cách sử dụng hàm TTF_Init(). Hàm trả về 1 nếu khởi tạo thành công và ngược lại trả về 0 nếu khởi tạo thất bại.

Tương tự sau khi thoát khỏi chương trình thì cần giải phóng tài nguyên:

Giống như vẽ một hình ảnh lên màn hình ở bài viết Load Texture Trong SDL thì việc vẽ một đoạn text lên màn hình hoàn toàn tương tự:

SDL_ttf có định nghĩa sẵn một struct có tên là TTF_Font giúp ta quản lý các thông tin liên quan đến font chữ để có thể vẽ lên màn hình. Và đi kèm với struct này thì có một hàm load prototype như sau:

Với hai đối số truyền vào là tên của font chữ có đuôi mở rộng là .ttf và fontsize.

Bài viết này tôi sẽ sử dụng font chữ VeraMoBd.ttf, với fontsize 30.

Tiếp theo chúng ta tạo đối tượng surface và texture từ đối tượng font này:

Ở trên ta dùng hàm TTF_RenderText_Solid với các đối số truyền vào là đối tượng font, chuỗi ta muốn hiển thị và màu sắc mà ta muốn vẽ. SDL_ttf có 3 chế độ để tạo đối tượng surface như sau:

Solid 

TTF_RenderText_Solid Draw LATIN1 text in solid mode
TTF_RenderUTF8_Solid Draw UTF8 text in solid mode
TTF_RenderUNICODE_Solid Draw UNICODE text in solid mode
TTF_RenderGlyph_Solid Draw a UNICODE glyph in solid mode

Shaded

TTF_RenderText_Shaded Draw LATIN1 text in shaded mode
TTF_RenderUTF8_Shaded Draw UTF8 text in shaded mode
TTF_RenderUNICODE_Shaded Draw UNICODE text in shaded mode
TTF_RenderGlyph_Shaded Draw a UNICODE glyph in shaded mode

Blended 

TTF_RenderText_Blended Draw LATIN1 text in blended mode
TTF_RenderUTF8_Blended Draw UTF8 text in blended mode
TTF_RenderUNICODE_Blended Draw UNICODE text in blended mode
TTF_RenderGlyph_Blended Draw a UNICODE glyph in blended mode

Các bạn có thể thử từng hàm để xem sự khác biệt của nó.

Tiếp theo ta tạo đối tượng texture và hủy surface.

Sử dụng SDL_Rect để xác định tọa độ ta muốn vẽ trên màn hình:

Cuối cùng draw và update

Source code demo

Thử chạy chương trình với mã nguồn trên thì cúng ta sẽ thấy một đoạn text được vẽ lên màn hình.

Tham khảo

https://www.libsdl.org/projects/SDL_ttf/ – 06/08/2015

http://www.libsdl.org/projects/docs/SDL_ttf/SDL_ttf_35.html – 06/08/2015

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.