ゲームギア 開発環境

#はじめに
ゲームギアの開発環境について、日本語で解説しているページが見つからなかった為、調査してまとめました。

本記事ではCコンパイラにより、以下の画像をゲームギア上に表示するまでをご説明します。

表示させたい画像
![aaaaahiruguchi_man.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/214765/a1af11ea-c2d3-6b45-fb7e-ca3c81533548.png) 
画像参照元
いらすとや https://www.irasutoya.com/


#スペック

<table>
<tr><th>発売日		</th><th>1990年10月6日				</th></tr>
<tr><th>価格		</th><th>19,800円				</th></tr>
<tr><th>型番		</th><th>HGG-3200				</th></tr>
<tr><th>CPU		</th><th>Z80A(3.58MHz)				</th></tr>
<tr><th>RAM		</th><th>8KB					</th></tr>
<tr><th>VRAM		</th><th>16KB					</th></tr>
<tr><th>VDP		</th><th>セガカスタムLSI				</th></tr>
<tr><th>ディスプレイ	</th><th>バックライト付 3.2インチ カラー液晶	</th></tr>
<tr><th>画素数		</th><th>480×146ドット [*1]			</th></tr>
<tr><th>発色数		</th><th>4096中32色同時発色(ゲーム時)		</th></tr>
<tr><th>		</th><th>4096同時発色(TV時)			</th></tr>
<tr><th>SOUND		</th><th>ステレオ 3重和音 1ノイズ			</th></tr>
</table>


スペックは以下から参照。
セガハード大百科 - ゲームギア
https://sega.jp/history/hard/gamegear/index.html

[*1]
上記のセガ公式サイトでは画素数が480×146と記載されておりますが、実際には160×144です。
なぜ480×146と記載されているかは不明です。
480だとPSP並みの解像度のような気がします。

#開発言語
アセンブラとCコンパイラを利用できます。
本記事ではCコンパイラを使用した開発環境の説明を行います。
アセンブラについては、下記ツールの説明のみです。

###アセンブラ

* WLA-DX  
http://www.villehelin.com/wla.html  
現在も更新が行われているマルチプラットフォームのアセンブラ。  
記述時点での最新バージョンは v9.9 (15-Aug-2019)。  
以下の機種などに対応しています。  
 * セガ・マークIII
 * ゲームギア
 * ファミコン
 * スーパーファミコン
 * ゲームボーイ
 * ＰＣエンジン
 * etc


###コンパイラ

* SDCC - Small Device C Compiler  
http://sdcc.sourceforge.net/  
様々なマイコンに対応するCコンパイラ。
 * Z80
 * Intel 8031, 8032, 8051, 8052
 * Maxim 80DS390
 * 68HC08
 * etc


#必要ツール

* devkitsSMS
https://github.com/sverx/devkitSMS
Cライブラリと各種ツールがセットになったツールキット。

* BMP to SMS/GG tile converter(BMP2Tile)
http://www.smspower.org/maxim/Software/BMP2Tile
BMP, PNG, PCX, GIF形式の画像から、タイルデータ、タイルマップ、パレットを生成するツール。

* 画像のパレットが編集できるソフト 
本記事ではPictBearを使用しています。
https://www.fenrir-inc.com/jp/pictbear/
GIMPやAdobe Photoshopでも対応可能かと思います。


#準備
以下のサイトから必要なファイルをダウンロード。

* SDCC - Small Device C Compiler
http://sdcc.sourceforge.net/

* devkitSMS
https://github.com/sverx/devkitSMS

* BMP to SMS/GG tile converter(BMP2Tile)
http://www.smspower.org/maxim/Software/BMP2Tile


#インストール
1. ダウンロードした各ファイルを任意の場所に展開。

2. devkitSMSの SMSlib に格納されている「SMSlib_GG.lib」を、SDCCの lib\z80 に格納。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/214765/4b008cc5-0a26-e476-dc05-a73d086d32e3.png)

3. 任意の場所にプロジェクト用のフォルダを作成し、以下のファイルを格納する。
devkitSMS\crt0\crt0_sms.rel
devkitSMS\SMSlib\src\SMSlib.h
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/214765/7d0e6c37-9437-4fab-bc21-99b072e14240.png)

#画像からCソースを生成

以下の手順で画像からCソースを生成します。

* 画像を16色まで削る
* 画像を256x192にリサイズ
* 画像からタイルデータ、タイルマップ、パレットを生成
* タイルデータ、タイルマップ、パレットからCソースを生成

###画像を16色まで削る
1. PictBearで対象の画像を読み込み
![1.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/214765/3e402731-6bc2-d193-b3ce-7cee6255d4f5.png)

2. 「イメージ」→「イメージタイプ」→「インデックスカラー」を選択
![2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/214765/346732a0-977d-0051-9cf8-ef76427eddd2.png)

3. 警告が出ますが「はい」を選択
![3.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/214765/e5a5d80d-2753-5b09-e07a-6735326300ed.png)

4. そのまま「OK」を選択
![4.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/214765/113e8e31-74f4-f478-be2d-54617477a6ae.png)

5. 「イメージ」→「パレット」→「パレットの編集」を選択
![5.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/214765/96191a85-6ac5-cac3-c0de-9fb5a1bc03de.png)

6. 「ツール」→「不要なパレットを削除」を選択
![6.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/214765/a9a81c90-de30-dfae-4cca-492f7fd316f1.png)

7. 「ツール」→「使用頻度でソート」を選択
![7.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/214765/65dbc10e-a6f6-dfe7-3f6c-2e553c1508e9.png)



8. 「削除」を使用して上段の16色まで色を削り、「OK」を選択
![8.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/214765/ee29c0b8-8b32-a3c6-38e1-0bb5342f98e3.png)　⇒　![9.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/214765/6c26791d-29ea-ffc3-ead7-235934decd43.png)



9. 16色に削った画像
![10.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/214765/c50a9057-d395-fff9-1532-afc53342cc5a.png)



###画像を256x192にリサイズ

1. 「イメージ」→「イメージのリサイズ」を選択
![11.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/214765/45fa230b-0398-e954-83df-ec27b01e7eeb.png)



2. ゲームギアの画素数である160×144に収まるようにサイズを指定
![12.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/214765/2315d4dd-51a6-f5fc-d2dc-2cb4ce94bff8.png)



3. 「イメージ」→「キャンパスのリサイズ」を選択
![13.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/214765/e80d9732-86e0-5d6c-53f1-3cf2b781b526.png)



4. 256x192を指定
「縦横比を固定する」のチェックは外す
アンカーは中央を選択
![14.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/214765/2b7e7347-f4ac-dcbe-2377-4694da53a6d5.png)


5. 256x192にリサイズした画像
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/214765/598b86c1-1241-b01d-3f24-94802c470b8b.png)


###画像からタイルデータ、タイルマップ、パレットを生成

1. BMP to SMS/GG tile converter を起動し、画像を読み込み
![15.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/214765/82515d2a-4802-0348-ed9b-dca15f0eb8b2.png)

2. 「Tiles」タブを選択し、「Save」を選択
![16.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/214765/a07b25e9-c73b-fe90-005a-e7076ef8944e.png)

3. ファイルの種類で「Raw (uncompressed) binary (*.bin)」を選択して保存
![17.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/214765/5b634f61-998f-4987-0274-5015770e1941.png)

4. 「Tilemap」タブを選択
![18.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/214765/0c1c3b62-a6a8-d579-70a2-62bb03079fc2.png)

5. ファイルの種類で「Raw (uncompressed) binary (*.bin)」を選択して保存
![19.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/214765/4e743327-24a8-1cfc-b676-81e12f122ec4.png)

6. 「Palette」タブを選択
「Output hex(GG)」にチェック
![1111.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/214765/7c2f3a5f-f34e-bdf5-deb8-52104a9e127b.png)

7. ファイルの種類で「Binary files (*.bin)」を選択して保存
![21.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/214765/bda5900f-a335-b56c-8482-c7e0b3746290.png)


###タイルデータ、タイルマップ、パレットからCソースを生成

1. タイルデータ、タイルマップ、パレットを1つのフォルダに格納
上記以外のファイルを格納するとエラーになる可能性があります。
また、ファイル名が長すぎると処理が完了しない場合があります。その場合は、ファイル名を短縮してください。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/214765/7f3cbfc9-b241-5b1e-a1ae-b5d3f103d706.png)

2. 以下のPowerShellスクリプトを実行
「\$folder2c」と「\$data」は各自のパスに書き換えて下さい。
「\$folder2c」はdevkitSMS内に含まれているフォルダです。
「\$data」は1. でデータを格納したフォルダです。

 ```folder2c.ps1
$folder2c = "D:\devkitSMS\folder2c\"
$data     = "D:\Project\data\"

cd $folder2c

.\folder2c $data $data\assets

pause
```
完了するとCソースとヘッダが生成されます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/214765/1eadc5bc-3ad1-f2d0-84bc-75be53b2d888.png)

生成されたCソースとヘッダをプロジェクトフォルダに格納します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/214765/44dd1b05-9784-c7c7-4b2b-16f13c185151.png)




#ソースコード
以下のソースをプロジェクトフォルダに格納

xxx\__tiles\__bin, xxx\__tiles\__bin_size等は、assets.hを参照して各自書き換えて下さい。

```main.c
#define TARGET_GG

#include "SMSlib.h"
#include "assets.h"

void main (void)
{
	SMS_loadTiles		(xxx__tiles__bin, 0, xxx__tiles__bin_size);
	SMS_loadTileMap		(0, 0, xxx__tilemap__bin, xxx__tilemap__bin_size);
	GG_loadBGPalette	(xxx__palette__bin);

	SMS_displayOn(); 

	for (;;);
}
```

#コンパイル
以下のPowerShellスクリプトを実行。
パスは各自の環境に書き換えて下さい。

```Compile.ps1
$sdcc		= "D:\sdcc\bin\sdcc.exe"
$ihx2sms	= "D:\devkitSMS\ihx2sms\ihx2sms.exe"
$prj		= "D:\Project\"

Set-Alias sdcc		$sdcc
Set-Alias ihx2sms	$ihx2sms

cd $prj

sdcc -c -mz80 main.c 
sdcc -c -mz80 assets.c
sdcc -o hoge.ihx -mz80 --no-std-crt0 --data-loc 0xC000 crt0_sms.rel main.rel assets.rel SMSlib_GG.lib

ihx2sms hoge.ihx hoge.gg
```


#実行
生成された「hoge.gg」をエミュレータで起動。
本記事ではmekaを使用しています。
https://www.smspower.org/meka/

実行画面
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/214765/326213af-1dc2-0a8c-04f1-43709ec31933.png)


#参考サイト
Z80 Assembly programming for the Sega Master System and the Game Gear!
http://www.chibiakumas.com/z80/MasterSystemGameGear.php

stevepro studios - devkitSMS Programming Sample
https://steveproxna.blogspot.com/2017/11/devkitsms-programming-sample.html

View topic - devkitSMS tutorial - Forums - SMS Power!
http://www.smspower.org/forums/15888-DevkitSMSTutorial