Membuat Pola Papan Catur dengan SDL_FillRect ~ Pemrograman dan Teknologi

Untuk membuat pola papan catur, kalian bisa menggunakan SDL_FillRect. SDL_FillRect bisa digunakan untuk mengubah seluruh permukaan window jika parameter keduanya adalah 0 atau NULL. Jika kalian ingin menggunakan SDL_FillRect untuk mengubah sebagian warna window, kalian bisa menggunakan variabel dengan tipe SDL_Rect pada parameter kedua dari SDL_FillRect.

SDL_Rect memiliki 4 anggota yang bisa kalian gunakan untuk menentukan ukuran dan letak dari area yang akan diwarnai atau digambar. Anggota dari SDL_Rect, yaitu :

x => Posisi koordinat x
y => Posisi koordinat y
w => Lebar area
h => Tinggi area

Koordinat dari SDL dimulai dari titik kanan atas. Semakin turun posisinya, maka nilai y akan semakin bertambah. Berbeda dengan arah koordinat y yang arahnya dari atas ke bawah, arah koordinat y adalah dari kiri ke kanan.

Contoh kode program yang menggunakan SDL_FillRect bisa kalian lihat dibawah ini.

#include <SDL2/SDL.h>

int main( int argc, char* args[] ){
    int x, y;
    SDL_Window* window = NULL;
    SDL_Surface* screenSurface = NULL;
    SDL_Rect rct;

    rct.x=0;
    rct.y=0;
    rct.w=40;
    rct.h=40;

    if( SDL_Init( SDL_INIT_VIDEO ) < 0 ){
        printf( "Error: %s\n", SDL_GetError() );
    }else{
        window = SDL_CreateWindow( "SDL", SDL_WINDOWPOS_UNDEFINED, SDL_WINDOWPOS_UNDEFINED, 640, 480, SDL_WINDOW_SHOWN );
        if( window == NULL ){
            printf( "Error : %s", SDL_GetError() );
        }else{
            screenSurface = SDL_GetWindowSurface( window );
            SDL_FillRect( screenSurface, NULL, SDL_MapRGB( screenSurface->format, 0x00, 0x00, 0xFF ) );
            for(y=0;y<8;y++){
                rct.x=0;
                for(x=0;x<8;x++){
                    if((x+y)%2!=0)SDL_FillRect( screenSurface, &rct, SDL_MapRGB( screenSurface->format, 0x00, 0x00, 0x00 ) );
                    else SDL_FillRect( screenSurface, &rct, SDL_MapRGB( screenSurface->format, 0xFF, 0xFF, 0xFF ) );
                    rct.x+=40;
                }
                rct.y+=40;
            }
            SDL_UpdateWindowSurface( window );
            SDL_Delay( 2000 );
        }
    }

    SDL_DestroyWindow( window );
    SDL_Quit();

    return 0;
}

Dalam kode program ini kita menggunakan 3 tipe data. Tipe data tersebut adalah SDL_Window, SDL_Surface, dan SDL_Rect. Variabel dengan tipe data SDL_Window* digunakan untuk menyimpan "window" yang didapat dari function SDL_CreateWindow. Setelah itu, kalian bisa menyimpan "permukaan windows" yang didapat dari function SDL_GetWindowSurface dengan variabel bertipe SDL_Surface*.

SDL_FillRect pertama dalam kode program di atas menggunakan NULL sebagai argumen pada parameter keduanya, karena itu seluruh permukaan window menjadi berwarna biru (00, 00, FF) sesuai parameter dalam SDL_MapRGB.

Karena kita mau menggambar petak catur, maka kita harus menggunakan for atau loop. Kita bisa meletakkan dua SDL_FillRect dengan warna yang berbeda di dalam loop. Warna petak ditentukan dengan menggunakan if sesuai dengan total nilai x dan y. Jika totalnya ganjil, maka warnanya adalah hitam(00, 00, 00). Jika totalnya genap, maka warnanya adalah putih (FF, FF, FF).

Selain mengubah warna, kita juga mengubah koordinat x dan y yang tersimpan dalam variabel rct. Sebelum kita menggunakan variabel rct dalam loop, kita perlu menentukan nilai awal koordinat x dan y dalam rct. Pada kode program di atas, kita menggunakan petak ukuran 40x40.

Untuk yang malas mengetik, kalian bisa mendownload kode programnya di sini.