JP4794927B2 - 情報処理装置、情報処理方法及びプログラム - Google Patents

Description

本発明は、ＵＩデータをもとにＵＩを構成する技術に関するものである。

従来では、ＵＩデータに基いてＵＩを構成する情報処理装置において、該ＵＩデータは該情報処理装置が持つＵＩルールの任意の階層要素を示すＵＩ指定情報から構成され、該情報処理装置は、実際のＵＩに対応付けられる具体的なＵＩ記述から該ＵＩ記述の抽象度を高めた複数段階の抽象的なＵＩ記述まで抽象度の違いで段階的に階層化されたＵＩルールと、該ＵＩ指定情報から該ＵＩルールを参照し対応するＵＩを決定するＵＩ決定手段と、を備え、該ＵＩ決定手段は該ＵＩ指定情報が指定する要素に直接対応するＵＩを特定できない場合該ＵＩルールの階層構造を利用して次善のＵＩを特定する次善ＵＩ決定手段とを備えることによって、当該情報処理装置内に持つＵＩルール構成の差異に関わらず、提供されたＵＩデータに基づき、常に最善の表示画面構成が行なえると言う技術が提案されている。

この技術によれば、表示画面の大きさや情報処理装置が備えているＵＩデバイスに関わらず、如何なる種類の物であっても、提供される単一のＵＩデータに基づき、且つ、ＵＩデータの提供者の意図に最大限忠実な表示画面の構成を得る事が可能となり、ＵＩルールに基づいたＵＩ決定手段により、クライアントに応じたＵＩを構築できる。

即ち、上記技術によれば、ＵＩデータに記述されたＵＩ指定情報が具体的なＵＩ部品やレイアウトを指定していなくても、あるいはＵＩデータに記述されたＵＩ指定情報が利用できないものであっても、できるだけ近いもので代替することでＵＩデータの提供者の意図に最大限忠実なＵＩを構築することができる。

また、上記記述ではrangeやtriggerなどといったＵＩ部品はその部品を修飾するためにラベルなどの子要素をもつことができるため、ＵＩ部品とラベルとを限定的に関連付けて扱うことが可能であった。

また、特許文献１においては、画面設計支援の為に、複数の部品とその属性情報をグループ化し、一つの部品群と定義して属性情報を設定・管理することで、部品とその属性情報との位置関係に優先度をつけたり、自動的に配置表示したりすることが出来る画面自動設計に関する技術が開示されている。

また、標準化団体Ｗ３Ｃにおいて、カスケード スタイル シート(ＣＳＳ: Cascading Style Sheet) という技術が広く公開されている（例えば、非特許文献１参照）。ＣＳＳにはＨＴＭＬドキュメントの要素に適用されるスタイル定義が格納され、ＣＳＳスタイルはページでの要素の表示方法と配置を定義することによって要素をどの位置に表示させるかという指定が可能である。

特開平１０−１９８５５７号公報 [Cascading Style Sheets, level 2 revision 1] W3C Candidate Recommendation 25 February 2004

しかしながら、従来例であるＮＵＩＰシステムにおいては、rangeやtriggerといった部品は、ラベルなどの子要素をもつことが出来るが、子要素であるラベルを親要素の部品（rangeやtrigger）のどの位置に表示するかという情報は特に与えられていない。また、親要素である部品に対して子要素として持つことが出来るラベルは１つのみであった。

従来の構成では、ＵＩ部品とラベルの関係は図２４のようであった。2403Rangeに代表されるＵＩ部品要素２４０２を修飾するラベル要素２４０２をつけて表示させるには、グループ２４０１として定義し、ＵＩ部品２４０２とラベル要素２４０４とを関係付ける必要があった。

または、ＮＵＩＰシステムにおいては、ＵＩ部品要素２４０５にはSlider２４０７やSpinbox２４０８などのRange２４０６のようにラベル要素２４０９を０または１つ持つことが出来た。

たとえば、図２５のようなＵＩデータを表示させると、図２６の２６０１のような画面が構成される。図２６において、図２５の行番号３６から３８、４０から４２、４７から４９、５３から５５はそれぞれ、２６０２、２６０３、２６０４、２６０５のように表示されている。ここで、ＵＩデータ作成者が、２６０２、２６０３において、時を表す"hours"、分を表す"minutes"をそれぞれＵＩ部品spinboxの右側に表示させるように表示位置を指定することは出来なかった。

また、図２５の行番号４７から５１にあるように、"幅何mm"を表示させる場合に、spinboxの左側に"Width"を、右側に"mm"を表示させたい場合には、ＵＩ部品spinboxはラベル要素を一つしか持つことが出来ないため、行番号５１のように、独立したラベル要素を表示させなければならなかった。

このため図２５のようなＵＩデータを表示画面の小さい装置に表示させると、図２６の２６０６のように表示されることがあった。すなわち、ＵＩ部品であるspinbox(２６１０)とそれを修飾するラベル要素（２６１１）、spinbox(２６１２)とそれを修飾するラベル要素（２６１３）との関係を維持することが出来ないため、ＵＩ作成者の望まない表示がされてしまうことがあった。

またさらには、特許文献１に開示された技術を用いて作成された画面においては、部品とその属性情報との位置関係についてその優先度を指定できるが、一旦作成した画面に対して修正を加えるためには、再度システム上での作業が必要となった。

またさらには、ＨＴＭＬ言語等で既に一般に広く使用されている、ＣＳＳなる技術においては、要素の表示方法と配置を定義することが出来るので、要素をどの位置に表示させるかという指定が可能であったが、ラベル自身も、部品と同じ要素として扱われるため、部品とラベルの関連を保持していなかった。

そこで、本発明の目的は、表示指定された要素から直接対応するＵＩコントロール部品を特定できない場合、ＵＩルールの階層構造を利用して次善のＵＩを特定することでクライアント毎にＵＩを変更することができるシステムにおいて、ＵＩコントロール部品と関連のある要素（部品とラベルなど）の関係を維持でき、関連をもたせるようにすることにある。

本発明の情報処理装置は、実際のＵＩに対応付けられる具体的なＵＩ記述から該ＵＩ記述の抽象度を高めた複数段階の抽象的なＵＩ記述までが抽象度の違いで段階的に階層化されたＵＩルールを保持する保持手段と、ＵＩ部品についての記述が行われた情報である複数のＵＩ部品指定情報を含むデータから、注目するＵＩ部品指定情報に相当する第１のＵＩ部品指定情報を取得する第１の取得手段と、前記ＵＩルールに基づいて、前記第１のＵＩ部品指定情報に対応する具体的なＵＩ記述である第１の具体的ＵＩのレイアウトを設定する設定手段と、前記第１のＵＩ部品指定情報の子要素に相当する第２のＵＩ部品指定情報があるか否かを判定する判定手段と、前記判定手段によって前記第２のＵＩ部品指定情報があると判定された場合、前記第２のＵＩ部品指定情報に対応する具体的なＵＩ記述である第２の具体的ＵＩを取得する第２の取得手段と、前記判定手段によって前記第２のＵＩ部品指定情報があると判定された場合、前記第２のＵＩ部品指定情報に含まれる情報であって、前記第２の具体的ＵＩの前記第１の具体的ＵＩに対する表示位置を特定するための表示位置情報を取得する第３の取得手段と、前記第２の具体的ＵＩと前記表示位置情報とが取得された場合、前記表示位置情報に従って、前記第２の具体的ＵＩを、前記設定手段によってレイアウトが設定された前記第１の具体的ＵＩに対する所定の位置にレイアウトするレイアウト手段とを有することを特徴とする。

以上述べたように、本発明の情報処理装置ではＵＩ部品と関連のある要素（ラベル）の関係を維持できる。

また、本発明の情報処理装置では、ＧＵＩ画面上におけるＵＩ部品のレイアウトが決定される際に、ＵＩ部品の周辺にラベルを自在に配置可能となる。

また、本発明の情報処理装置では、ＵＩ部品に対してＧＵＩ画面上でのレイアウトの変化が生じた場合に、前記ラベル情報についてもＵＩ部品と共に移動し、ＵＩ部品との関連性を維持することが可能となる。

また、ＵＩ指定情報によって指定されたＵＩ部品を特定できない場合にＵＩルールの階層構造を利用して次善のＵＩ部品を特定する場合も、実際に特定された次善のＵＩ部品と、ＵＩ指定情報によって指定しようとしたＵＩ部品と関連する1つ又はそれ以上の子要素との関係に維持することで、指定された表示位置にラベルを配置することができる。

以下、本発明を適用した好適な実施形態を、添付図面を参照しながら詳細に説明する。

図１は本実施形態における表示装置のハードウェア構成を示す図である。１２はＣＰＵであり、各種処理のための演算や論理判断等を行い、バス１１に接続された各構成要素を制御する。本装置には、プログラムメモリとデータメモリを含むメモリが搭載されている。
プログラムメモリには、フローチャートにつき後述する処理手順を含むＣＰＵによる制御のためのプログラムを格納する。メモリはＲＯＭ１３であっても良いし外部記憶装置などからプログラムがロードされるＲＡＭ１４であっても良い。

同図において１６はユーザからの情報を入力するための入力装置であり、この装置はマウス、タッチパネル、キーボードなどある。１８は分析されたデータ出力情報を出力する出力装置であり、ＣＲＴや液晶表示器などの表示装置である。またこれらの表示装置に表示される内容を保持するメモリとしてＶＲＡＭ１５を備える。１７はネットワークＩ／Ｆであり、ネットワークで接続された他の機器とのやり取りを行う。

（第１の実施形態）
本実施形態では、ＵＩ部品と関連する1つ又はそれ以上の子要素との関係を維持することで、部品に関連するラベルをその周辺に自在に配置できる例を示す。図２は本実施形態におけるＵＩ部品とラベルの関係を示す図である。

本実施形態においてＵＩ部品２０１は、Slider２０３やSpinbox２０４などのRange２０２と継承関係にあり、表示位置情報を属性としてもつラベル要素２０５を保持することで、部品と具体的ＵＩ部品との関連を持たせている。

図３は本実施形態に係るＵＩデータの構造の一例を示すクラス図である。同図において、本実施形態に係る情報処理装置がＵＩを構成するためのＵＩデータ３０１は、それぞれが１つのＵＩを記述する１つ以上のＵＩ指定情報３０２から構成されており、ＵＩ指定情報３０２にはＵＩ部品についての記述を行うＵＩ部品指定情報３０５と、ＵＩ部品のレイアウトについての記述を行うレイアウト指定情報３０６の２種類が存在する。

各ＵＩ指定情報３０２は１つのＵＩ指定情報要素３０３を有し、さらにＵＩ指定情報要素３０３は１つのＵＩ指定情報要素３０３を持つかあるいは持たないことによるリスト構造を成している。

各ＵＩ指定情報要素３０３は階層化された抽象度の１段階を表しており、抽象度を表す１つのＵＩ指定情報要素名３０４を有する。レイアウト指定情報３０６は該レイアウトの対象となる１つ以上のＵＩ指定情報３０２をその記述の内部に含むという意味において、ＵＩ指定情報３０２と関連している。

図４は本実施形態に係る抽象度の違いで段階的に階層化されたＵＩルールの構造の一例を示すクラス図である。同図において、ＵＩルール４０１は、１つ以上のＵＩルール要素４０２から構成されており、各ＵＩルール要素４０２は非末端ＵＩルール要素４０３あるいは末端ルール要素４０４のいずれかであり、非末端ＵＩルール要素４０３は１つ以上のＵＩルール要素４０２を有し、末端ＵＩルール要素４０４は１つの具体的ＵＩ４０５に結び付けられている。

これにより、ＵＩルール４０１はツリー状構造を成し、末端のＵＩルール要素４０２は必ず末端ＵＩルール要素４０４である。また、ＵＩルール要素４０２はそれぞれ１つのＵＩ指定情報要素名３０４と結び付けられており、ＵＩルール４０１のツリー状構造の各段階が階層化された抽象度の１段階を表現している。

また、ＵＩルール４０１はＵＩ部品に関するのルールであるＵＩ部品ルール４０６、およびレイアウトに関するルールであるレイアウトルール４０７と継承関係にある。

図５は、図４の具体例として、本実施形態に実装されているＵＩ部品に基づくＵＩルールの一部をツリー状構造で示したものである。本実施形態では、ＵＩ部品を構成するために、ツールキットがライブラリとして組み込まれており、上記で説明したように、抽象概念をまとめてツリー状構造をなしている。

ツリー状構造の末端には、ツールキットの具体的な部品が当てられており、階層を上がるごとに抽象度が高くなる。ツリー状構造の末端に、ツールキットの具体的な部品としてqspinbox５０９、qslider_horizontal５１０、qslider_vertical５１１、qlabel５１２、qpushbutton５１３などがある。

それらの１つ上の階層では、末端の具体的な部品をそれぞれ抽象化し、部品の概念としてまとめている、スピンボックス(spinbox５０５)、スライダ(slider５０６) 、ラベル(label５０７)、プッシュボタン(pushbutton５０８)、などがある。それらのさらに上位の階層では、さらに抽象化したレベルとして、数値範囲(range５０２)、テキスト(text５０３)、トリガ(trigger５０４)などがある。

図６は本実施形態に係る情報処理装置におけるＵＩデータ処理の一例を示すアクティビティ図である。まず、ステップＳ０６０１においてＵＩデータ中のＵＩ指定情報を１つ読み込む。続いて、ステップＳ０６０２においてＵＩ指定情報を全て処理したかどうか（ＵＩ指定情報の取得に成功したかどうか、またはＵＩデータ中にＵＩ指定情報がまだ存在するかどうか）を判断し、ＵＩ指定情報が存在しなければ、処理を終了する。

ステップＳ０６０２の判断の結果、ＵＩ指定情報がまだ存在するならば、具体的ＵＩ取得処理（ステップＳ０６０３）においてＵＩルールから対応する具体的ＵＩを得る。この処理の詳細は図７に示される。

ステップＳ０６０４において取得された具体的ＵＩをレイアウト規則にしたがってレイアウトし、ステップＳ０６０１で次のＵＩ指定情報を取得して、処理を繰り返す。

図７は、本実施形態に係る情報処理装置におけるレイアウト指定情報から具体的レイアウトを得る処理の一例を示すアクティビティ図である。なお、ステップＳ０７０１からステップＳ０７０８は、各ステップを示す。

まず、ＵＩ指定情報の最初のＵＩ指定情報要素を得る(ステップＳ０７０１)。該ＵＩ指定情報要素に対応するＵＩルール要素を得て、現在のレイアウトルール要素とする(ステップＳ０７０２)。

次に、該ＵＩ指定情報中に次のＵＩ指定情報要素があるか否かを判断する（ステップＳ０７０３）。次のＵＩ指定情報要素が存在する場合には、次のＵＩ指定情報要素を該ＵＩ指定情報から得る(ステップＳ０７０４)。該ＵＩ指定情報要素に対応するレイアウトルール要素が存在するか否かを判断する(ステップＳ０７０５)。

該判断の結果、該ＵＩ指定情報要素に対応する該レイアウトルール要素が存在する場合には、ステップＳ０７０２の処理に戻る。対応する該レイアウトルール要素が存在しない場合には、現在のレイアウトルール要素が末端レイアウトルール要素であるか否かを判断し(ステップＳ０７０６)、末端レイアウトルール要素であれば、該要素に結び付けられている具体的レイアウトを得て(ステップＳ０７０７)、処理を終了する。

ステップＳ０７０３の判断の結果、該ＵＩ指定情報中に次のＵＩ指定情報要素が存在しなければ、ステップＳ０７０６の判断に移る。ステップＳ０７０６の判断の結果、現在のレイアウトルール要素が末端レイアウトルール要素でなければ、現在のレイアウトルール要素の最初の子供要素を現在のレイアウトルール要素とし(ステップＳ０７０８)、ステップＳ０７０６の判断に戻る。

図８のＵＩデータにより、図９の画面例が構成される処理について説明する。ここで装置のＵＩルールは図５に示されるようなものであるとする。図８は、ＸＭＬの記述に基づき、ＨＴＭＬをホスト言語とした、ＮＵＩPシステムにより拡張されたXForms言語として記述されたＵＩデータの例である。

図８の行番号１０から２７までは、ＨＴＭＬのheadの記述であり、この中で、XFormsに基づくmodelの記述を行っている。行番号１３から１８までのinstanceでは、controlSwitch以下でhour、minutes、width、heightという４つの変数が、それぞれ０、０、６４０、４８０という初期値で宣言されている。

また、行番号２１から２４までは、上記４つの変数の範囲を示している。また、行番号２５で"control"というidを持ったsubmissionが定義されており、該submissionが発生した場合、ref属性の値であるsettingParam以下がXMLの書式でmethod属性に記述された"post"形式により、action属性の値である"http://server/app.cgi"に対して、送られることが記述されている。

行番号２９から６７までは、ＨＴＭＬのbodyの記述であり、本実施形態におけるＵＩデータの記述を行っている。

行番号３０の<xforms:group>と行番号６６の</xforms:group>は、これらに囲まれたＵＩ指定情報が一群のグループを形成することを記述している。上記一群のグループの中には更に、行番号３３と行番号４３、行番号４５と行番号５８、行番号６０と行番号６５の組の<xforms:group> と</xforms:group>で囲まれた３つのグループがある。

また、行番号３６、４０、４７、５３では、xforms:rangeにより、数値を要求する部品４つ構成することが記述されている。さらに、xforms:rangeには、行番号３７、４１、４８、４９、５４、５５にぞれぞれxforms:labelが付くことが記述されている。

ここで、行番号３７、４１中の８０１、８０２は本実施形態によるXFormsの拡張であり、ＵＩ部品指定情報type="/range/spinbox/qspinbox "の子要素としてつけられるxforms:labelの表示位置を指定している。

また、行番号４８、４９および５４、５５には、それぞれ行番号４７、５３のＵＩ部品指定情報type="/range/spinbox/qspinbox "の子要素として複数のxforms:labelが付くことが記述されている。

また、行番号６１では、xforms:triggerにより、トリガを発生する部品を構成することが記述されている。さらに、xforms:triggerには、行番号６２にxforms:labelが付くことが記述されている。

また、xforms:triggerには、行番号６３に、triggerで"DOMActivate"イベントが発生すると、"control"というidを持ったsubmissionを発生させることが記述されている。
行番号３０のtype="/group/vertical"、および行番号３３、４５、４０のtype="/group/horizontal"は、ＮＵＩPシステムによるXFormsの拡張であり、レイアウト指定情報を表している。

それに含まれるＵＩ指定情報要素"group"により、<xforms:group>から</xforms:group>まで囲われたＵＩ指定情報要素が1つのグループとなり、一群で構成されること、また、ＵＩ指定情報要素"vertical"、および""horizontal"により、このグループ内のＵＩ部品が縦並び、あるいは横並びで構成することが記述されている。行番号３６、４０、４７、５３のtype="/range/spinbox/qspinbox "は、ＮＵＩPシステムによるXFormsの拡張であり、ＵＩ部品指定情報を表している。

それに含まれるＵＩ指定情報要素"range"により、数値範囲の部品が指定されている。またＵＩ指定情報要素"spinbox"は、ＵＩ部品として数値を直接入力またはボタンにより数値を増減できるスピンボックスが指定されており、ＵＩ指定情報要素"qspinbox"によりツールキットの具体的な部品である、qspinboxが指定されていることが記述されている。
行番号３１、３４、４６、６２のtype="/text/label/qlabel"は、ＮＵＩPシステムによるXFormsの拡張であり、ＵＩ部品指定情報を表している。

それに含まれるＵＩ指定情報要素"text"により文字表示の部品が指定されており、ＵＩ指定情報要素"label"によりラベル部品が指定されており、ＵＩ指定情報要素"qlabel"によりツールキットのqlabelが指定されていることが記述されている。具体的に図８の行番号３６のＵＩ部品指定情報type="/range/spinbox/qspinbox"から図９の画面を構成する部品を選択する図７の処理を説明する。

ここで装置のＵＩルールは図５に示されるようなものであるので、図７のステップＳ０７０１では、図８の行番号３６のＵＩ部品指定情報から、最初のＵＩ指定情報である"range"を得る。ステップＳ０７０２でrange(数値範囲)に対応する図５の５０２の数値範囲を得る。

ステップＳ０７０３でＵＩ部品指定情報に続きがあるので、ステップＳ０７０４で、図８行番号３６のＵＩ部品指定情報中の"spinbox"を得る。ステップＳ０７０５で５０５のスピンボックス(spinbox)があるので、再び、ステップＳ０７０２へ行く。ステップＳ０７０２で５０５のスピンボックス(spinbox)を得る。

ステップＳ０７０３でＵＩ部品指定情報に続きがあるので、ステップＳ０７０４で図８の行番号３６のＵＩ部品指定情報中の"qspinbox"を得る。ステップＳ０７０５で５０９のqspinboxがあるので、再び、ステップＳ０７０２へ行く。ステップＳ０７０２で５０９のqspinboxを得る。ステップＳ０７０３でＵＩ部品指定情報に続きは無いので、ステップＳ０７０６に行く。５０９のqspinboxは末端ＵＩ部品ルール要素なので、ステップＳ０７０７にて、具体的ＵＩ部品 qspinboxを得る。

このようにして図８の具体的ＵＩ部品を持つ末端ＵＩ部品ルール要素まで指定した、ＵＩ部品指定情報により、ツールキットの具体的な部品である、spinboxが選択される。行番号４０、４７、５３も同様にして選択される。

また、同様にして、図８の行番号３１、３４、４６に記述されている<xforms:label type="/text/label/qlabel">により、ツールキットの具体的な部品である、qlabelが、図の行番号６１に記述されている<xforms:trigger type="/trigger/button/pushbutton">により、ツールキットの具体的な部品である、qpushbuttonが選択される。

このようにして得られた具体的ＵＩはステップＳ０６０４において、レイアウトされ表示される。ここで、具体的ＵＩのレイアウト処理（ステップＳ０６０４）の詳細は図１０に示される。

図１０はＵＩ部品指定情報から得られた具体的ＵＩを実際にレイアウトする処理の流れを示す図である。まずステップＳ１００１において、これまでの処理で得られた具体的ＵＩの大きさを現在のレイアウト情報として設定する。

続いてステップＳ１００２において、得られたＵＩ部品指定情報に子要素があるかどうかを判定する。図８の行番号３６のＵＩ部品指定情報<xforms:range type="/range/spinbox/qspinbox">には、その子要素として行番号３７のＵＩ部品指定情報<xforms:label type="/text/label/qlabel">があるので、判定はステップＳ１００３へ進む。

ステップＳ１００３において子要素であるＵＩ部品指定情報<xforms:label type="/text/label/qlabel" pos="right">の具体的ＵＩを取得する。この処理は、図８の行番号３１、３４、４６に記述されている<xforms:label type="/text/label/qlabel">により、ツールキットの具体的な部品である、qlabelが得られるのと同様におこなわれ、結果として具体的部品qlabelが得られる。

更にステップＳ１００４において、この子要素の表示位置属性pos="right"を取得する。この結果、ステップＳ１００５において、ステップＳ０７０７で得られた親要素である具体的ＵＩ部品qspinboxに対して、ステップＳ１００３で得られた子要素であるqlabelを、ステップＳ１００４で得られた表示位置属性rightに従ってレイアウトする。

ここで、具体的ＵＩ部品とその表示位置属性は図１１に示されるような関係にある。図１１は、具体的ＵＩ部品とその表示位置属性の関係の一例を示す図である。ここで、部品に対する表示位置属性はright,left,top,bottom,ontopの５種類あり、それぞれ、rightは部品１１０１の右側の位置１１０２に、leftは部品１１０１の左側の位置１１０３に、topは部品１１０１の上側の位置１１０４に、bottomは部品１１０１の下側の位置１１０５に、ontopは部品１１０１の真上の位置１１０５にレイアウトされる。部品に対する表示属性は上記５種類に限らず、より細かく指定しても良い。また、表示属性は部品に対する相対座標で与えられても良い。

続いてステップＳ１００６で、レイアウトした親要素と子要素の関係を、新しく親要素のレイアウト情報として更新し、ステップＳ１００２へ戻る。ここで、図８の行番号３６のＵＩ部品指定情報にはもう子要素がないので、判定はステップＳ１００７へ進む。

ステップＳ１００７において、子要素であるqlabelの表示位置属性に従ってレイアウトした具体的部品spinboxが全体レイアウトに従ってレイアウトされる。このようにして図９の９０２のようにspinboxの右側にテキスト文字"hours"を表示することができる。

上記により、ＵＩ部品に対してその子要素の表示位置を指定して表示させることが出来る。また、ＵＩ部品の子要素であるラベルが複数あった場合も、同様の流れで処理することができる。例えば、行番号５３のＵＩ部品指定情報<xforms:range type="/range/spinbox/qspinbox">から選択された具体的ＵＩ部品qspinboxは、行番号５４に子要素であるＵＩ部品指定情報<xforms:label type="/text/label/qlabel" pos="left">としてラベル要素"Width"を、更に、行番号５５に子要素であるＵＩ部品指定情報<xforms:label type="/text/label/qlabel" pos="right">としてラベル要素"mm"をもっている。

これら複数のラベル要素について上記に示した流れに沿って処理を行うと、図８の行番号５３から５６のＵＩ部品指定情報から９０４のように画面を構成することができる。上記により、ＵＩ部品がもつ複数の子要素に対しても表示位置を指定して表示させることが出来る。

また、図８のＵＩデータを表示画面の小さい装置に表示させると、図９の９０７のように表示できる。すなわち、ＵＩ部品であるspinboxとそれを修飾するラベル要素が９０４、９０５のように関係付けられ、図２６の２６０７のようなＵＩ作成者の望まない表示がされてしまうことはない。

また、次善のＵＩ部品が選択された場合も関連するラベルをその周辺に配置できる。例えば、装置が図１２のようなＵＩルールを保持しているとする。このとき、図８のＵＩデータを表示させると、図１３のような画面が構成される。ここで、図８の行番号３６から図１３の１３０１を構成する処理について詳細に説明する。

まず、図８の行番号３６のＵＩ部品指定情報type="/range/spinbox/qspinbox"から部品を選択する図７の処理を説明する。

図７のステップＳ０７０１では、図８の行番号３６のＵＩ部品指定情報から、最初のＵＩ指定情報である"range"を得る。ステップＳ０７０２でrange(数値範囲)に対応する図１２の１２０２の数値範囲（range）を得る。

ステップＳ０７０３でＵＩ部品指定情報に続きがあるので、ステップＳ０７０４で、図８の行番号３６のＵＩ部品指定情報中の"spinbox"を得る。ここで、ステップＳ０７０５で図１２に"spinbox"はないので、ステップＳ０７０６に行く。

ステップＳ０７０６で、現在のＵＩ部品ルール要素である、rangeは末端ＵＩ部品ルール要素ではないので、ステップＳ０７０８に行く。ステップＳ０７０８にて、１２０２の"range"の最初の子供要素である、スライダー(slider)１２０５を得る。

ステップＳ０７０６で、スライダー（splider）１２０５は末端ＵＩ部品ルール要素ではないので、ステップＳ０７０８に行く。ステップＳ０７０８にて、スライダー(slider)の最初の子供要素である、１２０９のqslider_horizontalを得る。

ステップＳ０７０６にて、１２０９のqslider_horizontalは末端ＵＩ部品ルール要素なので、ステップＳ０７０７にて具体的ＵＩ部品である qslider_horizontalを得る。

このようにして図８の行番号３６のＵＩ部品指定情報の様に指定された具体的ＵＩ部品が存在しない場合であっても、同じく数値範囲を指定するツールキットの具体的な部品である、qslider_horizontalが選択される。

得られた具体的ＵＩ、qslider_horizontalはステップＳ０６０４において図１０の流れに沿ってレイアウトされ表示される。即ち、図８の行番号３６のＵＩ部品指定情報<xforms:range type="/range/spinbox/qpsinbox">の子要素である行番号３７のＵＩ部品指定情報<xforms:label type="/text/label/qlabel" pos="right">の具体的ＵＩであるqlabelを取得して、表示属性pos="right"により、qslider_horizontalの右側にレイアウトする。

このようにして、図８の行番号３６から図１３の１３０１が構成される。上記により、次善のＵＩ部品が特定された場合にも、指定された表示位置にラベルを配置することができる。このようにして、本実施形態で示した本発明により下記の効果が実現できる。

ＧＵＩ画面上におけるＵＩ部品のレイアウトが決定される際に、ＵＩ部品の周辺にラベルを自在に配置可能となる。ＵＩ部品に対して複数のラベルを持たせることが出来るので、ＵＩ部品に対して、画面上でのレイアウトの変化が生じた場合に、該ＵＩ部品に関連するラベル情報についても、該ＵＩ部品と関連して動作することが出来る。ＵＩ指定情報によって指定されたＵＩ部品を特定できない場合にＵＩルールの階層構造を利用して次善のＵＩ部品を特定する場合も、実際に特定された次善のＵＩ部品と、ＵＩ指定情報によって指定しようとしたＵＩ部品と関連する1つ又はそれ以上の子要素との関係に維持することで、指定された表示位置にラベルを配置することができる。

（第２の実施形態）
次に第２の実施形態について説明する。本実施形態では、ＵＩ部品と関連する1つ又はそれ以上の子要素との意味的な関係を維持することで、部品に関連するラベルをその周辺に自在に配置できる例を示す。また次善のＵＩ部品が選択された場合に、関連する1つ又はそれ以上の子要素との関係を維持することで、部品に関連するラベルの位置情報を変更して配置できる例を示す。

図１４のＵＩデータの表示要求を受けて図の画面例が構成される処理について説明する。以下では特に、図１４の行番号３６から図１８の１８０１を構成する処理について詳細に説明する。

図１４は、ＸＭＬの記述に基づき、ＨＴＭＬをホスト言語とした、拡張されたXForms言語として記述されたＵＩデータの例である。図中の行番号３７、４１、４８、４９、５４、５５中の１４０１、１４０２、１４０３、１４０４、１４０５、１４０６は本実施形態によるXFormsの拡張であり、ＵＩ部品指定情報type="/range/spinbox/qspinbox "の子要素としてつけられるxforms:labelの表示位置をpos="title","unit"等として記述されている。

まず、装置が図５のようなＵＩルールをもつ場合について説明する。第１の実施形態の処理と同様にして、図１４の行番号３６の具体的ＵＩ部品を持つ末端ＵＩ部品ルール要素まで指定したＵＩ部品指定情報<xforms:range type="/range/spinbox/qspinbox">により、ツールキットの具体的な部品である、spinboxが選択される。

得られた具体的ＵＩ、qspinboxは第１の実施形態と同様にステップＳ０６０４においてレイアウトされ表示される。本実施形態においてはステップＳ０６０４の詳細は図1５に示される。

図１５は、ＵＩ部品指定情報から得られた具体的ＵＩを実際にレイアウトする処理の流れを示す図である。まずステップＳ１５０１において、これまでの処理で得られた具体的ＵＩの大きさを現在のレイアウト情報として設定する。

続いてステップＳ１５０２において、得られたＵＩ部品指定情報に子要素があるかどうかを判定する。図１４の行番号３６のＵＩ部品指定情報<xforms:range type="/range/spinbox/qspinbox">には、その子要素として行番号３７のＵＩ部品指定情報<xforms:label type="/text/label/qlabel">があるので、判定はステップＳ１５０３へ進む。

ステップＳ１５０３において子要素であるＵＩ部品指定情報<xforms:label type="/text/label/qlabel" pos="unit">の具体的ＵＩを取得する。この処理は、図１４の行番号３１、３４、４６に記述されている<xforms:label type="/text/label/qlabel">により、ツールキットの具体的な部品である、qlabelが得られるのと同様におこなわれ、結果として具体的部品qlabelが得られる。
更にステップＳ１５０４において、この子要素の表示位置を決定する。ステップＳ１５０４の処理の詳細は図１６に示される。

図１６は、具体的ＵＩ部品のラベル情報の表示属性から表示位置を取得する処理の流れを示す図である。まずステップＳ１６０１において、要素の表示属性１４０１pos="unit"を取得する。

続いてステップＳ１６０２において図１７の表示位置関係表を参照して、ステップＳ１６０１において得られた表示属性要素１４０１pos="unit"から表示位置を取得する。

図１７は具体的ＵＩ部品とそれに関連するラベルの表示位置属性との関係を示す図である。この図によると、具体的ＵＩ部品qspinboxの表示属性unitの表示位置はrightとなっている。よって、ステップＳ１６０２にて、表示位置rightが取得され、ステップＳ１５０４の処理の結果、表示位置をrightとして決定する。

この結果、ステップＳ１５０５において、親要素である具体的ＵＩ部品qspinboxに対して、ステップＳ１５０３で得られた子要素であるqlabelを、ステップＳ１５０４で得られた表示位置属性rightに従ってレイアウトする。すなわち、図１１の表示位置属性とＵＩ部品との関係から、qspinboxの右側に表示され、結果として図１８上の１８０１のように表示される。このように、表示属性に各々の部品ごとに意味をもたせて、ＵＩ部品とラベルの関係からラベルを配置することが出来る。

また、図１４の行番号３６のＵＩ部品指定情報で指定された具体的ＵＩ部品が存在しない場合であっても、代替として選択された次善部品に応じて、子要素の属性（ラベルの表示位置）を適宜変更して表示することが出来る。

例えば、装置が図１２のようなＵＩルールを保持しているとき、具体的ＵＩ部品とそれに関連するラベルの表示位置属性との関係を示す表が図１９に示されるようなものであるとすると、図１４のＵＩデータを表示させると図２０のような画面が構成される。

具体的に図１４の行番号３６のＵＩ部品指定情報<xforms:range type="/range/spinbox/qspinbox">を画面に表示する場合の処理について説明する。
上記ＵＩ部品指定情報により指定された具体的ＵＩ部品が存在しないので、次善の策として数値範囲を指定するツールキットの具体的な部品である、qslider_horizontalが選択される。

得られた具体的ＵＩ、qslider_horizontalは上記で説明したようにステップＳ０６０４において図１５の流れに沿ってレイアウトされ表示される。具体的にはステップＳ１５０４において子要素であるＵＩ部品指定情報<xforms:label type="/text/label/qlabel" pos="unit">を表示属性"pos="unit"に従って表示位置を決定する。

ステップＳ１６０２において、表示属性と表示位置の関係表を示す図１９を見ると、具体的部品qslider_horizontalの表示属性はbottomとなっている。よって、ステップＳ１６０２にて、表示位置bottomが取得され、ステップＳ１５０４の処理の結果、表示位置をbottomとして決定する。

この結果、ステップＳ１５０５において、親要素である具体的ＵＩ部品qslider_horizontalに対して、ステップＳ１５０３で得られた子要素であるqlabelを、ステップＳ１５０４で得られた表示位置属性bottomに従ってレイアウトする。すなわち、図１１の表示位置属性とＵＩ部品との関係から、qslider_horizontalの下側に表示され、結果として図２０上の２００１のように表示される。

このように、具体的ＵＩ部品が存在しない場合であっても、代替として選択された次善部品に応じて、子要素の属性（ラベルの表示位置）を適宜変更して表示することが出来る。
第一の実施形態において代替として選択された次善部品に対してラベル位置を変更せずに表示することができたが、図８の行番号６１のＵＩ部品指定情報<xforms:trigger type="/trigger/button/qpushbutton">により指定された具体的部品（qpushbutton）よりも小さい具体的部品（qsmallbutton）が次善部品として選択された際には、同図の行番号６２の<xforms:label type="/text/label/qlabel" pos="ontop">で指定されたラベル要素は図１３の１３０５のように、ラベルがボタンよりも大きくはみ出してしまっていた。

しかし本実施形態においては、図１４のＵＩ部品指定情報<xforms:trigger type="/trigger/button/qpushbutton">により指定により次善部品qsmallbuttonが選択された場合でも、行番号６２のＵＩ部品指定情報<xforms:label type="/text/label/qlabel" pos="title">で指定されたラベル要素は、次善部品qsmallbuttonの表示属性titleと関係付けられているので、図２０の２００２のように小さなボタンの左側に表示され見やすくなっている。

このようにして、本実施形態では下記の効果が実現できる。ＵＩ部品と関連する1つ又はそれ以上の子要素との意味的な関係を維持することで、部品に関連するラベルをその周辺に自在に配置できる。次善のＵＩ部品が選択された場合に、関連する1つ又はそれ以上の子要素との関係を維持することで、部品に関連するラベルの位置情報を変更して配置できる。

（第３の実施形態）
次に本発明の第３の実施形態について説明する。本実施形態では、ＵＩ部品に対して1つ又はそれ以上の複数のラベルを持たせることが出来る場合、ラベルの表示位置や表示属性が付与されていなくても、該ＵＩ部品応じてラベルを適宜配置できる例を示す。

図２１に示されるようなＵＩデータを表示する処理について説明する。ここで図２１の行番号４８、４９（２１０１）および、５４、５５（２１０２）のラベル要素には表示位置属性がついていない。

第２の実施形態と同様に、具体的に図１４の行番号４７のＵＩ部品指定情報<xforms:range type="/range/spinbox/qspinbox">を画面に表示する場合の処理について説明する。ここで、装置のもつＵＩルールは図５に示されるような物であり、表示属性の優先度は図２２のように指定されているとする。

上記ＵＩ部品指定情報により指定された具体的ＵＩ部品が存在するので、ツールキットの具体的な部品である、qspinboxが選択される。得られた具体的ＵＩ、qspinboxは第2の実施形態で説明したようにステップＳ０６０４において図１５の流れに沿ってレイアウトされ表示される。

具体的にはステップＳ１５０４において子要素であるＵＩ部品指定情報<xforms:label type="/text/label/qlabel" >の表示位置を決定する。本実施形態においては、ステップＳ１６０２において、表示属性の優先度表図２２を見ると、具体的部品qspinbox優先順位１の表示属性はleftとなっている。よって、ステップＳ１６０２にて、表示位置leftが取得され、ステップＳ１５０４の処理の結果、ラベルWidthの表示位置をleftとして決定する。

この結果、ステップＳ１５０５において、親要素である具体的ＵＩ部品qspinboxに対して、ステップＳ１５０３で得られた子要素であるqlabel(文字列Width)を、ステップＳ１５０４で得られた表示位置属性leftに従ってレイアウトする。

続いてステップＳ１００６で、レイアウトした親要素と子要素の関係を、新しく親要素のレイアウト情報として更新し、ステップＳ１００２へ戻る。

ここで、図８の行番号３６のＵＩ部品指定情報には、もう一つ子要素があるので、再度上記の処理を繰り返して、ステップＳ１５０３で得られた子要素であるqlabel(文字列mm)を、ステップＳ１５０４で得られた優先度２の表示位置属性rightに従ってレイアウトする。

すなわち、図１１の表示位置属性とＵＩ部品との関係から、ラベルWidthとmmは、qspinboxの左右に表示され、結果として図２３上の２３０１のように表示される。

上記により、表示するラベルの表示属性が指定されていない場合にも、ＵＩ部品ごとに表示属性の優先度をつけることで、複数のラベルを適宜配置することができる。

このようにして、本実施形態では下記の効果が実現できる。ＵＩ部品に対して子要素としてＵＩ部品と関連する1つ又はそれ以上の子要素の表示位置が指定されていない場合でも、ＵＩ部品に応じて適宜ラベルを配置することができる。

尚、本発明は、複数の機器（例えばホストコンピュータ、インタフェース機器、リーダ、プリンタなど）から構成されるシステムに適用しても、一つの機器からなる装置（例えば、複写機、ファクシミリ装置など）に適用してもよい。

また、本発明の目的は、前述した実施形態の機能を実現するソフトウェアのプログラムコードを記録した記憶媒体を、システムあるいは装置に供給し、そのシステムあるいは装置のコンピュータ（またはＣＰＵやＭＰＵ）が記憶媒体に格納されたプログラムコードを読出し実行することによっても、達成されることはいうまでもない。

この場合、記憶媒体から読出されたプログラムコード自体が前述した実施形態の機能を実現することになり、そのプログラムコードを記憶した記憶媒体は本発明を構成することになる。

プログラムコードを供給するための記憶媒体としては、例えば、フレキシブルディスク、ハードディスク、光ディスク、光磁気ディスク、ＣＤ−ＲＯＭ、ＣＤ−Ｒ、磁気テープ、不揮発性のメモリカード、ＲＯＭなどを用いることができる。

また、コンピュータが読出したプログラムコードを実行することにより、前述した実施形態の機能が実現されるだけでなく、そのプログラムコードの指示に基づき、コンピュータ上で稼働しているＯＳ（オペレーティングシステム）などが実際の処理の一部または全部を行い、その処理によって前述した実施形態の機能が実現される場合も含まれることはいうまでもない。

更に、記憶媒体から読出されたプログラムコードが、コンピュータに挿入された機能拡張ボードやコンピュータに接続された機能拡張ユニットに備わるメモリに書込まれた後、そのプログラムコードの指示に基づき、その機能拡張ボードや機能拡張ユニットに備わるＣＰＵなどが実際の処理の一部または全部を行い、その処理によって前述した実施形態の機能が実現される場合も含まれることはいうまでもない。

本発明の実施形態におけるＨ／Ｗ構成を示す図である。 本発明の実施形態におけるＵＩ部品のクラス図を示す図である。 本発明の第１の実施形態におけるＵＩ指定情報から構成されるＵＩデータの構造を示す図である。 本発明の第１の実施形態における抽象度の違いで段階的に階層化されたＵＩルールを示す図である。 本発明の第１の実施形態におけるＵＩルールの例を示す図である。 本発明の第１の実施形態におけるＵＩ構成処理の流れを示す図である。 本発明の第１の実施形態における具体的ＵＩ取得処理の流れを示す図である。 本発明の第１の実施形態におけるＵＩ部品のラベル情報の表示位置を指定する情報を含むＵＩデータを示す図である。 本発明の第１の実施形態におけるＵＩ部品のラベル情報の表示位置を指定する情報を含むＵＩデータを表示した画面を示す図である。 本発明の第１の実施形態における具体的ＵＩのレイアウト処理の流れを示す図である。 本発明の第１の実施形態における具体的ＵＩと表示位置属性との関係を示す図である。 本発明の第１の実施形態におけるＵＩルールの例を示す図である。 本発明の第１の実施形態におけるＵＩ部品のラベル情報の表示位置を指定する情報を含むＵＩデータを表示した際に次善のＵＩ部品が選択された場合の画面を示す図である。 本発明の第２の実施形態におけるＵＩ部品のラベル情報の表示属性を指定する情報を含むＵＩデータを示す図である。 本発明の第２の実施形態における具体的ＵＩのレイアウト処理の流れを示す図である。 本発明の第２の実施形態におけるＵＩ部品のラベル情報の表示位置属性を取得する処理の流れを示す図である。 本発明の第２の実施形態におけるＵＩ部品のラベル情報の表示属性と表示位置の関係を示す図である。 本発明の第２の実施形態におけるＵＩ部品のラベル情報の表示属性を指定する情報を含むＵＩデータを表示した画面を示す図である。 本発明の第２の実施形態におけるＵＩ部品のラベル情報の表示属性と表示位置の関係を示す図である。 本発明の第２の実施形態におけるＵＩ部品のラベル情報の表示属性を指定する情報を含むＵＩデータを表示した画面を示す図である。 本発明の第３の実施形態におけるＵＩ部品のラベル情報を複数含むＵＩデータを示す図である。 本発明の第３の実施形態におけるＵＩ部品のラベル情報の表示位置と優先順位の関係を示す図である。 本発明の第３の実施形態におけるＵＩ部品のラベル情報を複数含むＵＩデータを表示した画面を示す図である。 従来例におけるＵＩ部品のクラスを示す図である。 従来例におけるＵＩ部品のラベル情報を表示しようとするＵＩデータを示す図である。 従来例におけるＵＩ部品のラベル情報の表示しようとするＵＩデータを表示した画面を示す図である。

符号の説明

１１ バス
１２ ＣＰＵ
１３ ＲＯＭ
１４ ＲＡＭ
１５ ＶＲＡＭ
１６ 入力装置
１７ ネットワークＩ／Ｆ
１８ 出力装置

Claims (3)

1. 実際のＵＩに対応付けられる具体的なＵＩ記述から該ＵＩ記述の抽象度を高めた複数段階の抽象的なＵＩ記述までが抽象度の違いで段階的に階層化されたＵＩルールを保持する保持手段と、
   ＵＩ部品についての記述が行われた情報である複数のＵＩ部品指定情報を含むデータから、注目するＵＩ部品指定情報に相当する第１のＵＩ部品指定情報を取得する第１の取得手段と、
   前記ＵＩルールに基づいて、前記第１のＵＩ部品指定情報に対応する具体的なＵＩ記述である第１の具体的ＵＩのレイアウトを設定する設定手段と、
   前記第１のＵＩ部品指定情報の子要素に相当する第２のＵＩ部品指定情報があるか否かを判定する判定手段と、
   前記判定手段によって前記第２のＵＩ部品指定情報があると判定された場合、前記第２のＵＩ部品指定情報に対応する具体的なＵＩ記述である第２の具体的ＵＩを取得する第２の取得手段と、
   前記判定手段によって前記第２のＵＩ部品指定情報があると判定された場合、前記第２のＵＩ部品指定情報に含まれる情報であって、前記第２の具体的ＵＩの前記第１の具体的ＵＩに対する表示位置を特定するための表示位置情報を取得する第３の取得手段と、
   前記第２の具体的ＵＩと前記表示位置情報とが取得された場合、前記表示位置情報に従って、前記第２の具体的ＵＩを、前記設定手段によってレイアウトが設定された前記第１の具体的ＵＩに対する所定の位置にレイアウトするレイアウト手段とを有することを特徴とする情報処理装置。
2. 情報処理装置によって実行される情報処理方法であって、
   実際のＵＩに対応付けられる具体的なＵＩ記述から該ＵＩ記述の抽象度を高めた複数段階の抽象的なＵＩ記述までが抽象度の違いで段階的に階層化されたＵＩルールを保持手段において保持する保持ステップと、
   ＵＩ部品についての記述が行われた情報である複数のＵＩ部品指定情報を含むデータから、注目するＵＩ部品指定情報に相当する第１のＵＩ部品指定情報を取得する第１の取得ステップと、
   前記ＵＩルールに基づいて、前記第１のＵＩ部品指定情報に対応する具体的なＵＩ記述である第１の具体的ＵＩのレイアウトを設定する設定ステップと、
   前記第１のＵＩ部品指定情報の子要素に相当する第２のＵＩ部品指定情報があるか否かを判定する判定ステップと、
   前記判定ステップによって前記第２のＵＩ部品指定情報があると判定された場合、前記第２のＵＩ部品指定情報に対応する具体的なＵＩ記述である第２の具体的ＵＩを取得する第２の取得ステップと、
   前記判定ステップによって前記第２のＵＩ部品指定情報があると判定された場合、前記第２のＵＩ部品指定情報に含まれる情報であって、前記第２の具体的ＵＩの前記第１の具体的ＵＩに対する表示位置を特定するための表示位置情報を取得する第３の取得ステップと、
   前記第２の具体的ＵＩと前記表示位置情報とが取得された場合、前記表示位置情報に従って、前記第２の具体的ＵＩを、前記設定ステップによってレイアウトが設定された前記第１の具体的ＵＩに対する所定の位置にレイアウトするレイアウトステップとを有することを特徴とする情報処理方法。
3. 実際のＵＩに対応付けられる具体的なＵＩ記述から該ＵＩ記述の抽象度を高めた複数段階の抽象的なＵＩ記述までが抽象度の違いで段階的に階層化されたＵＩルールを保持手段において保持する保持ステップと、
   ＵＩ部品についての記述が行われた情報である複数のＵＩ部品指定情報を含むデータから、注目するＵＩ部品指定情報に相当する第１のＵＩ部品指定情報を取得する第１の取得ステップと、
   前記ＵＩルールに基づいて、前記第１のＵＩ部品指定情報に対応する具体的なＵＩ記述である第１の具体的ＵＩのレイアウトを設定する設定ステップと、
   前記第１のＵＩ部品指定情報の子要素に相当する第２のＵＩ部品指定情報があるか否かを判定する判定ステップと、
   前記判定ステップによって前記第２のＵＩ部品指定情報があると判定された場合、前記第２のＵＩ部品指定情報に対応する具体的なＵＩ記述である第２の具体的ＵＩを取得する第２の取得ステップと、
   前記判定ステップによって前記第２のＵＩ部品指定情報があると判定された場合、前記第２のＵＩ部品指定情報に含まれる情報であって、前記第２の具体的ＵＩの前記第１の具体的ＵＩに対する表示位置を特定するための表示位置情報を取得する第３の取得ステップと、
   前記第２の具体的ＵＩと前記表示位置情報とが取得された場合、前記表示位置情報に従って、前記第２の具体的ＵＩを、前記設定ステップによってレイアウトが設定された前記第１の具体的ＵＩに対する所定の位置にレイアウトするレイアウトステップとをコンピュータに実行させるためのプログラム。

Images