INTERNATIONAL LABORATORY CORPORATION


商品情報 > 組込みGUI統合開発環境 GENWARE4(ジェンウェアフォー) >

開発の流れ

組込みGUI開発のすべての工程に効率アップを

GENWARE4は、アイ・エル・シーが組込み開発で培ってきたノウハウをベースに、組込みGUI開発における作業工程間のロスを徹底的に削減することを基本思想としています。

例えば、SVGデータやSWFインポート機能により、デザイナが作成したデータの座標やビットマップを維持したまま、GENWARE4に取り込むことができます。これまでのように、一度ビットマップに書き出して、ひとつひとつ座標合わせをする必要はありません。

仕様設計工程を見る
デザイン工程を見る
GUI実装工程を見る

仕様設計工程

画面遷移設計

GENWARE4ではVisioで作成した画面遷移図を画面遷移表に簡単に自動変換することができます。 画面遷移図は専用エディタではなく一般的に良く使われるVisioを使用して容易に作成可能です。
UMLで一般的な状態遷移図と同様の考え方に加え、各状態に画面を割り当てることができます。 画面遷移図は通常正常系および準正常系を設計しますが、異常系含めたすべてのイベントまで含めた設計には、画面遷移表を使って設計するのが一般的です。 また、Visioでは完成図書も意識した上で複数のページにまたがって画面遷移図を作成することが多く、画面遷移表への取り込みはVisioのページ単位での取り込みが可能です。

 

GUIシナリオを使った試作開発

一般的なGUIツールでは、アプリケーションを作る場合にGUIミドルウェアのAPIを覚えた上で実装する必要があり、プログラマ以外にはやや敷居の高い物でした。 GENWARE4ではそのGUIプログラミングを「プログラムレス」にしたことにより、簡単にGUIアプリケーションを作ることができるため、試作開発に効果を発揮します。
「GUIシナリオ」とはGUI動作の集合体です。例にあるように、GUIの詳細動作を「GUIアクション」として複数登録することができます。作成したGUIシナリオをキー押下タイミングや、外部イベントを受取ったタイミングで動作するようにGESNEKTCH4上で割付ければ、実際に動作するGUIアプリケーションが出来上がります。

GUIシナリオは、GUIツール上で簡単に登録することができます。編集モードとは別にGUIシナリオモードがあります。GUIシナリオモードでは、各 GUI要素(部品)を右クリックすると各種類の部品に応じた可能なGUI動作(表示する、移動する、絵を変えるなど)の一覧が表示され、選択することができます。

ページの先頭へ

デザイン工程

Illustrator®/Photoshop®で作るGUI画面

従来はデザイナが作成したデザインデータをGUI開発者が手動でプログラムに反映していました。各GUI要素の位置、関連するビットマップなど変換するだけでも大変な労力が必要です。さらに、デザイナもGUI開発者に対して位置情報を示すためのレイアウト仕様書などを自ら作成するなど両者のデータ共有は容易ではありませんでした。
このような問題はIllustrator/Photoshopインポート機能で大幅に改善します。

PSD→G4

GENWARE4はSVGビューアというIllustratorファイル(SVGファイル)のビューアを準備しています。SVGビューアでは Illustrator内でレイヤとして分解されたGUI要素を個別に選択して、それぞれをGUI開発者が扱えるGUI部品に変換することができます。変換時に座標情報も反映されます。つまり、デザイナはレイアウト仕様書などを作ることなくIllustratorやPhotoshopデータをGUI開発者に提供するだけで良いのです。
※Photoshopファイル(PSDファイル)もPSDビューアを使用して同じようにGUI部品に変換することができます 。

変換するGUI部品は、ドラッグ時に選択可能です。ボタン・ピクチャ・背景などを選択することが可能です。
また、すでに変換済みのGUI部品に対してデザインデータだけを更新したい場合はGUI部品の上にドラッグ&ドロップすれば上書きでデザインデータのみ更新が可能です。

アニメーションデータの作成

GUIのアニメーション効果においてはFlashを活用する場合があります。従来ではデザイナがFlashでアニメーションを作成し、そのFlashデータをGUI開発者が見ながらプログラムに手動で変換していました。実機においては液晶の表示能力など含めタイミングの調整が頻繁に行われるためその作業は大変な労力を伴っていました。
GENWARE4ではこの問題が大幅に改善します。

GENWARE4ではFlashデータ(swfファイル)をGUIツール上にドラッグ&ドロップするだけでタイムラインのアニメーションデータに自動変換します。また、アニメーションデータはリソースとして管理され、任意のGUI部品に対してアニメーションデータを割りあてることで、同じアニメーションを複数の部品で動作させることができます。

 

ページの先頭へ

GUI実装工程

ソースコード自動生成と実装

GENSKECH4では、画面デザインや画面遷移遷移情報をC言語/C++言語のソースコードとして生成します。 ソースコード中には、ボタンのクリックや画面遷移のタイミングで呼び出されるコールバック関数が生成されます。このコールバック関数内に、実際に行いたい処理を記述するのが、GENWARE4を使ったGUI開発の基本スタイルです。 またGENSKETCH4が生成するソースコードは可読性に優れているので、プログラマがソースコードを記述する際の負担を軽減します。

ソースコードの生成方式として、「追記」と「上書き」の2種類を選択できます。「上書き」生成方式ではGENSKETCH4がすべてのソースコードを書き換えますが、「追記」方式の場合、ユーザーコードを保護しながら、変更箇所をソースコードに反映します。 例えばプロジェクト終盤で急なデザインな変更があったとしても、ソースコードを再生成するだけで簡単にGUIアプリケーションを更新することができます。

外部データを表示する仕組み

本開発では、時間表示や電池残量表示などリアルタイムに変化するデータは外部から設定・通知されます。一般的には、GUIデータベース領域(共有メモリ)を準備し、外部タスク(上位制御タスク)から生データを書き込み、GUIタスクが参照するという構成が多く見られます。 GENWARE4では、本開発のためのGUIデータベース機能(GDataBase)を準備しています。また、GUIデータベースは外部制御タスクを開発せずとも簡単に変更することが可能です。GENWARE4は、GUIデータベースのテストツール機能を準備しています。GUIデータベースの変数をテストツール上で変更することができ、パソコン上で本開発用のGUIプログラムを容易にデバッグすることが可能です。

デバッグと評価

作成したGUIアプリケーションを起動し、キーイベントやシステムイベントなどを発行して、実際の画面遷移遷移動作を確認します。 GENSKETCH4の画面遷移表を使用したビジュアルデバッグ機能が強力です。遷移した画面は画面遷移表上でリアルタイムに塗りつぶされるので、手軽にカバレッジテストを行うことができます。遷移結果を保存して、Excelにエクスポートすればそのまま評価作業結果報告書として使えます。

ページの先頭へ