ラスタ/ベクタ、2Dグラフィックスの基礎のキソ:BREWアプリケーション開発入門(4)

» 2009年10月28日 15時45分 公開
[末永 貴一/エイチアイ,@IT MONOist]


 前回までは、「HelloWorld」プログラムを題材にした「BREW(Binary Runtime Environment for Wireless)」アプリケーション開発の基礎について解説してきましたが、今回からは“グラフィックス”をテーマにした内容をお届けします。

 単純な「HelloWorld」プログラムでは少し退屈だったかもしれませんが、グラフィックスであれば、見た目にも分かりやすく、BREWアプリケーションの楽しさをより実感していただけると思います。

 というわけで、今回は比較的扱いやすく、利用範囲の広い「2Dグラフィックス」を題材に解説を進めていきたいと思います。

ラスタデータとベクタデータ

2Dグラフィックスのデータは大きく「ラスタ」と「ベクタ」の2つに分類できます。

 ラスタは単純なドットの集合体としてグラフィックスを表現するデータです。一方、ベクタは点で結ばれたさまざまな線を演算するなどして絵を表現するデータです。

 それぞれ用途が異なり、どちらが優れているというわけではありません。しかし、一般的に絵を高精細なまま回転・拡大・縮小するような“スケーラブルな表現”に対してはベクタが向いており、単純に高精細な絵を“軽量に表現”する場合にはラスタが向いているといえます。もちろん、ベクタでも高精細な絵を表現することはできますが、複雑な形状ですと計算量が大きくなってしまいますので、計算能力の低い機器では実現が困難といえるでしょう。

 BREWの標準API(Application Programming Interface)は、ラスタ/ベクタのどちらの2Dグラフィックス描画もサポートしています。

 ラスタデータの場合、何らかの画像フォーマットのデータを読むことになりますが、BREWでは「BMP」「PNG」「JPEG」「BCI(BREWオリジナルフォーマット)」がサポートされており、用途に応じて使い分けるようになっています。

 また、BMPデータは大きく環境依存の「DDB(Device Dependent Bitmap)」と環境非依存の「DIB(Device Independent Bitmap)」に分かれますが、最終的に携帯電話の画面に対して出力するためにはDDBである必要があります。逆に、内部形式を変更するデータ操作を行う場合は、DIBである必要があります。このため色情報などの変更を行う場合は、DIBで変更を行い、それからDDBに変換するという手順になります。

2Dベクタグラフィックの描画

 2Dベクタグラフィックスを描画するためには「IDisplayインタフェース」と「IGraphicsインタフェース」を利用します。それぞれ描画できる形状が異なり、用途で使い分けたり、組み合わせて利用したりすることになります。

IDisplayインタフェースを利用する

 まずは、IDisplayインタフェースによる描画について見ていきましょう。IDisplayインタフェースでは、以下の関数で形状を描画できます(表1)。

表1 IDisplayインタフェースの描画関数
関数名
描画できる形状
IDISPLAY_DrawHLine() 水平直線を描画
IDISPLAY_DrawVLine() 垂直直線を描画
IDISPLAY_DrawRect() 長方形を描画

 IDisplayインタフェースは、文字描画の「IDISPLAY_DrawText()」で利用しました(注1)が、基本的に使い方は一緒です。スクリーン座標を指定して、グラフィックスを描画するだけです。

注1:「IDISPLAY_DrawText()」については、連載第3回「BREWアプリケーションの構成を理解しよう!」の3ページ目をご覧ください。

 以下は直線を描画するサンプルです(ソース1)。

int vector2d_Display(AEEApplet* app){


AEEDeviceInfo devInfo;                  // 端末情報格納
int d_width, d_hight;                   // スクリーン座標格納 
IDisplay* display = app->m_pIDisplay;   // IDisplay格納


// 端末情報の取得
ISHELL_GetDeviceInfo(app->m_pIShell, &devInfo);


// スクリーン座標の取得
d_width = devInfo.cxScreen;
d_hight = devInfo.cyScreen;


// 直線描画
IDISPLAY_DrawHLine(display, 0, 10, d_width);
IDISPLAY_DrawVLine(display, 10, 0, d_hight);



IDISPLAY_Update(display);
return 0;


}
ソース1 直線の描画

 実行する際には、「HelloWorld」プログラムと同様に関数宣言と適当なイベントハンドラ(例えば、EVT_APP_START)から関数を呼ぶコードも加えます。画像1は「BREW Simulator」(注2)上での実行結果となります。

photo 画像1 ソース1の実行結果
注2:「BREW Simulator」については、連載第2回「BREWアプリケーション開発の流れを押さえよう」をご覧ください。

 ソース1の中で、まず「ISHELL_GetDeviceInfo()」でデバイス情報を取得しています。この関数は「BREW AEE(Application Execution Environment)」に対して、さまざまな操作を行う「IShellインタフェース」が提供する関数です。文字通り、BREW AEEのシェルの役割を果たします。

 線描画を行う部分が「IDISPLAY_DrawHLine()」と「IDISPLAY_DrawVLine()」になりますが、2つの関数はそれぞれ以下のような定義になっています。

void IDISPLAY_DrawHLine(IDisplay* po, int16 x, int16 y, int16 len)

void IDISPLAY_DrawVLine(IDisplay* po, int16 x, int16 y, int16 len)

 第1引数にIDisplayのインスタンスを、第2、3引数で描画開始位置のX・Y座標を指定します。そして、線の長さを指定することによって水平・垂直の線が描画されます。最後に、文字描画と同様に画面更新をするために「IDISPLAY_Update()」を実行します。

 IDisplayインタフェースを利用する場合には、最初から「AEEApplet」構造体にIDisplayのインスタンスが入っているので、それをそのまま利用すれば問題ありません。しかし、次に紹介するIGraphicsインタフェースを利用する場合には、インスタンスを別途生成する必要があります。以降で詳しく見ていきましょう。

>>「IGraphicsインタフェース」による描画については次ページ(MONOistサイトに移ります)で解説します


Copyright © ITmedia, Inc. All Rights Reserved.

アクセストップ10

2026年11月02日 更新
  1. 「iPad mini(A20 Pro)」は何が進化した? 「iPhone Duo」とはどう違う? スペックや用途を比較する (2026年11月01日)
  2. Google マップの新機能「マップに相談」は“知人に聞く”感覚で使える 「Pixel 11 Pro Fold」などフォルダブルとの相性も抜群 (2026年10月31日)
  3. KDDIの名機「INFOBAR」に新展開、11月18日に何かを発表――砂原哲氏が明かす (2026年11月01日)
  4. iPhone Duo、最適化できていないアプリに不満の声続出――App Storeでの「強制」により年明けには一気に解消か (2026年11月01日)
  5. ダイソーで1100円の「PD対応20Wモバイルバッテリー」を試す 手頃な価格でそこそこ高速にスマホを充電可能 (2026年10月31日)
  6. 「iPhone Duo」は“我慢の連続” 歴代最重254g、Face IDなし……それでも満足できる人の条件が分かった (2026年10月30日)
  7. 若者が選ぶ流行語「チャッピー構文」ってなんだ? 「結論から言うね」なAIの口癖、実は人間のせいかもしれない (2026年10月30日)
  8. スマホの映像をTVやディスプレイに出力すると意外と便利(プレゼンとか特に) (2026年10月31日)
  9. キャリアともMVNOとも違う独自路線 povoが目指す「パートナー連携2乗」と世界展開の勝算 (2026年10月31日)
  10. JR東日本「分かりにくい」新幹線券売機を改善へ なぜ、スマホではなく「駅での最短1分購入」を実現? (2026年07月04日)
最新トピックスPR

過去記事カレンダー