💡 xpm file이란

X11 Pixmap Graphic이다.
X window system에서 사용하는 bit map image로, ASCII text로 단색 이미지를 나타낸다.

위와 같이 ASCII text에 대응되는 색상이 define 되고,
아래 pixel이 각 ASCII text로 표현되어 있다.

xpm file을 사용해야 하는 이유

mlx 라이브러리에서 png 파일을 image로 변환하는 함수인 mlx_png_file_to_image 함수 자체의 구현에서 메모리 누수 및 여러 문제들이 발생해서 xpm file 변환 함수를 사용하는 것이 좋다.

온라인에서 위와 같은 캐릭터 사진을 선별해서 사용하였다.

여기서 사진을 선별할 때는 내가 window에 map의 한 칸을 몇 bit로 할지를 정하고 선별하는 것이 좋다.
맥에서 image 위에 위와 같이 드래그하면 64x64 와 같은 형태로 현재 드래그한 칸의 사이즈를 알 수 있다.
내 경우에는 모든 tile의 size를 64x64로 정하고 그 크기에 맞는 tile을 찾고 잘라서 사용했다.

위의 사진을 원하는 사이즈로 잘라 png 파일로 저장하고,
https://anyconv.com/png-to-xpm-converter/ 처럼 image file 형식을 변환해주는 온라인 사이트를 활용하여 xpm으로 변환했다.

변환한 파일은 위와 같이 load하여 window에 출력할 수 있다.

배경 타일 위에 object 올리기

만약 wall이나 캐릭터가 map의 한 칸을 꽉 채운다면 문제가 되지 않지만, 대부분 그렇지 않다.
출구(EXIT)에 해당하는 tile의 경우 한 칸을 꽉 채우지만 캐릭터나 벽, 수집품 모두 한 칸을 꽉 채우지 않는다.
이 때, png to xpm으로 변환한 파일을 그대로 사용한다면 다음과 같은 현상이 발생한다.
이런 문제를 해결하기 위해서는 직접 xpm file의 구조를 이해하고, 배경색을 투명하게 바꾸어줘야 한다.

직전 posting에 위와 같은 부분이 있는데, 이번의 경우 배경색을 투명하게 만들어주어야 하므로 RGB 앞의 최상위 1byte를 수정해주어 투명도를 100%로 만들어주면 된다.

현재 해당 xpm file을 열어보면

배경색이 대부분 CX(8bit->16진수 2자리로 표현됨)로 표현되어 있는 것을 알 수 있다.

현재 CX는 FEFFFF로 정의되어 있는데 이는 거의 하얀색에 가까운 색이다. 우리는 이 색을 투명 100%로 바꾸어주고 싶으므로 앞에 FF(투명도)를 추가해주면 아직 완벽하지는 않지만 일부 투명해진 것을 확인할 수 있다. 배경에 있는 다른 부분의 ASCII 컬러 투명도를 높여주거나, 배경색에 해당하는 pixel을 모두 CX로 채워넣음으로써 완전히 배경을 투명하게 만들 수 있다.

🦋 so_long repo address
https://github.com/kyj93790/42-cursus/tree/master/so_long