MSPark's Blog

Ebiten으로 간단한 게임을 구현해보려고 하는데 이번에는 그래픽 리소스를 직접 만들어보고 싶었다.

개인적으로 픽셀 감성을 좋아해서 픽셀을 찍어보려고 하기는 하는데 역시 쉽지 않다;;

뭐가 되었든 테스트용으로 간단한 픽셀 스프라이트를 Asesprite로 찍을 수 있었다.

Asesprite를 export 하면 json 파일과 png 파일을 뽑을 수 있는데

이 데이터를 읽어서 스프라이트 애니메이션을 구현해야 한다.

뽑힌 데이터들을 보니 애니메이션을 구현할만한 정보는 모두 포함되어 있었다.

그래서 일단 json 정보를 읽어보는것을 먼저 해보기로 했다.

검색해보니 기본적으로 'encoding/json' 패키지를 제공하고 있었고 다른 분이 만든 gson도 유명해보였다.

goasesprite라는 패키지도 있는데 (내부에서 gson을 이용해서 파싱) 테스트해보니 바로 애니메이션이 잘 동작했지만

json 읽는 부분도 연습해볼겸 직접 로드해보기로 했다.

일단 기본 흐름은 os.Open()으로 파일을 읽고 ioutil.ReadAll()로 []byte로 변경한뒤 json.Unmarshal()로 읽어오면된다.

Unmarshal을 하기 위해 json struct를 만들어주고 json의 key값을 연결해주어야 한다.

예를 들어 asesprite json에 있는 Meta 부분의 정보를 읽어오려면

type FrameTag struct {
...
}

type Meta struct {
  App string `json:"app"`	// meta.app을 읽어온다.
  ...
  Img string `json:"image"`	// meta.image를 읽어온다.
  ...
  FrameTags []FrameTag `json:"FrameTag"`	// meta.FrameTag을 읽어온다. (배열)
}

위와 같이 `json:"app"`과 같이 json의 키를 직접 입력해주어야 한다.

FrameTag와 같이 기본 타입이 아니라면 그에 맞는 struct를 추가해서 읽어줘야 하고 배열이라면 배열로 잡아야 한다.

Meta정보와 다르게 Frame은 배열이 아니라 Map의 형태로 되어있다.

이때는 Frames map[string]Frame `json:"frames"` 와 같이 map으로 읽으면 된다.

이 정도만 되어도 일단 원하는 데이터는 다 읽어올 수 있었다.

다음에는 이 데이터를 이용해서 애니메이션을 구현해봐야겠다.

요즘 Go의 Ebiten을 조금씩 보고 있다.

아직 Go 언어가 익숙하지는 않지만 조금씩 기능을 추가해가면서 공부해보려고 한다.

일단 가장 기본적인 기능으로 텍스트 출력을 해보고 싶었다. (FPS 출력;;)

그래서 무료 라이센스의 TTF 파일을 우선 찾았고 이 파일을 어떻게 사용할까 찾아보았다.

ebiten에서 텍스트를 사용하는 기능은 지원하고 있어서 TTF를 읽어서 font.Face를 만들어내기만 하면 되었다.

TTF를 읽기 위해서 freetype 패키지를 설치하였다.

go get github.com/golang/freetype

그리고 아래와 같이 파일 경로를 통해서 파일을 읽고 해당 파일을 바이트로 변경하고 truetype으로 파싱해서 font.Face를 생성하는 함수를 만들었다. 나는 utils 패키지를 만들어서 ttfLoader.go 파일로 빼놓았다.

func Load_TTF(fontPath string) font.Face {
	f, err := ebitenutil.OpenFile(fontPath)
	if err != nil {
		log.Fatal(err)
	}
	defer f.Close()

	b, err := ioutil.ReadAll(f)
	if err != nil {
		log.Fatal(err)
	}

	tt, err := truetype.Parse(b)
	if err != nil {
		log.Fatal(err)
	}

	const dpi = 72
	return truetype.NewFace(tt, &truetype.Options{
		Size:    24,
		DPI:     dpi,
		Hinting: font.HintingFull,
	})
}

update 함수에서 ebiten.CurrentFPS() 를 이용하여 현재 FPS를 얻어내 문자열을 만들었고

draw 함수에서 text.Draw()로 텍스트를 출력해보았다.

이렇게 조금 조금씩 코드를 추가해나가면서 간단한 게임 엔진을 만들어보려고 하는데

간단히 정리할 수 있는 내용이 있다면 블로그에 올리도록 하겠다.

Golang을 익혀보기 위해서 기본적으로 환경설정이 필요하다.

일단 Golang을 다운 받는다.

https://go.dev/dl/

에서 각자 OS에 맞게 설치 파일을 받아서 설치해주면 된다.

IDE는 VS Code를 사용할 예정이다. VS Code는 이미 설치되어 있어서 따로 받지는 않았다.

코드를 작성할 폴더를 하나 만들어주고 해당 폴더를 열어준다.

Golang은 기본 설정은 같은 Workspace를 두고 개발하기 때문에

모든 프로젝트에서 같은 패키지를 사용한다고 한다.

같은 패키지를 사용하면 공간도 절약되고 따로 설치를 하지 않아도 되서 효율적이기는 할 것 같은데

프로젝트마다 다른 버전의 패키지를 사용해야 된다면 조금 불편할 것 같기도 하다.

다른 언어들도 프로젝트마다 따로 패키지 설치를 지원하거나 virtual 환경을 만들어서 설치하고는 한다.

VS Code Settings만 조금 수정하면 VS Code를 통해서 패키지를 설치시 각 폴더에 설치할 수 있다.

Settings.json에 아래와 같이 입력하여 GOPATH를 내 폴더로 처리하도록 하면 된다.
(아니면 프로젝트 사용할때 마다 GOPATH를 직접 수정해줘도 될듯??)

"go.gopath": "${workspaceFolder}",
"go.inferGopath": true,
"terminal.integrated.env.windows": {
    "GOPATH": "${workspaceFolder}"
},
"terminal.integrated.env.osx": {
    "GOPATH": "${workspaceFolder}"
},

대신 이렇게 되면 내 폴더에서 이것저것 많이 생성되므로 .gitignore등을 잘 설정해줘야 될 것 같다.

근데 작업하다보니까 그냥 글로벌하게 설치해놓는것도 괜찮은것 같다

go mod를 이용해서 패키지들의 버전 관리를 해주면 될 것 같다

ebiten 같은 패키지는 거의 모든곳에서 사용할 것이기 때문에 한곳에 있는게 효율적일것 같기도 하고;;

그 뒤에는 VS Code의 Extension에서 Go를 설치해주자.

그 후에 Ctrl + Shift + P를 누르고 Go: Install/Update Tools를 선택해주면 몇가지 설치하면 좋은 Tool들이 나오는데

각자 필요한것을 골라서 설치하면 된다.

나는 일단 go-outline, gopls, staticcheck를 설치하였다.

gopls가 제대로 동작을 안한다면 아래 링크를 참고하여 delve를 설치해주면 된다.

https://github.com/go-delve/delve/tree/master/Documentation/installation

go install github.com/go-delve/delve/cmd/dlv@latest 를 입력해주면 설치된다.

go 파일로 간단한 파일을 만든 뒤 F5로 실행했을때 go.mod ~ 하면서 실행이 안된다면

터미널에서 go env -w GO111MODULE=auto를 입력하여 환경 변수를 변경해주면 된다.

일단 이정도만 해놓으면 Golang 공부하는데 문제는 없을 것이다.