トップ 差分 一覧 Farm ソース 検索 ヘルプ PDF RSS ログイン

チュートリアル 9: 8-Bit 背景

これまでで画面にスプライトを描写し、動かし、背景を読み込み、テキストを書いてきました。
もう一つ背景の種類があります。これは大変便利です。
これは8ビット背景( 8 bit background)と呼ばれます。

8ビット背景にはピクセル,線の描写が可能な機能があります。
また、ピクセル,線に色を追加する機能もあります。
まずは、ピクセルや線を引く際に必要な、背景の設定,カラーパレットの設定方法を説明します。

8-bit背景の準備は他の背景ととても似ています。下画面への表示コードは以下の通りです。

 SCREEN_BOTTOM = 0
 BGBot8Bit = Screen.Load8BitBG()
 Screen.Initialize( SCREEN_BOTTOM, BGBot8Bit ) 

さて、そろそろ背景に関する新たな「レイヤー」について説明しましょう。

2つの背景を互いに画面に表示させることができます。
どちらかの画面でScreen.Initialize()を書くと、その画面の背景はいつでも消去されます。
そこで、下画面に2つの背景を宣言しましょう。

 SCREEN_BOTTOM = 0
 BGBot8Bit = Screen.Load8BitBG()
 BGBotText = Screen.LoadTextBG()
 Screen.Initialize( SCREEN_BOTTOM, BGBotText, BGBot8Bit ) 

BGBotTextを記述した後にBGBot8Bitを記述したので、BGBotTextはBGBot8Bitの上に描写されます。
これで複数の背景を表示する方法が分かったので、色を追加してみましょう。
SetPaletteColor()を使用すれば、色を定義することができます。
色の定義についてあまり知らない場合は、少し混乱するかもしれません。

SetPaletteColor()では、4つの値を入力できます。
1つ目がその色と定義される数字です(その色を使うために、この番号にピクセル,線を描写するファンクションを入れましょう)
そして残りの3つの値が赤緑青の色の値です。これをRGB値と呼びます。
各RGB値は0(無色)から31(一番濃い色)まであります。

例えば、BGBot8Bit:SetPaletteColor( COLOR_RED, 31, 0, 0 )は、赤の値がいっぱいで、他の緑と青の値がゼロなので赤となります。
「0, 0, 0」にすれば、何も色がないので黒になります。
3つの数字を同じにすれば、いつでもグレーになります。
(「8, 8, 8」は暗いグレーに,「16, 16, 16」は通常のグレーに,「24, 24, 24」は明るいグレーになります。)
どのように色を混ぜれば良いかが分かる画像を見つけました。こちらを参考にしてみてください。

さて、あとで使う色を今定義してみましょう。
赤,緑,青,オレンジ,黄,グレー,白を定義します。
あとで、自動的にパレットを作成するforループをお教えしましょう。

 SCREEN_BOTTOM = 0
 BGBot8Bit = Screen.Load8BitBG()
 Screen.Initialize( SCREEN_BOTTOM, BGBot8Bit )
 
 COLOR_RED = 0
 COLOR_GREEN = 1
 COLOR_BLUE = 2
 COLOR_ORANGE = 3
 COLOR_YELLOW = 4
 COLOR_GREY = 5
 COLOR_WHITE = 6
 
 BGBot8Bit:SetPaletteColor( COLOR_RED, 31, 0, 0 )
 BGBot8Bit:SetPaletteColor( COLOR_GREEN, 0, 31, 0 )
 BGBot8Bit:SetPaletteColor( COLOR_BLUE, 0, 0, 31 )
 BGBot8Bit:SetPaletteColor( COLOR_ORANGE, 31, 15, 0 )
 BGBot8Bit:SetPaletteColor( COLOR_YELLOW, 31, 31, 0 )
 BGBot8Bit:SetPaletteColor( COLOR_GREY, 15, 15, 15 )
 BGBot8Bit:SetPaletteColor( COLOR_WHITE, 31, 31, 31 ) 

いいですね。ついに何か画面に描くときが来ました。
まず使用するのはPlot()です。これは画面上に1ピクセルの点を描きます。
はじめの2つの変数はどこに点を描くかを見ける座標です。
そして3つ目の変数は色(SetPaletteColor()で定義した数字です)を示します。
例:

 SCREEN_BOTTOM = 0
 BGBot8Bit = Screen.Load8BitBG()
 Screen.Initialize( SCREEN_BOTTOM, BGBot8Bit )
 
 BACKGROUND_COLOR = 0
 A_COLOR = 1
 BGBot8Bit:SetPaletteColor( BACKGROUND_COLOR, 0, 0, 0 ) -- Black
 BGBot8Bit:SetPaletteColor( A_COLOR, 31, 15, 0 ) -- Orange
 
 BGBot8Bit:Plot( 128, 96, A_COLOR )
 
 DSLua.WaitForAnyKey() 

下画面の真ん中に1つのオレンジ色の点が描写されます。
次の例は簡単なEtch A Sketch(エッチ・ア・スケッチ)です。

 SCREEN_BOTTOM = 0
 BGBot8Bit = Screen.Load8BitBG()
 Screen.Initialize( SCREEN_BOTTOM, BGBot8Bit )
 
 BACKGROUND_COLOR = 0
 A_COLOR = 1
 BGBot8Bit:SetPaletteColor( BACKGROUND_COLOR, 0, 0, 0 ) -- Black
 BGBot8Bit:SetPaletteColor( A_COLOR, 31, 15, 0 ) -- Orange
 
 x = 128
 y = 96
 
 while Pads.Start() == false do
           if Pads.Left() then x = x - 1 end
           if Pads.Right() then x = x + 1 end
           if Pads.Up() then y = y - 1 end
           if Pads.Down() then y = y + 1 end
           if Pads.A() then BGBot8Bit:Clear() end -- Clears the screen when they press A
 
           BGBot8Bit:Plot( x, y, A_COLOR )
 
           for delay = 1, 4 do
                     Screen.WaitForVBL()
           end
 end 

ここで説明すべきことはないでしょう。Clear()で背景が消えることにだけ気をつけましょう。

Plot()は単にエッチ・ア・スケッチを作るのよりもっと使えます。
例えば、プログラムにフォントを組み込むことが可能です。
フォントの各文字をピクセルの2次元配列として作成し、それを出力するファンクションを作成すればよいのです。
この例ではアルファベットのはじめの3つの文字を表示可能です。

 SCREEN_BOTTOM = 0
 BGBot8Bit = Screen.Load8BitBG()
 Screen.Initialize( SCREEN_BOTTOM, BGBot8Bit )
 
 BGBot8Bit:SetPaletteColor( 0, 0, 0, 0 )
 BGBot8Bit:SetPaletteColor( 1, 31, 31, 31 )
 
 A = {}
 B = {}
 C = {}
 
 A[1] = {0, 0, 1, 0, 0}
 A[2] = {0, 1, 0, 1, 0}
 A[3] = {0, 1, 1, 1, 0}
 A[4] = {0, 1, 0, 1, 0}
 A[5] = {0, 1, 0 ,1, 0}
 
 B[1] = {0, 1, 1, 0, 0}
 B[2] = {0, 1, 0, 1, 0}
 B[3] = {0, 1, 1, 0, 0}
 B[4] = {0, 1, 0, 1, 0}
 B[5] = {0, 1, 1 ,0, 0}
 
 C[1] = {0, 0, 1, 1, 0}
 C[2] = {0, 1, 0, 0, 0}
 C[3] = {0, 1, 0, 0, 0}
 C[4] = {0, 1, 0, 0, 0}
 C[5] = {0, 0, 1 ,1, 0}
 
 function drawLetter( letter )
           for x = 1, 5 do
                     for y = 1, 5 do
                               if letter == "A" then
                                         BGBot8Bit:Plot( x, y, A[x][y] )
                               end
                               if letter == "B" then
                                         BGBot8Bit:Plot( x, y, B[x][y] )
                               end
                               if letter == "C" then
                                         BGBot8Bit:Plot( x, y, C[x][y] )
                               end
                     end
           end
 end
 
 -- テスト出力してみます。
 drawLetter( "A" )
 for delay=1,15000 do end
 DSLua.WaitForAnyKey()
 drawLetter( "B" )
 for delay=1,15000 do end
 DSLua.WaitForAnyKey()
 drawLetter( "C" )
 for delay=1,15000 do end
 DSLua.WaitForAnyKey() 

結構デカい例になってしまいました。全ての文字/数字/記号となればどれだけ大きくなるか想像してみてください。
これはフォントの作成として最適ではありません。が、近いです。
(全ての文字を3次元の文字配列に格納し、別々のファイルに分ければ、全てのif文を使用する必要はないでしょう)

8ビット背景の最後の機能は、線の描写機能です。
「線の始めの位置の座標2つ」と、「線の終わりの位置の座標2つ」そして「Plot()と同様の方法で指定する色」5つの変数を取ります。
これ以上言うことはありませんので、例を書きます。ペイントのように絵をかくことができます。
また、ループを使用して画面を色を塗りつぶす方法も載っています。

 SCREEN_BOTTOM = 0
 BGBot8Bit = Screen.Load8BitBG()
 Screen.Initialize( SCREEN_BOTTOM, BGBot8Bit )
 
 COLOR_WHITE = 0
 COLOR_BLACK = 1
 
 BGBot8Bit:SetPaletteColor( COLOR_WHITE, 31, 31, 31 )
 BGBot8Bit:SetPaletteColor( COLOR_BLACK, 0, 0, 0 )
 
 -- Fill the screen with white
 for y = 0, 191 do
           BGBot8Bit:Line( 0, y, 255, y, COLOR_WHITE )
 end
 
 while Pads.Start() == false do
           if Stylus.Down() then
                     x1 = Stylus.X()
                     y1 = Stylus.Y()
                     -- Now wait for the stylus to be lifted
                     while Stylus.Down() do x2 = Stylus.X() y2 = Stylus.Y() end
                     BGBot8Bit:Line( x1, y1, x2, y2, COLOR_BLACK )
           end
 end