(57)【要約】【課題】  コンテナと呼ばれるレイアウト部品を用いたＧＵＩアプリケーションの画面を容易に作成し、さらにイベントが伝達対象の部品に確実に伝達されるようにイベントの設定を視覚的にわかりやすい操作で可能にする。【解決手段】  画面の階層構造を編集するレイアウトウインドウと、各階層における部品の配置状態を表示するプレビューウインドウと、各階層の画面に配置する部品のテンプレートを表示する部品テンプレートウィンドウとを表示する第１の手段と、前記レイアウトウインドウにおいていずれかの階層のプレビューウインドウを表示した状態で、当該プレビューウインドウ内に前記部品テンプレートウィンドウ内で選択した所望の部品を複写する操作を受付けることにより、各階層における画面の部品配置を編集する第２の手段とを備える【選択図】      図１５
2008203912.tif 000002
【特許請求の範囲】
【請求項１】
所望の画面レイアウトを決定し、その画面レイアウトの画面中に表示部品や入力部品等の部品を配置して目的と機能を満たす階層構造の画面を作成する画面作成装置であって、
画面の階層構造を編集するレイアウトウインドウと、各階層における部品の配置状態を表示するプレビューウインドウと、各階層の画面に配置する部品のテンプレートを表示する部品テンプレートウィンドウとを表示する第１の手段と、
前記レイアウトウインドウにおいていずれかの階層のプレビューウインドウを表示した状態で、当該プレビューウインドウ内に前記部品テンプレートウィンドウ内で選択した所望の部品を複写する操作を受付けることにより、各階層における画面の部品配置を編集する第２の手段と
を備えることを特徴とする画面作成装置。
【請求項２】
所望の画面レイアウトを決定し、その画面レイアウトの画面中に表示部品や入力部品等の部品を配置して目的と機能を満たす階層構造の画面を画面作成装置によって作成する画面作成方法であって、
前記画面作成装置が、
画面の階層構造を編集するレイアウトウインドウと、各階層における部品の配置状態を表示するプレビューウインドウと、各階層の画面に配置する部品のテンプレートを表示する部品テンプレートウィンドウとを表示する第１のステップと、
前記レイアウトウインドウにおいていずれかの階層のプレビューウインドウを表示した状態で、当該プレビューウインドウ内に前記部品テンプレートウィンドウ内で選択した所望の部品を複写する操作を受付けることにより、各階層における画面の部品配置を編集する第２のステップと
を備えることを特徴とする画面作成方法。
【請求項３】
所望の画面レイアウトを決定し、その画面レイアウトの画面中に表示部品や入力部品等の部品を配置して目的と機能を満たす階層構造の画面を作成するための処理をコンピュータに実行させるプログラムであって、
画面の階層構造を編集するレイアウトウインドウと、各階層における部品の配置状態を表示するプレビューウインドウと、各階層の画面に配置する部品のテンプレートを表示する部品テンプレートウィンドウとを表示する第１のステップと、
前記レイアウトウインドウにおいていずれかの階層のプレビューウインドウを表示した状態で、当該プレビューウインドウ内に前記部品テンプレートウィンドウ内で選択した所望の部品を複写する操作を受付けることにより、各階層における画面の部品配置を編集する第２のステップと
をコンピュータに実行させることを特徴とする画面作成プログラム。
【発明の詳細な説明】
【技術分野】
【０００１】
本発明は、携帯電話機等の情報端末で使用するビジュアルユーザインタフェースを持つプログラムを作成する場合に必要となる画面を作成する画面作成装置及び方法並びにプログラムに係り、特に、所望の画面レイアウトを決定し、その画面レイアウトの画面中に表示部品や入力部品等の部品を配置して目的と機能を満たす階層構造の画面を作成する画面作成装置画面作成装置及び方法並びにプログラムに関するものである。
【背景技術】
【０００２】
近年、携帯電話機は急激に普及し、それに伴い多機能化した。現在では、携帯電話機は通話だけではなく、Eメール、WEBアクセス、スケジュール管理など、様々な用途に利用されている。これにより、多数の携帯電話機用アプリケーションが開発されるようになった。
また、携帯電話機のライフサイクルは非常に短く、年間に大量の新機種が発売される。そのため、携帯電話機用アプリケーションのソフトウェア開発者は、短期間で多量のソフトウェアを開発することを求められている。
一方で、携帯電話機用アプリケーションをはじめとした組み込み機器向けアプリケーションは、一旦組み込まれると修正が困難になることが多い。このため高品質であることも求められている。
従って、効率良くかつ高品質な携帯電話機用アプリケーションを開発可能にする、開発支援プログラムを利用することが非常に重要となってきている。
アプリケーションのソースコードを自動的に生成するソフトウェアとして、下記特許文献１、特許文献２に開示されたものがある。
【０００３】
【特許文献１】特開２００２−２２９７８５号公報
【特許文献２】特開２００２−１８２９１４号公報
【発明の開示】
【発明が解決しようとする課題】
【０００４】
ところで、携帯電話機画面は、ボタン、画像、文字列などの様々なユーザインタフェース部品で構成されている。これらのユーザインタフェース部品を配置する際、そのレイアウトを決定するためにコンテナと呼ばれる部品がしばしば利用される。
コンテナの役割は、ユーザインタフェース部品のレイアウトを決定することにある。携帯電話機画面は、端末によって画面の大きさが異なる。このため、端末機種に依存しない画面レイアウトを実現するには、部品同士の相対位置を考慮した構成を考える必要がある。
【０００５】
図２２〜２３は携帯電話機用アプリケーションに現われる典型的なメニュー画面を模式的に表している。画面中央に３つのメニュー項目が縦に配置されている。これらのメニュー項目は、それぞれ独立したボタン部品である。
図２２では、コンテナを用いない場合の部品配置を示している。
図２２（ａ）は携帯電話機で表示される画面を示す。画面のベース（２２０１）の上にメニュー項目部品２２０１１、２２０１２、２２０１３が配置されている。
図２２（ｂ）は部品の積層構造を模式的に示している。 
図２３では、コンテナを用いる場合の部品配置を示している。
図２３（ａ）は携帯電話機で表示される画面を示す。
画面のベース（２３０１）の上にコンテナ２３０１４が配置され，さらにその上に，メニュー項目部品２３０１１、２３０１２、２３０１３が配置されている。
【０００６】
図２３（ｂ）は部品の積層構造を模式的に示している。
図２３で配置されているコンテナ２３０１４は、その上に配置されているユーザインタフェース部品のレイアウトを決定するものとする。この場合、コンテナ２３０１４上に配置されているユーザインタフェース部品（ＵＩ部品）の幅はコンテナ２３０１４の幅と等しくなるように決定されているものとする。
コンテナ２３０１４を用いない場合（図２２）には、各メニュー項目が独立して配置されている。このため、開発の過程でメニュー項目の幅を変更する必要に迫られた場合、全てのボタン部品の幅を変更しなければならない。
一方、コンテナを用いた場合（図２３）では、コンテナの幅を変更するだけで、その上に乗っている３つのボタン部品の幅も自動的に変更される。
【０００７】
図２４では、コンテナを用いた場合（図２３）のイベント処理の流れの例を示す図である。ここでは、図２４（ａ）に示すように、イベントは積層構造の下方から上方へと流れるものとする（２４０１）。現在、メニュー項目２３０２２が選択状態になっているものとし、また、この状態で選択キーが押下されたものと仮定する。さらに、イベント処理の設定は画面２３０２、コンテナ２３０２４には設定されておらず、メニュー項目２３０２２には選択キーが押下された際の処理内容が設定されているものとする。
この場合、まず画面部品２３０２に“選択キーが押された”というイベントが伝達される。ここではイベントが処理されないので、次にコンテナ２３０２４にイベントが伝達される。ここではイベントが処理されないので、次にメニュー項目２３０２２にイベントが伝達される。メニュー項目２３０２２にはイベント処理が設定されているので、ここで指定されたイベント処理が行われる（２４０２）。
【０００８】
このようなコンテナを含む画面を、ソフトウェア開発ツール上でビジュアルに設計する場合、２つの問題が発生し得る。
第１の問題は、ソフトウェア開発ツール上で視覚的に画面レイアウトを編集する場合に発生する。
画面レイアウトをビジュアルに設計する場合、パレットに存在する各部品のテンプレートをレイアウト設計フィールドにドラッグアンドドロップ操作で配置するものとする。また、既に配置されている部品の位置や広がりも、対象となる部品をマウスクリック操作で選択し、ドラッグアンドドロップ操作によって変更できるものとする。
上記のコンテナのように、コンテナ上のユーザインタフェース部品の広がりがコンテナの広がりいっぱいに広がる場合、コンテナのプレビューはその上に配置されている部品のプレビューに隠れてしまうため、マウスクリック操作によってコンテナを選択することが不可能または困難となる。
すなわち、図２３の例を挙げると、メニュー項目部品２３０１１、２３０１２、２３０１３の３つの部品がコンテナ２３０１４の領域全面を覆っている。このため、コンテナに対する変更を、ビジュアルユーザインタフェース操作で行うことができないという問題が発生する。
【０００９】
第２の問題は、各部品に対してイベントが発生した際の処理を、開発ツール上で視覚的に編集する場合に起こる。
コンテナが存在することによって、画面上の部品の構造は積層構造となる。このような構造の場合、開発ツール上でイベントの処理を設定しても、この開発ツールで生成したアプリケーションでは処理され得ないイベントが発生し得る。このことを模式的に示したのが図２４（ｂ）である。
図２４（ｂ）では、メニュー項目２３０２２に加えて、コンテナ２３０２４にも選択キーが押下された際のイベント処理が設定されているものとする。この場合、まず画面部品２３０２に“選択キーが押された”というイベントが伝達され、ここではイベントが処理されないので、次にコンテナ２３０２４にイベントが伝達される。ここまでは図２４（ａ）と同じであるが、コンテナ２３０２４にはイベント処理が設定されているので、ここで指定されたイベント処理が行われ、メニュー項目２３０２２にはイベントは伝達されない。
このように、ある部品に対するイベントの処理をソフトウェア開発ツールのビジュアルユーザインタフェース操作で決定したとしても、実際に作成した携帯電話機用アプリケーション上ではそのイベントの処理が行われない場合があり得る。
これら２つの問題点は、前記特許文献１及び特許文献２においては考慮されていない。
【００１０】
本発明は、上記のような問題点に鑑みなされたものであり、その目的は、コンテナと呼ばれるレイアウト部品を用いたＧＵＩアプリケーションの画面を容易に作成し、さらにイベントが伝達対象の部品に確実に伝達されるようにイベントの設定を視覚的にわかりやすい操作で行うことができる画面作成装置及び方法並びにプログラムを提供することにある。
【課題を解決するための手段】
【００１１】
上記目的を達成するために、本発明に係る画面作成装置は、所望の画面レイアウトを決定し、その画面レイアウトの画面中に表示部品や入力部品等の部品を配置して目的と機能を満たす階層構造の画面を作成する画面作成装置であって、
画面の階層構造を編集するレイアウトウインドウと、各階層における部品の配置状態を表示するプレビューウインドウと、各階層の画面に配置する部品のテンプレートを表示する部品テンプレートウィンドウとを表示する第１の手段と、前記レイアウトウインドウにおいていずれかの階層のプレビューウインドウを表示した状態で、当該プレビューウインドウ内に前記部品テンプレートウィンドウ内で選択した所望の部品を複写する操作を受付けることにより、各階層における画面の部品配置を編集する第２の手段とを備えることを特徴とする。
【００１２】
また、本発明に係る画面作成方法は、所望の画面レイアウトを決定し、その画面レイアウトの画面中に表示部品や入力部品等の部品を配置して目的と機能を満たす階層構造の画面を画面作成装置によって作成する画面作成方法であって、
前記画面作成装置が、
画面の階層構造を編集するレイアウトウインドウと、各階層における部品の配置状態を表示するプレビューウインドウと、各階層の画面に配置する部品のテンプレートを表示する部品テンプレートウィンドウとを表示する第１のステップと、前記レイアウトウインドウにおいていずれかの階層のプレビューウインドウを表示した状態で、当該プレビューウインドウ内に前記部品テンプレートウィンドウ内で選択した所望の部品を複写する操作を受付けることにより、各階層における画面の部品配置を編集する第２のステップとを備えることを特徴とする。
【００１３】
また、本発明に係る画面作成プログラムは、所望の画面レイアウトを決定し、その画面レイアウトの画面中に表示部品や入力部品等の部品を配置して目的と機能を満たす階層構造の画面を作成するための処理をコンピュータに実行させるプログラムであって、
画面の階層構造を編集するレイアウトウインドウと、各階層における部品の配置状態を表示するプレビューウインドウと、各階層の画面に配置する部品のテンプレートを表示する部品テンプレートウィンドウとを表示する第１のステップと、前記レイアウトウインドウにおいていずれかの階層のプレビューウインドウを表示した状態で、当該プレビューウインドウ内に前記部品テンプレートウィンドウ内で選択した所望の部品を複写する操作を受付けることにより、各階層における画面の部品配置を編集する第２のステップとをコンピュータに実行させることを特徴とする。
【発明の効果】
【００１４】
本発明によれば、コンテナと呼ばれるレイアウト部品を用いたＧＵＩアプリケーションの画面レイアウトを容易に作成し、また画面を構成する部品に付随したイベントの設定を視覚的にわかりやすい操作で行うことができる
【発明を実施するための最良の形態】
【００１５】
以下、本発明を図示する実施の形態に基づいて詳細に説明する。
図１は、本発明に係る画面作成装置の実施の形態を示すブロック構成図であり、入力装置を構成するキーボード１０１及びマウス１０２、レイアウト対象の画面を表示する表示装置１０３、レイアウト対象の画面を作成するための処理を行うＣＰＵ１０４、メモリ１０５を備えている。
メモリ１０５には、各種テーブル群の記憶領域とプログラム群の記憶領域が設けられ、テーブル群の記憶領域には画面テーブル１０６１、部品レイアウトテーブル１０６２、イベントテーブル１０６３、部品テンプレートテーブル１０６４、画面データテーブル１０６５が設けられている。
プログラム群の記憶領域には、画面作成エディタ１０７１とソースコード生成部１０７２が記憶されている。
画面作成エディタ１０７１は、携帯電話機等の情報端末に搭載するビジュアルユーザインタフェースで用いる画面を作成・編集するプログラムであり、本発明の主要な構成要素となるものである。
ソースコード生成部１０７２は、画面作成エディタ１０７１で作成した画面情報と元に、携帯電話機用アプリケーションのソースコードを生成するプログラムである。
【００１６】
図２は、表示装置１０３に表示される画面レイアウト作成・編集画面２００の構成例を示す図である。
図２において、画面上部にはツールバー２０１があり、ソースコード生成ボタン２０１１が表示されている。このボタン２０１１を押下することによって、画面作成エディタ１０７１で編集した携帯電話機用アプリケーションのソースコードを出力する。
また、画面左には、複数種類の画面部品のアイコンを表示する部品テンプレートウィンドウ２０２が表示されている。
また、画面中央には、ビジュアルユーザインタフェースにおける画面を編集するための画面編集ウィンドウ２０３が表示されている。画面編集ウィンドウ２０３は、表示モードを切り替えるボタンが配置されたツールバー２０３１と画面を作成・編集する領域２０３２で構成されている。
画面一覧ウィンドウ２０４は、画面編集ウィンドウ２０３で作成・編集された画面の一覧が表示されている。
属性編集ウィンドウ２０５は、画面を構成する各構成部品の様々な属性が表示され、必要に応じて編集することができる。
【００１７】
図３〜７は、図１のテーブル１０６に記載されている各テーブルの項目内容と例を示す表である。
図３（ａ）は、画面テーブル１０６１の項目内容と例を示す表である。このテーブルは、携帯電話機用アプリケーションに現われる各画面自身の情報を保持している。図３（ａ）に示すように、画面テーブル１０６１の項目内容３０１は、画面ＩＤ３０１１、画面名３０１２、画面種類３０１３、画面サイズ３０１４、ベース部品ID３０１５、及び、属性３０１６の情報で構成されており、図３（ｂ）の例３０２のように各種情報が保持される。
属性３０１６は画面種類３０１３によって、複数存在し得る。
【００１８】
画面に配置されている画面部品の情報は、図４に示す部品レイアウトテーブル１０６２に保持されている。
図４（ａ）に示すように、部品レイアウトテーブル１０６２の項目内容（４０１）は、部品ＩＤ４０１１、部品名４０１２、部品種類４０１３、位置４０１４、サイズ４０１５、属性４０１６、及び、子部品ＩＤ４０１７の情報で構成されている。
図４（ｂ）は部品レイアウトテーブルの例（４０２）を示している。属性４０１６は、枠線の太さ、背景色など各部品に固有の属性を意味し、部品の種類４０１３によって複数存在し得る。また、子部品ＩＤ４０１７は部品種類４０１７がコンテナである部品に対してのみ値が代入され、コンテナの上に乗る子部品の部品ＩＤを表す。従って、子部品ＩＤ４０１７は、部品種類がコンテナである場合、複数存在し得る。
【００１９】
図５（ａ）には、イベントＩＤ表５０１を示している。これは、携帯電話機用アプリケーションのビジュアルユーザインタフェースにおけるイベントの種類を示したものである。イベントにはイベントNo.５０１１が割り振られ、そのそれぞれに対して、携帯電話機用アプリケーションのソースコード上におけるマクロ名であるイベントID５０１２が存在する。
イベントの種別５０１３は、各イベントIDが携帯電話機用アプリケーションのビジュアルユーザインタフェースにおいてどのような種類のイベントに対応するかを示している。
図５（ｂ）に示しているイベントテーブル１０６３の例（５０１）は、イベントＩＤ表５０１を用いて記述されている。イベントテーブル１０６３の各行は各部品を表し、各列はイベントＩＤを示している。
図４の部品レイアウトテーブルの例４０２に存在する部品には、それに対応するイベントテーブル（５０２）の行が必ず存在する。５０２では、例えば、部品ＩＤ１１０が選択状態にある場合、選択キーを押下することによって、pAddrFormという名前の画面に遷移する設定となっている。
【００２０】
図６は、部品テンプレートテーブル１０６４の項目内容（６０１）とその例（６０２）を示している。部品テンプレートテーブル１０６４は、部品テンプレートウィンドウ２０２に配置されている部品の雛型の情報を格納しているテーブルである。
画面編集操作において、部品テンプレートウィンドウ２０２から、画面編集領域２０３２に新規部品が追加された際、新規追加された部品が持つ各属性値の初期値は、部品テンプレートテーブル１０６４に格納されている内容となる。
図６（ａ）は、部品テンプレートテーブルの項目内容（６０１）を示している。種類６０１１は部品の種類を一意に表し、部品レイアウトテーブルの項目である部品種類４０１３に格納される内容である。
初期サイズ６０１２は、部品が部品テンプレートウィンドウ２０２から画面編集領域２０３２にドラッグアンドドロップされた際の、当該部品のサイズの初期値を保持する。
属性６０１３は、部品が部品テンプレートウィンドウ２０２から画面編集領域２０３２にドラッグアンドドロップされた際の当該部品の各種属性４０１６の初期値を保持する。
図６（ｂ）は、部品テンプレートテーブル１０６４の例（６０２）を示す。部品の種類６０１１によって、属性の数は複数となり得る。
【００２１】
図７は、リソースデータテーブル１０６５の項目内容（７０１）とその例（７０２）を示している。リソースデータとは、画面に表示する文字列や画像データのことを示す。これらリソースデータは、あらかじめリソースデータテーブル１０６５に登録され、画面レイアウトの作成および編集時に利用される。
図7（ａ）は、リソースデータテーブルの項目内容（７０１）を示している。名称７０１１はリソースデータを一意に識別するためのもので、生成される携帯電話機用アプリケーションのソースコード上での変数名などに利用される文字列である。内容７０１２はリソースデータそのものを表す文字列または画像のバイナリデータである。
図７（ｂ）は、リソースデータテーブル１０６５の例（７０２）を示している。このように登録されたリソースデータは、画面編集領域２０３２または属性編集ウィンドウ２０５上で表示部品に対して設定を行うことができる。
【００２２】
図８は、この発明において携帯電話機用アプリケーションを開発する手順を示すフローチャートである。
図８において、まず、開発支援ソフトウェア（本発明に係る画面作成プログラム１０７）を起動する（ステップ８０１）。
次に、図２の部品テンプレートウィンドウ２０２から、ドラッグアンドドロップ操作によって、画面編集領域２０３２に画面部品を配置する（ステップ８０２）。
次に、図２の画面編集領域２０３２内において、部品による画面構成や各部品におけるイベント処理内容を決定する。その際、必要に応じて図２の属性編集ウィンドウ２０５を用い、各部品の大きさや表示内容などを決定する（ステップ８０３）。
次に、図２のツールバー２０１上のソースコード生成ボタン２０１１を押下することによって、画面に対応した携帯電話機用アプリケーションのソースコードを出力する（ステップ８０４）。
次に、生成された携帯電話機用アプリケーションのソースコードを必要に応じて編集する（ステップ８０５）。特に、開発支援ソフトウェアでは出力されない処理内容などを適宜記述する。
以上により、携帯電話機用アプリケーションのソースコードの作成が終了する。
【００２３】
画面編集ウィンドウ２０３には、画面レイアウト編集モードとイベント編集モードの２つの編集モードがある。
図９〜１１は、これらの各編集モードの表示内容とその切り替え方式を示すものである。
図９は、画面編集ウィンドウ２０３の画面レイアウト編集モードを示す図である。
画面編集ウィンドウ２０３内において、画面編集領域２０３２の左側にはツリービュー領域９０１、右側にはプレビュー領域９０２が表示されている。
ツリービュー領域９０１には、作成・編集対象である１つの画面における積層構造が表示されている。
プレビュー領域９０２には、作成・編集対象である１つの画面のプレビューイメージが表示されている。
【００２４】
図１０は、画面編集ウィンドウ２０３のイベント編集モードを示す図である。
この場合、画面編集ウィンドウ２０３内において、画面編集領域２０３２の左側にはプレビュー領域１００１、右側にはイベント処理編集領域１００２が表示されている。
プレビュー領域１００１は、図９のプレビュー領域９０２と同内容が表示される。
イベント処理編集領域１００２では、画面を構成する各部品に付随するイベントの処理を設定する。図１０（ｂ）の表１００３は、イベント処理編集領域１００２に表示される内容の概要を示している。スプレットシート形式の表であり、各列は各種のイベント発生条件を示す（１００３２）。また各行は、画面部品ごとのイベント処理の内容を表す（１００３１）。
【００２５】
図１１は、画面編集ウィンドウ２０３の編集モードの切り替え方式を示す図である。１１０１は画面レイアウト編集モードの状態を表し、１１０２はイベント編集モードの状態を表す。
画面編集ウィンドウ２０３を画面レイアウト編集モード１１０１からイベント編集モード１１０２に切り替えるには、画面編集ウィンドウ２０３内のツールバー２０３１上に配置されている切り替えスイッチをシングルクリックする（１１０１１）か、もしくは、ツリービュー領域９０１内のイベント編集を行いたい部品のツリーノードをダブルクリックする（１１０１２）。
後者の方式で編集モードの切り替えを行われた場合、イベント編集モード１１０２ではダブルクリックされた部品が選択状態となる。
画面編集ウィンドウ２０３をイベント編集モード１１０２から画面レイアウト編集モード１１０１に切り替えるには、画面編集ウィンドウ２０３内のツールバー２０３１上に配置されている切り替えスイッチをシングルクリックする（１１０２１）か、もしくは、イベント処理編集領域１００２内の第１列から部品名をダブルクリックする（１１０２２）。
後者の方式で編集モードの切り替えが行われた場合、画面レイアウト編集モード１１０１ではダブルクリックされた部品が選択状態となる。
【００２６】
図１２〜１６は、画面編集ウィンドウ２０３の画面レイアウト編集モードにおける画面レイアウトの編集方法を示すもので、携帯電話機用アプリケーションの画面に新たな部品を配置する方法を示すものである。
図１２は、編集前の画面レイアウトを示す。編集前の画面レイアウトは、コンテナ１、コンテナ２、文字列１、文字列２、及び文字列３で構成されている。これらの画面構成部品の配置がツリービュー領域９０１に示されている。また、具体的にこれらの部品がどのように配置されているかのプレビューがプレビュー領域９０２に示されている。
コンテナ１は、領域の垂直方向等分割を行うコンテナで、部品テンプレートウィンドウ２０２の１２０２の部品である。
コンテナ２は、領域の水平方向等分割を行うコンテナで、部品テンプレートウィンドウ２０２の１２０１の部品である。
文字列１、文字列２、及び、文字列３は、文字列を表示する部品で、部品テンプレートウィンドウ２０２の１２０３の部品である。
コンテナ１上には文字列１とコンテナ２が配置され、コンテナ１の上半分の領域を文字列１、下半分の領域をコンテナ２が占有する。
また、コンテナ２上には文字列２と文字列３が配置され、コンテナ２の左半分の領域を文字列２、右半分の領域を文字列３が占有する。
コンテナ１及びコンテナ２は、それぞれその上に配置されている部品に領域を占有されているため、プレビュー上ではクリック動作で選択状態にすることができない。これらのコンテナを選択状態にするためには、ツリービュー領域９０１のコンテナ１及びコンテナ２のツリーノードを選択する。
【００２７】
図１３は、ツリービュー領域９０１を利用した、コンテナ１への文字列部品の追加方法を示す。
図１３（ａ）は、部品追加操作を示す。操作は、部品テンプレートウィンドウ２０２内に配置されている文字列部品テンプレート１２０３をマウスポインタでドラッグし、ツリービュー領域９０１内のコンテナ１のツリーノードにドロップする（１３０１）。
図１３（ｂ）は、（ａ）の操作による編集の結果を示す。追加された文字列部品Ｔｅｘｔはコンテナ１上に配置される。コンテナ１上に配置された部品はコンテナ１の領域を垂直方向に３分割し、新たに追加された文字列部品Ｔｅｘｔは最下段の領域を占有する。
【００２８】
図１４は、ツリービュー領域９０１を利用した、コンテナ２への文字列部品の追加方法を示す。図１４（ａ）は、部品追加操作を示す。操作は、部品テンプレートウィンドウ２０２内に配置されている文字列部品テンプレート１２０３をマウスポインタでドラッグし、ツリービュー領域９０１内のコンテナ２のツリーノードにドロップする（１４０１）。
図１４（ｂ）は、（ａ）の操作による編集の結果を示す。追加された文字列部品Ｔｅｘｔはコンテナ２上に配置される。コンテナ２上に配置された部品はコンテナ２の領域を水平方向に３分割し、新たに追加された文字列部品Ｔｅｘｔは右領域を占有する。
【００２９】
図１５は、プレビュー領域９０２を利用した、コンテナ１への文字列部品の追加方法を示す。
図１５（ａ）は、部品追加操作を示す。操作は、ツリービュー領域９０１でコンテナ１を選択状態にし、その後部品テンプレートウィンドウ２０２内に配置されている文字列部品テンプレート１２０３をマウスポインタでドラッグし、プレビュー領域９０２にドロップする（１５０１）。
図１５（ｂ）は、（ａ）の操作による編集の結果を示す。追加された文字列部品Ｔｅｘｔはコンテナ１上に配置される。コンテナ１上に配置された部品はコンテナ１の領域を垂直方向に３分割し、新たに追加された文字列部品Ｔｅｘｔは最下段の領域を占有する。
【００３０】
図１６は、プレビュー領域９０２を利用した、コンテナ２への文字列部品の追加方法を示す。
図１６（ａ）は、部品追加操作を示す。操作は、ツリービュー領域９０１でコンテナ２を選択状態にし、その後部品テンプレートウィンドウ２０２内に配置されている文字列部品テンプレート１２０３をマウスポインタでドラッグし、プレビュー領域９０２にドロップする（１６０１）。
図１６（ｂ）は、（ａ）の操作による編集の結果を示す。追加された文字列部品Ｔｅｘｔはコンテナ２上に配置される。コンテナ２上に配置された部品はコンテナ２の領域を水平方向に３分割し、新たに追加された文字列部品Ｔｅｘｔは右領域を占有する。
【００３１】
図１７は、各部品に対するイベントの設定の仕方を示している。
図１７はイベント処理編集領域１００２に表示されるスプレットシート形式の表の全体像１００３である。
図１７（ａ）は変更前の８０３を表し、図１７（ｂ）は変更後の１００３を表す。
図１７（ａ）では、４つのイベント処理が既に設定されている。携帯電話機画面上で画面部品である文字列１が選択されているとき、選択キーが押下されると、画面２へ遷移し、文字列２が選択されているとき、選択キーが押下されると、画面３へ遷移し、文字列３が選択されているとき、選択キーが押下されると、画面４へ遷移する。
また、文字列２が選択されているとき、１ボタンが押下されると、画面５へ遷移する。
図１７（ｂ）は、図１７（ａ）に対して、１ボタンを押下されたときのイベント処理をコンテナ１に追加している（１００３３）。図２４より、このイベント処理は、コンテナ１、文字列１、文字列２及び文字列３のいずれかが選択状態である場合、１ボタンを押下されたときに画面２に遷移する処理を追加したことを表す。この場合、文字列２が選択されている状態で１ボタンが押下された場合に画面５に遷移するイベントは処理されない。これを明示的に示すために、コンテナ1に対してイベントを設定すると、この設定により処理されなくなるイベントの背景色を直ちに変更する（１００３４）。
【００３２】
図１８〜１９は、画面編集領域２０３２において画面に新たな画面部品を配置する時に、内部データが更新され、画面編集領域２０３２に反映されるまでの処理の手順を示すフローチャートである。これらの処理は、画面編集ウィンドウ２０３が画面レイアウト編集モードであることが前提となる。
図１８は、図１３及び図１４の操作の処理手順を示している。
図１８において、まず、部品テンプレートウィンドウ２０２から画面編集ウィンドウ２０３のツリービュー領域９０１に画面部品をドラッグアンドドロップする（ステップ１８０２）。
次に、ドロップ先の部品が子部品を持つことができる部品かどうかを判定する（ステップ１８０３）。そうであればドロップ先の部品を選択状態にし（ステップ１８０４）、部品レイアウトテーブル１０６２にドロップされた部品を追加し（ステップ１８０５）し、部品レイアウトテーブル１０６２からプレビュー領域９０２へテーブル内容が更新された旨の通知を行う（ステップ１８０６）。更新通知を受け取ったプレビュー領域９０２は、部品レイアウトテーブル１０６２を元にしてプレビューの再作成を行って（ステップ１８０７）、部品の追加処理を完了する。
一方、ステップ１８０３でドロップ先の部品が子部品を持つことができない部品であった場合、追加できない旨のエラーメッセージを表示（ステップ１８０８）した後、処理を完了する。
【００３３】
図１９は、図１５及び図１６の操作の処理手順を示している。
図１９において、まず、部品テンプレートウィンドウ２０２から画面編集ウィンドウ２０３のプレビュー領域９０２に画面部品をドラッグアンドドロップする（ステップ１９０２）。
次に、ドロップ操作時に、ツリービュー領域９０１で選択状態となっている部品が存在するかどうかを判定する（ステップ１９０３）。もし存在する場合、ツリービュー９０１より選択状態にある部品を読み取り（ステップ１９０４）、その後、図１８のステップ１８０３以降と同じ手順で処理を行う。
一方、ステップ１９０３でツリービュー領域９０１に選択状態となっている部品が存在しなかった場合には、追加できない旨のエラーメッセージを表示（ステップ１９１０）した後、処理を完了する。
【００３４】
図２０は、画面編集領域２０３２において部品に付随したイベント処理内容が変更されたときに、内部データが更新され、画面編集領域２０３２に反映されるまでの処理の手順を示すフローチャートである。この処理は、画面編集ウィンドウ２０３がイベント編集モードであることが前提となる。
ユーザにより、イベント処理編集領域１００２にて、画面部品に対するイベント処理内容の変更操作が行われると（ステップ２００２）、まず対象となる画面に部品に対して、イベント処理編集が可能かどうかを判定する（ステップ２００３）。
イベント処理編集が可能であった場合、イベントテーブルの内容を変更する(ステップ２００４)。
続いて、イベントテーブルの内容が変更されたことをイベント処理編集領域１００２に通知し（ステップ２００５）、通知を受けたイベント処理編集領域１００２はイベントテーブルの内容に合致するよう表示を更新する（ステップ２００６）。最後に、イベント処理設定がソースコード上無効となるイベントの一覧を収集しそれに応じてそれらのイベントの背景色を変更し（ステップ２００７）、イベント処理編集を完了する。
ステップ２００４にてイベント処理編集が不可能であった場合、その旨のエラーメッセージを出力し、イベント処理編集を完了する。
【００３５】
図２１は、イベント処理編集の処理手順である図２０中のステップ２００７で行われる処理内容の詳細な処理手順を示すフローチャートである。
ステップ２００７では、イベントテーブルの内容が更新されたことを受けて、各イベント処理内容を元に、携帯電話機用アプリケーション上設定内容が無効となる設定個所を特定し、背景色の変更を行う。
設定内容が無効となる設定個所とは、図２４で説明されるような個所である。
尚、上記のような個所は、無効であっても設定はできる。上記のような個所は、本開発支援ツール上設定内容が無効であったとしても、本開発支援ツールが出力したソースコードにユーザが手を加えた場合、有効となる可能性があるからである。
図２１では、まず、イベント無効リストを定義、初期化し（ステップ２１０２）、イベント処理編集領域１００２中で、現在選択されているセルの位置を編集に代入し、保持しておく（ステップ２１０３）。
続いて、ステップ２１０４〜２１１３のループ（１）の処理を行う。このループ処理は、図１７（ｂ）に示すスプレットシートの、各行に対して処理を行うループ処理である。行が存在する限り処理を繰り返す。
ループ（１）内の処理では、まず、行に対応する部品を部品レイアウトテーブル１０６２から取得し（ステップ２１０５）、取得した部品が持つイベント処理内容をイベントテーブル１０６３から取得する（ステップ２１０６）。
【００３６】
次に、ステップ２１０７〜２１１２のループ（２）処理を行う。このループ処理は、図１７（ｂ）に示すスプレットシートの、各列に対して処理を行うループ処理を意味し、一つの部品に対するイベント処理内容を読み取り、必要があれば背景色を変更する処理である。列が存在する限り処理を繰り返す。
ループ（２）の処理では、まず、該当部品に付随する該当イベント処理がイベント無効リストに含まれているかどうかを判定する（ステップ２１０８）。含まれている場合には何もしないが、含まれている場合には、該当部品の該当イベントを示すセルの背景色を変更する（ステップ２１０９）。
【００３７】
次に、該当部品の該当イベントに処理が設定されており、かつ、イベント無効リストに含まれていないかどうかを判定する（ステップ２１１０）。設定されていない、または、イベント無効リストに含まれている場合には何もしないが、設定されており、かつ、イベント無効リストに含まれていない場合には、該当部品の子部品を全て取得し、これらをイベント無効リストに登録する（ステップ２１１１）。
最後に、ステップ２１０３で保持した選択されているセルの位置を設定し、選択されているセルの状態を図２１の処理を行う前の状態に復元する。
【図面の簡単な説明】
【００３８】
【図１】本発明の実施の形態を示すブロック構成図である。
【図２】画面レイアウト作成・編集の例を示す図である。
【図３】各画面が持つ各種属性情報などを登録した画面テーブルの構成を示す図である。
【図４】画面を構成する各種部品のレイアウト情報を登録した部品レイアウトテーブルの構成を示す図である。
【図５】各種画面部品に登録し得るイベント処理の種類の例と、処理するイベント処理内容を登録したイベントテーブルの構成を示す図である。
【図６】各種画面部品の初期値を保持する部品テンプレートテーブルの構成を示す図である。
【図７】画面部品のうち、文字列や画像を表示する部品の文字列または画像バイナリを登録するリソーステーブルの構成を示す図である。
【図８】本発明における携帯電話機用アプリケーションの開発手順の概要を示すフローチャートである。
【図９】画面レイアウト編集モード時の画面編集ウィンドウの例を示す図である。
【図１０】イベント編集モード時の画面編集ウィンドウの例を示す図である。
【図１１】画面編集ウィンドウの画面レイアウト編集モードとイベント編集モードの切り替え方式の例を示す図である。
【図１２】画面レイアウト編集モードの画面編集ウィンドウと部品テンプレートウィンドウの各部位を説明する図である。
【図１３】画面レイアウト編集モード時の画面編集ウィンドウで、ツリービュー領域を用いてコンテナ１の子部品として新規部品を追加する手順を示す図である。
【図１４】画面レイアウト編集モード時の画面編集ウィンドウで、ツリービュー領域を用いてコンテナ２の子部品として新規部品を追加する手順を示す図である。
【図１５】画面レイアウト編集モード時の画面編集ウィンドウで、プレビュー領域を用いてコンテナ１の子部品として新規部品を追加する手順を示す図である。
【図１６】画面レイアウト編集モード時の画面編集ウィンドウで、プレビュー領域を用いてコンテナ２の子部品として新規部品を追加する手順を示す図である。
【図１７】イベント編集モード時の画面編集ウィンドウにおけるイベント設定の例を示す図である。
【図１８】画面レイアウト編集モード時の画面編集ウィンドウにおける、ツリービュー領域を用いた部品追加処理の概要を示すフローチャートである。
【図１９】画面レイアウト編集モード時の画面編集ウィンドウにおける、プレビュー領域を用いた部品追加処理の概要を示すフローチャートである。
【図２０】イベント処理変更処理の概要を示すフローチャートである。
【図２１】イベント処理変更時の、イベント処理内容無効部の背景色変更処理の概要を示すフローチャートである。
【図２２】携帯電話機画面のコンテナを用いない部品配置の例を示す図である。
【図２３】携帯電話機画面のコンテナを用いた部品配置の例を示す図である。
【図２４】携帯電話機画面を、コンテナを用いて部品配置した場合の、イベントの流れを示す図である。
【符号の説明】
【００３９】
１０１    キーボード
１０２    マウス
１０３    表示装置
１０４    ＣＰＵ
１０５    メモリ
２００    メインウィンドウ
２０１    ツールバー
２０２    部品テンプレートウィンドウ
２０３    画面編集ウィンドウ
２０４    画面一覧ウィンドウ
２０５    属性編集ウィンドウ
１０６１    画面テーブル
１０６２    部品レイアウトテーブル
１０６３    イベントテーブル
１０６４    部品テンプレートテーブル
１０６５    リソースデータテーブル
１０７１    画面作成エディタ
１０７２    ソースコード生成部
【図１】
2008203912.tif 000003
【図２】
2008203912.tif 000004
【図３】
2008203912.tif 000005
【図４】
2008203912.tif 000006
【図５】
2008203912.tif 000007
【図６】
2008203912.tif 000008
【図７】
2008203912.tif 000009
【図８】
2008203912.tif 000010
【図９】
2008203912.tif 000011
【図１０】
2008203912.tif 000012
【図１１】
2008203912.tif 000013
【図１２】
2008203912.tif 000014
【図１３】
2008203912.tif 000015
【図１４】
2008203912.tif 000016
【図１５】
2008203912.tif 000017
【図１６】
2008203912.tif 000018
【図１７】
2008203912.tif 000019
【図１８】
2008203912.tif 000020
【図１９】
2008203912.tif 000021
【図２０】
2008203912.tif 000022
【図２１】
2008203912.tif 000023
【図２２】
2008203912.tif 000024
【図２３】
2008203912.tif 000025
【図２４】
2008203912.tif 000026