ビットマップモードの文字表示1

GBAにはフォント表示の機能がないので自前に用意しなくてはいけません。加えてフォント自体を自作するのは大変な労力です。そこで着目したのがインターネットに存在するフリーフォント。以下に紹介したフォントはライセンスがかなり緩いものとなっています。本来なら使用料などの金銭的な問題がありますので、ライセンスを確認せずに使うことは避けてください。

フォントの形式はbdfを使おう

bdf形式はフォントを構成しているドットの集まりを記述したものです。内容はテキストのままなのでエディタを使って開いてみてください。ここでは漢字12x10ドットフォントのk6x10.bdfを例に見ていきます。

注目してほしい部分はBITMAP~ENDCHARの間です。数字が並んでいるだけでよくわからないと思いますが、実はこれが1文字分のフォントを表したものです。この数値は16進数で表されていて、ビットが立っている個所は色あり、立っていない個所は色なしと考えます。

2進数に変換してみたのが上記です。この文字は良く見ると「!」(ビックリマーク)の形をしていることがうっすらとわかると思います。bdfファイルには複数のBITMAP~ENDCHARがありますが、何文字あるかをカウントしているのはヘッダ部のCHARSです。このbdfファイルは160文字入っていることがわかります。

bdfからbmp(ビットマップ)へ

bdfの内容はどのように文字が並んでいたり、字体がさっぱり想像つかないと思います。そこでグラフィカルに出力してくれるツール(bdf2bmp)を使って確認してみましょう。使用はコンソールでコマンド入力します。

文字の間に余白(ドット)を0にして、文字160個分の列を折り返しなし、というコマンドをします。

1.png

出力画像の最初の字体は「 」(空白スペース)、次に「!」(ビックリマーク)。この順番には決まり事があり、俗に文字コードと呼ばれています。ホームページを見ていたら文字化けしている現象を目にするのは、ブラウザがコード変換を間違えたからです。1文字6x10ドット、160文字あるので画像全体の大きさは960x10ドットとなります。

0x20  (空白スペース)
0x21 !
0x22 "
0x23 #
0x24 $
0x25 %

(以下略・・・)

gritを使ってGBA用に変換

さて、k6x10.bmpをgritでmode4用に変換をします。変換されたデータは1ドットが1バイトで表されていて、文字の表示処理を作るときにラクができます。データ容量としては無駄かもしれませんがサンプルコードということでご了承ください。

縦960×横10=9600バイト。仮に2文字目の「!」(ビックリマーク)をmode3で表示したいと考えてみます。ビックリマークの最初のドット座標はx=6,y=0で、そこから横に6ドット分が1行目ということになります。次に2行目のドット座標はx=6,y=1で、そこから横に6ドット分が2行目となります。疑似的なコードに落としこんでみましょう。

2.png
index_x=6;
index_y=0;

s32 x, y;

for(y=0; y<10; y++)
{
	for(x=0; x<6; x++)
	{
		if(data[(index_y+y)*960 + index_x+x] == 0x01)
		{
			GBA VRAM = 黒色;
		}
		else
		{
	 		GBA VRAM = 白色;
		}
	}
}

mode3の表示

今回の例ではトップダウンで読んでいった方がわかりやすいのでmain関数から説明します。

int main(void)
{
	SetMode(MODE_3 | BG2_ENABLE);

	ST_FONT f;

	f.pDat  = (u8*) &k6x10Bitmap;	// データのポインタ
	f.imgCx = 960;			// データの横サイズ
	f.cx    = 6;			// 1文字の横サイズ
	f.cy    = 10;			// 1文字の縦サイズ

	Mode3DrawFontChr(&f,  0,  0, '!', RGB5(31,31,31));

	Mode3DrawFontStr(&f, 16, 16, "ABCDEF #$%&", RGB5(31,31,31));
	Mode3DrawFontStr(&f, 16, 32, "123456 +-*/", RGB5(31,31, 0));

	for(;;)
	{
	    WaitForVsync();
	}
}

ST_FONT構造体は、フォントを表示するために必要なパラメータを設定します。

typedef struct {
	u8* pDat;
	u16 imgCx;
	u16 cx;
	u16 cy;
} ST_FONT;

Mode3DrawFontChrは先ほど説明した内容をコードに落としたものです。

void Mode3DrawFontChr(ST_FONT* p, s32 sx, s32 sy, u16 chr, u16 col)
{
	// 書き込む起点位置を求めます
	u16* pScreen = (u16*)VRAM + (sy * 240) + sx;

	// 書き込むフォントデータの位置を求めます
	u8* pDat = p->pDat + (chr - 0x20) * p->cx;

	s32 x, y;
	for(y=0; y<p->cy; y++)
	{
		for(x=0; x<p->cx; x++)
		{
			if(pDat[y*p->imgCx + x] == 0x00)
			{
				continue;
			}

			pScreen[y*240 + x] = col;
		}
	}
}

最後にMode3DrawFontStr関数ですが、これは文字列を1つ1つMode3DrawFontChr関数に渡しているだけです。

void Mode3DrawFontStr(ST_FONT* p, s32 sx, s32 sy, char* str, u16 col)
{
	u16 chr;
	s32 i=0, x=0, y=0;

	for(;;)
	{
		chr = str[i++];

		if(chr == '\0')
		{
			return;
		}

		// 改行処理
		if(sx + x >= 240)
		{
			x  = 0;
			y += p->cy;

			if(sy + y + p->cy >= 160)
			{
				return;
			}
		}

		Mode3DrawFontChr(p, sx + x, sy + y, chr, col);
		x += p->cx;
	}
}

動作画面

3.png

履歴


添付ファイル: file2.png 27件 [詳細] file3.png 32件 [詳細] file1.png 30件 [詳細]

トップ   差分 履歴 リロード   一覧 検索 最終更新   ヘルプ   最終更新のRSS
Last-modified: 2023-05-30 (火) 00:18:35