본문 바로가기

Study/Engine

[SDL Tutorial] Lesson 3 - SDL의 확장 라이브러리와 다른 이미지 포멧 불러오기

사용자 삽입 이미지


 어느덧 세번째 강의를 하게되었군요. 사실 시작하면서 제풀에 못이겨서 한두개하다 끝날 것 같았는데 쓰는 것에 대해 의욕이 생기고 보람도 생기는 등등의 감정이 작용한 것 같네요. 원래 지금 쓰는 것 자체가 의도치는 않았지만, 잠에 다시 들기 위해서(?) 뇌를 움직여볼까 합니다. 오늘 써내려 갈 강의 내용은 SDL의 확장 라이브러리와 다른 이미지 포멧을 불러오는 것을 다뤄볼까 합니다. 강의에 앞서, 이전 강의들을 보시지 않고 오신 분들은 아래의 링크를 들어가주시면 감사할 듯 합니다 ^^

[SDL Tutorial] Lesson 1 - SDL 설치 및 설정과 화면에 그림 띄우기

[SDL Tutorial] Lesson 2 - 이미지의 로드와 화면 출력 최적화


 자, 시작해볼까요?



3 - 1 : SDL_image - SDL의 이미지 확장 라이브러리 - 그리고 기타 확장 라이브러리 설치

사용자 삽입 이미지

PNG파일을 로딩한 예제 화면입니다.



 SDL은 기본적으로 BMP 포멧만을 지원합니다. 게임 개발에 있어서 BMP만 지원하다는 것은 상당히 치명적인 일이 아닐 수 없습니다. 물론 용도에 따라서 그리 상관없을수도 있지만 말이죠. 그래서 만들어진 것이바로 SDL_image라는 확장 라이브러리입니다. 지원되는 포멧으로는 BMP, PNM, XPM, LBM, PCX, GIF, JPEG, TGA, PNG 등이 있습니다. 강의를 처음부터 보셨다면, 이미 여러분의 컴퓨터엔 SDL_image 및 기타 확장 라이브러리가 설치되어 있을 것입니다(첫번째 강의 링크). 혹시나 검색을 통해서 이 강의를 보셨거나, 중간을 생략하시고 오신 분들을 위해서 다시한번 써보도록 하겠습니다.

 SDL_image만 설치하고 싶으시면 콘솔창에 아래와 같이 쳐주시면 됩니다.

$ sudo apt-get install libsdl-image1.2-dev


 또는 시냅틱 패키지 관리자에서 libsdl-image1.2-dev를 검색하시어 설치해주셔도 됩니다.

사용자 삽입 이미지


 만약, SDL_ttf를 설치하고자 하시면 위의 명령문에 아래와 같이 추가하시거나 시냅틱 패키지 관리자에서 검색하여 설치하시면 됩니다.

libsdl-ttf2.0-dev


 또, SDL_mixer를 설치하고 싶으시면 위의 명령문에 아래와 같이 추가하시거나 시냅틱 패키지 관리자에서 검색하여 설치하시면 됩니다.

libsdl-mixer1.2-dev


 여기까지 하시면 image, ttf(글씨), mixer(오디오) 확장 라이브러리가 컴퓨터에 설치됩니다.



3 - 2 : Eclipse에 적용하기

 이곳부터는 첫번째 강의 때 해드렸던 내용(1 - 2 : Eclipse에서의 SDL 설정)대로 하시면 됩니다. 라이브러리를 전부다 추가하실 필요는 없고, 자신이 현재 프로젝트에서 쓰는 라이브러리만 추가해주셔도 됩니다. 하지만, SDL(-lSDL)은 꼭 필요하니 프로젝트를 설정하실 때 빠뜨리지 않도록 유의하시기 바랍니다.

 그리고, SDL_image 라이브러리를 사용할 땐, 소스코드에 아래와 같은 헤더를 추가시켜주어야 합니다.

#include "SDL/SDL_image.h"


 SDL_ttf나 SDL_mixer같은 경우엔

#include "SDL/SDL_ttf.h"
#include "SDL/SDL_mixer.h"


라고 추가해주시면 됩니다.



3 - 3 : SDL_image를 적용한 예제 실행하기

 이 포스트 하단에 있는 이번 강의 소스를 보셔도 좋지만, 학습 차원에서 따라 쳐보는 것도 괜찮은 방법 중 하나입니다. 그런고로, 이전 강의에 쓰였던 소스를 불러와서 추가해보도록 합시다. [Lesson2 소스코드 다운로드]
 이번에도 추가되는 코드는 빨강색으로 표시하겠습니다.

#include "SDL/SDL.h"
#include "SDL/SDL_image.h"
#include <string>


 3 - 2에서 설명한 부분이 바로 나오는군요. 우리는 이번 예제에 SDL_image를 쓸 것이기 때문에 헤더를 추가해주었습니다. 아마 이제부터 하는 모든 강의엔 SDL.h와 SDL_image.h는 항상 들어가있을 것입니다.

SDL_Surface *load_image( std::string filename )
{
    // 불러온 이미지를 임시로 담아줄 변수
    SDL_Surface* loadedImage = NULL;
    // 최적화된 이미지를 저장하는 변수
    SDL_Surface* optimizedImage = NULL;

    // 이미지 로드
    loadedImage = IMG_Load( filename.c_str() );

    // loadedImage에 제대로 로드가 됬다면,
    if( loadedImage != NULL ) {
        // 최적화한 이미지를 optimizedImage에 생성
        optimizedImage = SDL_DisplayFormat( loadedImage );

        // loadedImage를 메모리에서 해제
        SDL_FreeSurface( loadedImage );
    }

    // 최적화된 이미지를 반환
    return optimizedImage;
}


 빨강으로 표시된 부분은 원래 SDL_LoadBMP가 있던 부분을 IMG_Load로 바꾼 것입니다. 이렇게 함으로써 BMP를 포함한 대부분의 이미지 포멧을 불러올 수가 있게 되었습니다.

    // 윈도우의 제목을 설정해줍니다.
    SDL_WM_SetCaption( "SDL Lesson3", NULL );

    // 이미지 로드
    message = load_image( "Message.png" );
    background = load_image( "Bg.png" );

    // 배경을 화면에 출력
    apply_surface( 0, 0, background, screen );


 이번엔 main함수로 건너뛰어서 이미지를 불러오는 코드입니다. 파일의 확장자를 png로 바꿔봅시다. 물론, 기존에 여러분이 가지고 계셨던 이미지 파일을 png로 변환하시고 나서 이렇게 해야겠지만, 그게 귀찮으시면 그냥 하단에 ZIP파일을 받아서 적용해보시기 바랍니다.

 이렇게 고치신 후, 컴파일 하시고 실행을 해봅니다. 어떤가요? PNG파일도 정상적으로 불러와서, 화면에 뿌려주는 것을 보실 수 있을 것입니다. 오늘은 좀 날로먹는 강의를 하는 것 같군요 ^^; 고친 부분도 생각보다 없네요.

 오늘의 강의는 어기까지 하겠습니다! 뭔가 날로먹은듯한 느낌이 풀풀나지만, 어쩌겠습니까...

 오늘 강의했던 소스코드를 첨부했습니다. 참고해주시기 바랍니다.



 다음 강의는 이벤트에 대해서 할까 합니다. 윈도우로 치면 WndProc(윈도우 프로시저) 정도랄까요?



- Lesson 3을 마무리하며...

 오늘은 내용이 없어서 나름 일찍 끝낸 것 같군요. 처리해야할 스크린샷도 두장뿐인지라 수고를 덜었습니다. 추가/수정한 코드도 달랑 3줄정도 뿐이니.. 그래도 이로써 SDL사용에 대한 제약(?)을 털어버리실 수 있을 듯도 합니다. 오늘 강의도 도움이 됬다면 좋겠네요 ^^

 알바를 어제부터 시작하고나서 생각보단 마음의 여유가 없는 것 같습니다. 긴장을 해서인지 몰라도 피곤해서 잠에 들었는데, 깨어난 시각이 12시 50분이라니 ㅠㅠ... 이러다가 수능 볼 기세입니다 ;ㅅ ;