SDL2で画像を表示する

前回はウィンドウ上に文字を表示する方法を調べた。
今回はウィンドウ上に画像を表示する方法を調べていこうと思う。

表示する画像の用意

今回表示に使う画像は以下である。

この画像は、KonaLinuxに標準で入っていたAzPainterを使用して作成した。
WEBで探した猫を真似してドット絵打ってみたけど下手くそなのはご愛嬌。これから頑張っていこうと思う。
AzPainterはLinuxでフリー使用できるペイントソフトで、私が使用している古いノートPC(どれくらい古いかは環境設定の項目参照)でもサクサク動く軽さが魅力的である。詳細は-> ここを確認されたし。
AzPainterを使用してドット絵を書くために調べたことは、後日別記事にまとめようと思う。
オリジナルを打てるように頑張っていきたい。
これを、表示するためにひとまずテストコードと同じ階層に置いておく。階層はこんな感じ

sdl2_test/
  |--sdl2_img.c
  |--cat.bmp

ちなみに、画像の背景色はRGB(255, 0, 255)になっている。
これは、SDL2の関数を用いて背景色を透過するためにドット絵に使用しない色を指定している。

画像の表示

#include <SDL2/SDL.h>
#include <SDL2/SDL_image.h>
#include <stdio.h>


const int SCREEN_WIDTH = 640;
const int SCREEN_HEIGHT = 480;

int main( int argc, char* args[] ) {
    SDL_Window* window = NULL;
    SDL_Renderer *renderer = NULL;
    SDL_Surface *image = NULL;
    SDL_Texture *image_texture = NULL;

    // 今回は使用していないがJPGとPNG形式の画像を読み込めるようにするには以下を設定する
    int flags=IMG_INIT_JPG|IMG_INIT_PNG;
    int initted=IMG_Init(flags);

    if(initted&flags != flags) {
        printf("IMG_Init: JPGとPNGの読み込みの初期化に失敗した!\n");
        printf("IMG_Init: %s\n", IMG_GetError());
    }

    //Initialize SDL
    if( SDL_Init( SDL_INIT_VIDEO ) < 0 ) {
        printf( "SDL could not initialize! SDL_Error: %s\n", SDL_GetError() );
    } else {
        //Create window
        window = SDL_CreateWindow( "DRAW IMAGE TEST", SDL_WINDOWPOS_UNDEFINED, SDL_WINDOWPOS_UNDEFINED, SCREEN_WIDTH, SCREEN_HEIGHT, SDL_WINDOW_SHOWN );
        if( window == NULL ) {
            printf( "Window could not be created! SDL_Error: %s\n", SDL_GetError() );
        } else {

            renderer = SDL_CreateRenderer(window, -1, SDL_RENDERER_ACCELERATED);

            // 画像の読み込み
            image = IMG_Load("cat.bmp");
            if(!image) {
                printf("IMG_Load: %s\n", IMG_GetError());
            }

            // 透過色の設定
            SDL_SetColorKey( image, SDL_TRUE, SDL_MapRGB(image->format, 255, 0, 255));

            image_texture = SDL_CreateTextureFromSurface(renderer, image);

            int iw,ih;
            SDL_QueryTexture(image_texture, NULL, NULL, &iw, &ih);
            SDL_Rect imageRect=(SDL_Rect){0,0,iw,ih};
            SDL_Rect drawRect=(SDL_Rect){300,220,iw,ih};

            SDL_SetRenderDrawColor(renderer, 200, 200, 200, 255);
            SDL_RenderClear(renderer);
            SDL_RenderCopy(renderer, image_texture, &imageRect, &drawRect);
            SDL_RenderPresent(renderer);

            SDL_Delay( 3000 );
        }
    }

    IMG_Quit();
    SDL_FreeSurface(image);
    SDL_DestroyTexture(image_texture);
    SDL_DestroyRenderer(renderer);
    SDL_DestroyWindow(window);

    SDL_Quit();

    return 0;
}

新規に使用した関数は以下。メモっておく。
-> IMG_Init
-> IMG_Load
-> SDL_SetColorKey
-> SDL_SetRenderDrawColor
-> IMG_Quit

コンパイル

gcc -g -o sdl2_img sdl2_img.c `sdl2-config --cflags --libs` -lSDL2_image

このような形でコンパイルを行う。前回、文字を表示した時は-lSDL2_ttfを追加したが、画像の場合は-lSDL2_imageを追加する必要がある。

実行結果

./sdl2_imgで実行する。

無事に画像を背景色透過で表示させることができた。

終わりに

文字、画像、と来たので次回は音を鳴らす方法を調べようと思う。今回はこれで以上！