Series hướng dẫn dùng SDL cơ bản

Tut được viết lại theo trang lazyfoo…

Mình sẽ viết 1 serial các bài hướng dẫn dùng SDL 1 cách cơ bản nhất.

Học SDL 00 - Cài đặt SDL

Mình sẽ hướng dẫn cách Setup SDL trên Dev-C++

Tại sao lại là SDL và Dev-C++? Bởi vì nó nhẹ.

Bước 1: Tải Dev-C++SDL. Nhớ chọn bản SDL là Development Libraries và MinGW nhé. Tên nó sẽ có dạng này: SDL2-devel-2.0.4-mingw.tar.gz (MinGW 32/64-bit)

Bước 2: Giải nén cả 2 cái trên ra.

Bước 3: Sau khi giải nén cái SDL, đi vào bên trong sẽ có chứa 2 thư mục: i686-w64-mingw32 (dành cho bản 64 bit) và x86_64-w64-mingw32 (dành cho bản 32 bit). Chúng ta sẽ chỉ quan tâm tới 2 thư mục này, hãy xóa các cái khác đi. Tùy theo phiên bản Devcpp hay IDE của bạn mà bạn dùng 1 trong 2 thư mục trên. Hãy xóa thư mục còn lại, chúng ta chỉ để lại những gì cần thiết thì sẽ bớt rối trong các bước tiếp theo.

Bước 4: Từ giờ tôi sẽ đổi tên cái thư mục cuối cùng mà bạn chưa xóa thành “SDL” và cop nó vào ổ D:\ (hoặc 1 nơi nào bất kì, hãy nhớ địa chỉ của nó). Bên trong thư mục SDL, chúng ta sẽ quan tâm tiếp 3 thư mục: bin, include và lib (hãy xóa thứ còn lại đi :|). Hãy cop tất cả nội dụng ở D:\SDL\include\SDL2\ ra bên ngoài, tức là D:\SDL\include\ và xóa thư mục SDL2 đi. Thao tác vừa rồi chỉ để mọi thứ đẹp mắt hơn thôi.

Bước 5: Tạo 1 Project trống trong Devcpp. Vào Project Options (Ctrl+H)

Bước 6: Ở ô Linker trong tab Parameters của cửa sổ Project Options, điền: -lmingw32 -lSDL2main -lSDL2

Bước 7: Sang tab Directories, ở tab Library Directories, hãy thêm đường dẫn "D:\SDL\lib\"
Và ở tab bên cạnh, tức là Include Directories, hãy điền "D:\SDL\include\"
Lưu ý là các đường dẫn có thể khác tùy vào bước 4 của bạn.

Bước 8: Hãy copy file SDL2.dll ở thư mục bin vào nơi mà file .exe sẽ chạy, hoặc cop nó vào trong thư mục C:\WINDOWS\SYSTEM32 (nếu máy bạn là win 32 bit) C:\Windows\SysWOW64 (nếu máy bạn là win 64 bit)

Bước 9: Hãy sang bài tiếp theo và viết thử, và sẵn sàng comment lỗi của bạn ở bên dưới để sửa nhé :))

Và các bước trên có thể áp dụng được với cả codeblock !!!

Tiện đây có bạn nào biết theme nào cho wordpress mà nhẹ và tiện cho việc chia sẻ những bài viết nhiều text như này thì chia sẻ mình nhé, mình cám ơn.

6 Likes

blog mình

HỌC SDL 01 – CỬA SỔ ĐẦU TIÊN

Sau khi cài đặt, mình xin tiếp tục từ việc tạo cửa sổ đầu tiên.

Việc đầu tiên luôn là

#include<SDL.h>

Sau đó là hàm main của chúng ta

int main( int argc, char* args[]) {

hàm main được cho vào 2 tham số (gọi là argument). Một argument kiểu int tên argc và một argument là con trỏ về mảng kiểu char. SDL sẽ không thể chạy nếu không có 2 arguments này. Thực ra thì cũng không nên quan tâm tới nó sớm, bởi vì trong các bài học SDL tiếp theo mình sẽ không dùng tới nó.


Bây giờ đi tới việc khai báo 1 vài thành phần cơ bản của 1 cửa sổ SDL

SDL_Window* cuaSo = NULL; //khoi tao 1 cua so dau tien
SDL_Surface* matPhang = NULL; //theo sau do la 1 Surface

tạm thời chúng ta xong phần khai báo cơ bản nhất để có thể hiển thị 1 cửa sổ. Giờ dành 1 chút thời gian để mình giải thích nhẹ về Window và Surface. Hiểu đơn giản thì nó sẽ thế này: Window chỉ là phần khung bên ngoài của 1 chương trình, nếu chỉ có Window thì cái chương trình của chúng ta chỉ là 1 cái đường viền của hình chữ nhật. Trong trường hợp này, chúng ta sẽ sử dụng Surface để lấp đầy phần bên trong của hình chữ nhật đó.


Tiếp theo

SDL_Init( SDL_INIT_VIDEO )

tôi sẽ dành 1 đoạn văn ngắn để nói về cái này.

int SDL_Init( SDL_INIT_XXX )

phía trên là hàm dùng để khởi chạy 1 hệ thống con nào đó trong SDL. Ở đây chúng ta cần hiển thị các hình ảnh nên chúng ta sẽ khởi tạo nó. Ngoài ra chúng ta còn 1 vài hệ thống con khác. Tạm thời thì ta sẽ không quan tâm đến nó.


cuaSo = SDL_CreateWindow( "Yeah!!!", SDL_WINDOWPOS_UNDEFINED, SDL_WINDOWPOS_UNDEFINED, 600, 600, SDL_WINDOW_SHOWN );

SDL_CreateWindow là hàm để tạo ra 1 cửa sổ từ SDL_Window* mà chúng ta đã khai báo bên trên. Ở đây chúng ta có tới 6 arguments, argument đầu tiên sẽ là tên hiển thị của cửa sổ và được đặt vào trong dấu “”. Hai arguments tiếp theo là vị trí mà chúng ta mong muốn cửa sổ sẽ hiển thị. Nếu không rõ vị trí muốn hiển thị thì để như phía trên: SDL_WINDOWPOS_UNDEFINED. Hai arguments kế tiếp sẽ là kích cỡ của cửa sổ. Ở đây chúng ta sẽ tạo ra 1 cửa sổ 600x600. Còn argument cuối cùng, hiểu nôm na thì đó là thuộc tính của cửa sổ. SDL_WINDOW_SHOWN sẽ làm cho cửa sổ hiện ra khi nó được tạo.


Sau khi hoàn thành các công việc trên, bạn đã có thể tạo ra 1 cửa sổ rỗng.
Giờ chúng ta thử sơn nó bằng 1 màu bất kỳ

matPhang = SDL_GetWindowSurface(cuaSo);
SDL_FillRect( matPhang, NULL, SDL_MapRGB( matPhang-&gt;format, 0xFF, 0xFF, 0xFF ) );
SDL_UpdateWindowSurface( cuaSo );
SDL_Delay( 5000 );

Giải thích sơ qua về đoạn code trên nhé. Function đầu tiên được dùng là SDL_GetWindowSurface(), hiểu nôm na là nó sẽ chỉ định cửa sổ mà surface của chúng ta sẽ xuất hiện. Sau đó SDL_FillRect() sẽ to lên surface đó màu mà chúng ta chỉ định, các argument đi bên trong tạm thời mình sẽ bỏ qua. Tiếp theo, SDL_UpdateWindowSurface() được hiểu như tên của nó, update window surface. Còn function cuối cùng, SDL_Delay(5000) để chương trình đợi 5s trước khi thực hiện tiếp.


SDL_DestroyWindow(cuaSo);
SDL_Quit();
return 0;
}

Rồi, bài đầu tiên của chúng ta sẽ dừng ở việc hiển thị 1 cửa sổ. Và mình tin là 3 câu lệnh trên cũng rất đơn giản. SDL_DestroyWindow() là lệnh để đóng cửa sổ lại, SDL_Quit() để thoát khỏi hệ thống SDL, thực sự thì chính mình cũng ko hiểu rõ nó thoát cái gì =.= có lẽ là SDL_Init( SDL_INIT_VIDEO )
Còn return 0 thì mình ko biết nó là gì luôn…

Hẹn gặp lại ở post tiếp theo!!

5 Likes

Chào anh. Em làm theo hướng dẫn của anh và bị lỗi cannot find -lSDL.
Theo lý thuyết là do không cài đúng đường dẫn tới lib và include, cơ mà em đã làm theo đúng cách mà anh hướng dẫn.
Mong anh giải đáp. Cảm ơn anh.

2 Likes

lỗi này là sao

1 Like

mình cũng mắc phải lỗi này

post tiếp theo ở đâu rồi??!!

cái này sửa lỗi thì tải lại file sdl sau đó dẫn đường cho nó truy cập vào thư mục include của sdl sau đó cho nó dẫn vào sdl2 là được

1 Like

Cám ơn bác, sau 7 năm cuối cùng em cũng tìm ra lời giải, dự định cuối năm nay sẽ hoàn thành nốt project dang dở năm nào!

1 Like

ko có gì. thật ra cái sdl2 kia là nơi chứa thư viện đồ họa của sdl, bác cứ vào theo đường dẫn mà xem.Chúc bác thành công với dự án của mình nhé!

Bác đã hoàn thành chx??

cái này hình như là không tìm thấy sdl.h hay cái thư mục chứa sdl rồi, chắc tải lại rổi đừng
xóa sdl2 ở trong thư mục include

83% thành viên diễn đàn không hỏi bài tập, còn bạn thì sao?