(19)【発行国】日本国特許庁(JP)
(12)【公報種別】特許公報(B2)
(11)【特許番号】
(24)【登録日】2024-10-17
(45)【発行日】2024-10-25
(54)【発明の名称】画面制御装置、画面制御方法及び画面制御プログラム
(51)【国際特許分類】
G06F 8/38 20180101AFI20241018BHJP
G06F 3/0484 20220101ALI20241018BHJP
【FI】
G06F8/38
G06F3/0484
(21)【出願番号】P 2023148840
(22)【出願日】2023-09-14
(62)【分割の表示】P 2022017004の分割
【原出願日】2022-02-07
【審査請求日】2023-09-14
(73)【特許権者】
【識別番号】395011562
【氏名又は名称】三菱電機ITソリューションズ株式会社
(74)【代理人】
【識別番号】110002491
【氏名又は名称】弁理士法人クロスボーダー特許事務所
(72)【発明者】
【氏名】安川 武史
【審査官】円子 英紀
(56)【参考文献】
【文献】特開2016-130123(JP,A)
【文献】国際公開第2015/071947(WO,A1)
【文献】特開2010-244223(JP,A)
【文献】特開2018-156405(JP,A)
(58)【調査した分野】(Int.Cl.,DB名)
G06F 8/00-8/38
G06F 8/60-8/77
G06F 9/44-9/445
G06F 9/451
G06F 3/048-3/04895
(57)【特許請求の範囲】
【請求項1】
ウェブアプリケーションのデータであるウェブデータであって、複数の操作項目を含む操作画面を1つの画像データにより表した画面データを表示するスクリプトを含むウェブデータを取得し、前記ウェブデータにより前記画面データを含むウェブページをウェブブラウザ上に表示する表示制御部と、
前記ウェブブラウザが動作するOS(Operating System)から操作のイベントを取得することにより、前記操作がされた前記画像データ上の位置である操作位置と前記操作の操作内容とを特定する操作特定部と、
前記操作特定部によって特定された前記操作位置から前記複数の操作項目のうちのどの操作項目に対する操作であるかを特定し、特定された操作項目と前記操作内容とに応じた処理を実行することにより、前記画面データを更新する画面更新部と
を備え、
前記表示制御部は、前記画面更新部によって更新された前記画面データを表示
し、
前記複数の操作項目には、テキストデータの入力欄を含まれ、
前記画面更新部は、前記操作位置が前記入力欄であり、かつ、前記操作内容が選択である場合には、前記操作画面における前記入力欄部分に丁度重畳させてテキストデータを入力可能な入力ボックスを表示し、前記入力ボックスからフォーカスが移動された場合には、前記入力ボックスを消去するとともに、前記操作画面における前記入力欄上に前記入力ボックスに入力されたテキストデータを重畳表示する画面制御装置。
【請求項2】
前記画面更新部は、前記操作位置及び前記操作内容に応じた処理を実行し、実行された処理の結果を反映して前記画面データを更新する
請求項1に記載の画面制御装置。
【請求項3】
前記画面制御装置は、さらに、
前記操作画面に対して入力された情報を、前記ウェブページのセッション情報とは別にメモリに記憶する記憶処理部
を備える請求項1に記載の画面制御装置。
【請求項4】
前記操作位置は、前記画面データの基準位置を原点とする座標値である
請求項1から
3までのいずれか1項に記載の画面制御装置。
【請求項5】
前記画面更新部は、前記操作位置及び前記操作内容によっては、外部サーバに処理を実行させ、前記外部サーバによって実行された処理の結果を反映して前記画面データを更新する
請求項1から
4までのいずれか1項に記載の画面制御装置。
【請求項6】
コンピュータが、ウェブアプリケーションのデータであるウェブデータであって、複数の操作項目を含む操作画面を1つの画像データにより表した画面データを表示するスクリプトを含むウェブデータを取得し、前記ウェブデータにより前記画面データを含むウェブページをウェブブラウザ上に表示し、
コンピュータが、前記ウェブブラウザが動作するOS(Operating System)から操作のイベントを取得することにより、前記操作がされた前記画像データ上の位置である操作位置と前記操作の操作内容とを特定し、
コンピュータが、特定された前記操作位置から前記複数の操作項目のうちのどの操作項目に対する操作であるかを特定し、特定された操作項目と前記操作内容とに応じた処理を実行することにより、前記画面データを更新し、
コンピュータが、更新された前記画面データを表示
し、
前記複数の操作項目には、テキストデータの入力欄を含まれ、
コンピュータが
、前記操作位置が前記入力欄であり、かつ、前記操作内容が選択である場合には、前記操作画面における前記入力欄部分に丁度重畳させてテキストデータを入力可能な入力ボックスを表示する処理を実行して前記画面データを更新し
、前記入力ボックスからフォーカスが移動された場合には、前記入力ボックスを消去するとともに、前記操作画面における前記入力欄上に前記入力ボックスに入力されたテキストデータを重畳表示する処理を実行して前記画面データを更新する画面制御方法。
【請求項7】
ウェブアプリケーションのデータであるウェブデータであって、複数の操作項目を含む操作画面を1つの画像データにより表した画面データを表示するスクリプトを含むウェブデータを取得し、前記ウェブデータにより前記画面データを含むウェブページをウェブブラウザ上に表示する表示制御処理と、
前記ウェブブラウザが動作するOS(Operating System)から操作のイベントを取得することにより、前記操作がされた前記画像データ上の位置である操作位置と前記操作の操作内容とを特定する操作特定処理と、
前記操作特定処理によって特定された前記操作位置から前記複数の操作項目のうちのどの操作項目に対する操作であるかを特定し、特定された操作項目と前記操作内容とに応じた処理を実行することにより、前記画面データを更新する画
面更新処理と
を行う画面制御装置としてコンピュータを機能させ、
前記表示制御処理では、前記画
面更新処理によって更新された前記画面データを表示
し、
前記複数の操作項目には、テキストデータの入力欄を含まれ、
前記画面更新処理では、前記操作位置が前記入力欄であり、かつ、前記操作内容が選択である場合には、前記操作画面における前記入力欄部分に丁度重畳させてテキストデータを入力可能な入力ボックスを表示し、前記入力ボックスからフォーカスが移動された場合には、前記入力ボックスを消去するとともに、前記操作画面における前記入力欄上に前記入力ボックスに入力されたテキストデータを重畳表示する画面制御プログラム。
【発明の詳細な説明】
【技術分野】
【0001】
本開示は、操作画面の制御に関する。
【背景技術】
【0002】
多くの企業等においてウェブアプリケーションの開発がされている。ウェブアプリケーションでは、HTMLとCSSとJavascript(登録商標)といったウェブ技術を用いて画面設計が行われる。HTMLは、HyperText Markup Languageの略である。CSSは、Cascading Style Sheetsの略である。特許文献1には、ウェブ画面の設計技術が記載されている。
ウェブアプリケーションは、ウェブブラウザに用意されたイベント機構から発生したイベントを契機に、サーバへの通信を行い、処理結果をウェブブラウザに再表示する。
【先行技術文献】
【特許文献】
【0003】
【文献】特開2012-243034号公報
【文献】特開2013-37420号公報
【文献】特開2019-16379号公報
【文献】特開2015-111414号公報
【発明の概要】
【発明が解決しようとする課題】
【0004】
ウェブ画面を設計するためには、ウェブ技術に関する高度な知識が要求される。そのため、デザインツール等を用いて簡便にウェブ画面の設計を行うことはできない。また、ウェブ技術に関する高度な知識を有していたとしても、ウェブ技術の制限の下でしかウェブ画面の設計を行うことができない。そのため、所望の表現を行うウェブ画面を構成できない場合がある。
本開示は、ウェブ画面等の操作画面を容易かつ柔軟に設計可能にすることを目的とする。
【課題を解決するための手段】
【0005】
本開示に係る画面制御装置は、
ウェブアプリケーションのデータであるウェブデータであって、複数の操作項目を含む操作画面を1つの画像データにより表した画面データを表示するスクリプトを含むウェブデータを取得し、前記ウェブデータにより前記画面データを含むウェブページをウェブブラウザ上に表示する表示制御部と、
前記ウェブブラウザが動作するOS(Operating System)から操作のイベントを取得することにより、前記操作がされた前記画像データ上の位置である操作位置と前記操作の操作内容とを特定する操作特定部と、
前記操作特定部によって特定された前記操作位置から前記複数の操作項目のうちのどの操作項目に対する操作であるかを特定し、特定された操作項目と前記操作内容とに応じた処理を実行することにより、前記画面データを更新する画面更新部と
を備え、
前記表示制御部は、前記画面更新部によって更新された前記画面データを表示する。
【発明の効果】
【0006】
本開示では、操作画面を示す画面データを1つの画像データによって表しつつ、操作位置及び操作内容に応じて画面データを更新することで操作画面に対する操作が実現される。操作画面が1つの画像データであるため、デザインツール等を用いて簡便に画面設計を行うことが可能である。また、操作画面には、ウェブ技術による制限はかからないため、柔軟に画面設計を行うことが可能である。
【図面の簡単な説明】
【0007】
【
図1】実施の形態1に係る画面制御システム1の構成図。
【
図2】実施の形態1に係る画面制御装置10の構成図。
【
図3】実施の形態1に係る画面制御装置10の処理の流れを示すフローチャート。
【
図4】実施の形態1に係る画面データ52の説明図。
【
図6】実施の形態1に係る画面更新処理の具体例の説明図。
【
図7】実施の形態1に係る画面更新処理の具体例の説明図。
【
図8】実施の形態1に係る画面更新処理の具体例の説明図。
【
図9】実施の形態2に係る画面制御装置10の処理の流れを示すフローチャート。
【
図10】実施の形態2に係る入力ボックス表示処理の説明図。
【
図11】実施の形態3に係る画面制御装置10の構成図。
【
図12】実施の形態3に係る画面制御装置10の処理の流れを示すフローチャート。
【発明を実施するための形態】
【0008】
実施の形態1.
実施の形態1では、画面制御装置10がウェブアプリケーションにおける操作画面の制御を行う例を説明する。つまり、実施の形態1では、画面制御装置10が制御する操作画面は、ウェブ画面又はウェブ画面の一部である。
【0009】
***構成の説明***
図1を参照して、実施の形態1に係る画面制御システム1の構成を説明する。
画面制御システム1は、画面制御装置10と、ウェブサーバ40とを備える。画面制御装置10とウェブサーバ40とは、伝送路41を介して接続されている。伝送路41は、具体例としては、インターネットである。
画面制御装置10は、ウェブアプリケーションを使用する利用者によって使用されるPC等のコンピュータである。PCは、Personal Computerの略である。ウェブサーバ40は、画面制御装置10からの要求に従い、ウェブアプリケーションの情報を画面制御装置10に送信するサーバ等のコンピュータである。
【0010】
図2を参照して、実施の形態1に係る画面制御装置10の構成を説明する。
画面制御装置10は、プロセッサ11と、メモリ12と、ストレージ13と、通信インタフェース14とのハードウェアを備える。プロセッサ11は、信号線を介して他のハードウェアと接続され、これら他のハードウェアを制御する。
【0011】
プロセッサ11は、プロセッシングを行うICである。ICはIntegrated Circuitの略である。プロセッサ11は、具体例としては、CPU、DSP、GPUである。CPUは、Central Processing Unitの略である。DSPは、Digital Signal Processorの略である。GPUは、Graphics Processing Unitの略である。
【0012】
メモリ12は、データを一時的に記憶する記憶装置である。メモリ12は、具体例としては、SRAM、DRAMである。SRAMは、Static Random Access Memoryの略である。DRAMは、Dynamic Random Access Memoryの略である。
【0013】
ストレージ13は、データを保管する記憶装置である。ストレージ13は、具体例としては、HDDである。HDDは、Hard Disk Driveの略である。また、ストレージ13は、SD(登録商標)メモリカード、CompactFlash(登録商標)、NANDフラッシュ、フレキシブルディスク、光ディスク、コンパクトディスク、Blu-ray(登録商標)ディスク、DVDといった可搬記録媒体であってもよい。SDは、Secure Digitalの略である。DVDは、Digital Versatile Diskの略である。
【0014】
通信インタフェース14は、外部の装置と通信するためのインタフェースである。通信インタフェース14は、具体例としては、Ethernet(登録商標)、USB、HDMI(登録商標)のポートである。USBは、Universal Serial Busの略である。HDMIは、High-Definition Multimedia Interfaceの略である。
画面制御装置10は、通信インタフェース14を介して表示装置15と接続されている。
【0015】
画面制御装置10は、機能構成要素として、表示制御部21と、操作特定部22と、画面更新部23とを備える。画面制御装置10の各機能構成要素の機能はソフトウェアにより実現される。
ストレージ13には、画面制御装置10の各機能構成要素の機能を実現するプログラムが格納されている。このプログラムは、プロセッサ11によりメモリ12に読み込まれ、プロセッサ11によって実行される。これにより、画面制御装置10の各機能構成要素の機能が実現される。
【0016】
図2では、プロセッサ11は、1つだけ示されていた。しかし、プロセッサ11は、複数であってもよく、複数のプロセッサ11が、各機能を実現するプログラムを連携して実行してもよい。
【0017】
***動作の説明***
図3から
図8を参照して、実施の形態1に係る画面制御装置10の動作を説明する。
実施の形態1に係る画面制御装置10の動作手順は、実施の形態1に係る画面制御方法に相当する。また、実施の形態1に係る画面制御装置10の動作を実現するプログラムは、実施の形態1に係る画面制御プログラムに相当する。
【0018】
図3を参照して、実施の形態1に係る画面制御装置10の処理の流れを説明する。
(ステップS1:画面表示処理)
表示制御部21は、ウェブアプリケーションの初期画面51を表示装置15に表示する。
具体的には、表示制御部21は、ウェブサーバ40からウェブアプリケーションの初期画面51のデータを取得する。そして、表示制御部21は、取得されたデータに基づき、初期画面51をウェブブラウザに表示する。この際、表示制御部21は、初期画面51のデータとともに、後述する制御情報31も取得する。
【0019】
図4に示すように、初期画面51には、利用者によって操作される操作画面を表す画面データ52が含まれる。初期画面51全体が画面データ52であってもよいし、初期画面51の一部が画面データ52であってもよい。画面データ52には、入力欄とボタンといった、利用者によって操作される複数の操作項目が含まれる。
初期画面51は、ウェブアプリケーションであるため、HTML等のウェブ技術を用いて構成されている。これに対して、画面データ52は、1つの画像データにより表される。初期画面51は、HTML等のウェブ技術を用いて構成されプログラムコードの中に、画面データ52を表示するスクリプトが含まれている。このスクリプトは、単純に画面データ52を読み出して表示するプログラムコードである。
【0020】
その後、利用者によって画面データ52に対する操作が行われる。例えば、以下のような操作が行われる。入力欄をクリックする等して、入力欄が選択される。また、入力欄が選択された状態でキーボード等により情報が入力される。あるいは、ボタンがクリックされる。
【0021】
(ステップS2:操作特定処理)
操作特定部22は、画面データ52に対する操作の操作位置及び操作内容を特定する。
具体的には、操作特定部22は、OSから操作のイベントを取得することにより、操作位置及び操作内容を特定する。OSは、Operating Systemの略である。例えば、操作特定部22は、カーソルの移動のイベントと、マウス等のボタンがクリックされたイベントと、キーボード入力がされたイベント等を取得する。これにより、操作特定部22は、カーソルの位置と、入力された情報とを特定する。カーソルの位置は、操作位置であり、入力された情報は、操作内容である。入力された情報とは、マウスの左ボタ
ンのクリックと、キーボードの“r”キーの入力といった情報である。
この際、操作特定部22は、画面データ52の基準位置を原点とする座標値を操作位置として特定する。基準位置は、例えば、画面データ52の左上の位置である。これにより、画面データ52のどの位置で操作がされたかを特定可能である。
【0022】
(ステップS3:画面更新処理)
画面更新部23は、ステップS2で特定された操作位置及び操作内容に応じて、画面データ52を更新する。この際、画面更新部23は、操作位置及び操作内容によっては、操作位置及び操作内容に応じた処理を実行する。そして、画面更新部23は、実行された処理の結果を反映して画面データ52を更新する。
ステップS1の処理では、初期画面51のデータとともに、制御情報31が取得されている。
図5に示すように、制御情報31は、画面データ52における各操作項目について、領域32と、操作内容毎の処理33と等を示す。画面更新部23は、操作位置と領域32とを比較することにより、画面データ52におけるどの操作項目について操作がされたかを特定する。そして、画面更新部23は、特定された操作項目における操作内容に対応する処理33を実行することにより、画面データ52を更新する。
【0023】
例えば、カーソルがチェックボタンの上に移動されたとする。つまり、操作位置がチェックボタンであり、操作内容がカーソルが当てられたことである。
この場合には、
図6に示すように、画面更新部23は、チェックボタンの色を変更して、画面データ52を更新する。これにより、チェックボタンが選択されていることが分かる状態に画面データ52が更新される。
【0024】
また、例えば、会社コードの入力欄にフォーカスが当てられたとする。つまり、操作位置が会社コードの入力欄であり、操作内容がフォーカスが当てられたことである。フォーカスが当てられたとは、入力欄がクリックされる等して選択されるという操作内容に相当する。
この場合には、
図7に示すように、画面更新部23は、会社コードの入力欄の中に入力カーソルを表示して、画面データ52を更新する。これにより、入力欄にテキストデータを入力可能であることが分かる状態に画面データ52が更新される。
【0025】
また、例えば、会社コードの検索ボタンがクリックされたとする。つまり、操作位置が会社コードの検索ボタンであり、操作内容がクリックである。
この場合には、画面更新部23は、会社コードの入力欄に入力された情報をキーワードとして、会社名等を検索する処理を実行する。そして、
図8に示すように、画面更新部23は、検索された会社名等を会社名等の入力欄に表示した状態に画面データ52を更新する。
【0026】
この際、画面更新部23は、操作位置及び操作内容によっては、ウェブサーバ40等の外部サーバに処理を実行させてもよい。つまり、画面データ52における特定の操作項目について特定の操作がされた場合には、画面更新部23は外部サーバに処理をさせてもよい。具体的には、処理負荷の高い処理を実行する必要がある場合には、画面更新部23は、外部サーバに処理を実行させることが考えられる。例えば、カメラのストリーム画像と、動画と、静止画と、三次元立体モデルといったデータに関する処理は外部サーバに実行させることが考えられる。
外部サーバに実行されるか否かについても、
図5に示す処理の欄に設定しておけばよい。
【0027】
(ステップS4:表示制御処理)
表示制御部21は、ステップS3で更新された画面データ52を表示装置15に表示す
る。ここでは、表示制御部21は、更新された画面データ52をウェブブラウザに表示する。これにより、利用者によって行われた画面データ52に対する操作が反映された画面データ52が表示される。
【0028】
その後、処理がステップS2に戻される。そして、ステップS2からステップS4の処理が繰り返し実行される。これにより、利用者は、1つの画像データによって表された画面データ52である操作画面を、ウェブ技術等を用いて構成された操作画面と同様に操作することが可能である。
なお制御情報31には操作項目として、例えば宣伝用の動画や監視カメラと連動した動画等を表示させる領域も設定できる。動画を表示する場合は、例えば60回/秒単位で画面が更新され、再描画がされるが、ステップS3からステップS4で説明した処理はそれらの再描画とは非連動で実行される。
【0029】
ここで、画面データ52は、1つの画像データである。そのため、画面データ52に対する操作を行った場合にウェブブラウザが発生させるイベントは、画面データ52全体に対するイベントになる。
図4を参照して具体的に説明する。画面データ52には複数の入力欄及びボタンが示されている。画面データ52に含まれるいずれかのボタンがクリックされたとする。この場合には、ウェブブラウザが発生させるイベントは、クリックされたボタンに対するイベントではなく、画面データ52全体に対するイベントになる。つまり、ウェブブラウザとしては、ボタンがクリックされたのではなく、画面データ52がクリックされたと認識することになる。
そこで、操作特定部22は、ウェブブラウザが発生させるイベントを用いず、操作位置及び操作内容を用いる。これにより、利用者によって行われた操作を正しく特定することができる。
【0030】
***実施の形態1の効果***
以上のように、実施の形態1に係る画面制御装置10は、操作画面を示す画面データ52を1つの画像データによって表す。そして、画面制御装置10は、操作位置及び操作内容に応じて画面データ52を更新することで操作画面に対する操作を実現する。
操作画面が1つの画像データであるため、デザインツール等を用いて簡便に画面設計を行うことが可能である。また、操作画面には、ウェブ技術による制限はかからないため、柔軟に画面設計を行うことが可能である。つまり、HTMLのタグ等を意識することなく、自由に操作画面を描画して作成することができる。そのため、ウェブ技術等に精通していない者でも、容易に画面設計を行うことが可能である。
【0031】
実施の形態1に係る画面制御装置10は、1つの画像データである画面データ52に対する操作を、操作位置に応じて画面データ52における操作項目に対する処理に変換する。そのため、各処理33の開発の際に、画面データ52が1つの画像データであることを意識する必要はない。
【0032】
実施の形態1に係る画面制御装置10では、画面データ52をウェブアプリケーションに埋め込むには、画面データ52を表示するスクリプトを記述するだけでよい。そのため、任意のウェブアプリケーションに容易に画面データ52を埋め込むことができる。そして、画面データ52の埋め込みには、ウェブブラウザに専用のプラグインを導入する必要性がない。つまり、プラグインを導入することなく、ネイティブアプリケーションに近い操作性のウェブアプリケーションを実現することができる。
【0033】
HTMLでシステムを開発する場合には、利用者の操作に対してリアルタイムに反応を返す構成にするには専門知識が必要である。しかし、画面データ52の制御を実現する処
理33のプログラムは、Python(登録商標)とJava(登録商標)とC++といった一般的な言語により開発できる。そのため、専門知識のないプログラマによってもウェブアプリケーションを開発することが可能になる。
また、既存のウェブアプリケーションの画面デザインを一新したい場合等にも実施の形態1に係る画面制御装置10では、初期画面51に新たな画面デザインである画面データ52に含むことで実現できる。既存のウェブアプリケーションの元々の画面デザインをHTMLで変更する必要がないため、既存のウェブアプリケーションの有効利用が図れる。
【0034】
画面データ52は画像データである。そして、画面データ52に表示された文字等は、画像データの一部である。そのため、画面データ52に表示された文字等は原則としてクリップボードにコピーすることはできない。したがって、画面データ52に表示された情報の持ち出しを防止できる。
なお、処理33として文字列等をクリップボードにコピーする機能を実現することも可能である。
【0035】
画面データ52は画像データである。そのため、OS及びブラウザに依存しないインタフェースを実現可能である。
【0036】
***他の構成***
<変形例1>
実施の形態1では、
図3のステップS1で初期画面51のデータと制御情報31とがウェブサーバ40から取得された。実施の形態1では、ウェブサーバ40から取得された初期画面51のデータには、画面データ52が含まれているものとしていた。
しかし、画面データ52及び制御情報31は、ウェブサーバ40以外の他サーバから取得される構成にしてもよい。つまり、ウェブサーバ40からは、画面データ52を除く初期画面51のデータが取得され、画面データ52及び制御情報31はウェブサーバ40以外の他サーバから取得されてもよい。
例えば、ウェブサーバ40をクラウドにより実現し、他サーバを社内のオンプレミス環境に設置されたサーバとすることが考えられる。これにより、社内のネットワークに接続されていない場合には、ウェブアプリケーションのうち画面データ52部分以外だけを利用できる状態になる。そして、社内のネットワークに接続されている場合に限り、画面データ52部分を利用できるようになる。このように構成することで、クラウドに配置できないデータを活用しながら、クラウドを利用したウェブアプリケーションを活用することができる。
【0037】
<変形例2>
実施の形態1では、画面制御装置10の機能構成要素である表示制御部21と操作特定部22と画面更新部23とを実現するプログラムは、ストレージ13に記憶されているとした。しかし、画面制御装置10の機能構成要素を実現するプログラムは、初期画面51のデータの取得の前処理でウェブサーバ40から取得されてもよい。
例えば、画面制御装置10がウェブアプリケーションを使用するために、ウェブサーバ40にアクセスすると、画面制御装置10の機能構成要素を実現するプログラムがダウンロードされるようにしてもよい。
【0038】
<変形例3>
実施の形態1では、画面制御装置10がウェブアプリケーションにおける操作画面の制御を行う例を説明した。しかし、実施の形態1で説明した技術は、ウェブアプリケーション以外の操作画面の制御を行う場合にも適用可能である。例えば、スマートフォンのアプリケーションにおいて、一部の操作画面を画面データ52によって実装するといったことが考えられる。
【0039】
実施の形態2.
実施の形態2では、画面データ52におけるテキストデータの入力欄の制御について説明する。実施の形態2では、実施の形態1と異なる点について説明し、同一の点については説明を省略する。
【0040】
***動作の説明***
図9及び
図10を参照して、実施の形態2に係る画面制御装置10の動作を説明する。
実施の形態2に係る画面制御装置10の動作手順は、実施の形態2に係る画面制御方法に相当する。また、実施の形態2に係る画面制御装置10の動作を実現するプログラムは、実施の形態2に係る画面制御プログラムに相当する。
【0041】
図9を参照して、実施の形態2に係る画面制御装置10の処理の流れを説明する。
図9に示す処理は、会社コードの入力欄のようなテキストデータの入力欄が選択された場合に実行される。つまり、
図9に示す処理は、
図3のステップS2において、操作位置がテキストデータの入力欄であり、操作内容がフォーカスが当てられたことである場合に実行される。以下の説明ではフォーカスが当てられた入力欄を対象の入力欄と呼ぶ。
ステップS11及びステップS13の処理は、
図3のステップS3からステップS4の処理に相当する。ステップS12の処理は、
図3のステップS2の処理に相当する。
【0042】
(ステップS11:入力ボックス表示処理)
図10に示すように、表示制御部21は、対象の入力欄にテキストデータを入力可能な入力ボックス53を重畳表示する。入力ボックス53は、画像データではなく、ウェブ技術等を用いて構成されたテキストデータを入力可能な部品である。具体例としては、入力ボックス53は、HTMLのinputタグを用いて構成されたテキストボックスである。
図10では、一見すると
図4とほとんど変わっていない。しかし、
図4では対象の入力欄である会社コードの入力欄は画面データ52を構成する画像データの一部であった。しかし、
図10では、会社コードの入力欄は、画面データ52の上に表示された入力ボックス53になっている。
【0043】
対象の入力欄に入力ボックス53が重畳表示された。そのため、対象の入力欄にテキストデータを入力することが可能な状態になる。つまり、操作特定部22及び画面更新部23の動作なしに、入力ボックス53の機能としてテキストデータの入力を受け付け、入力ボックス53内に表示する処理が実現される。また、日本語の漢字変換等のテキストデータの入力に付随した機能も、入力ボックス53の機能として実現される。
【0044】
(ステップS12:フォーカス移動判定処理)
操作特定部22は、入力ボックス53への入力が終了したか否かを判定する。
具体的には、操作特定部22は、入力ボックス53からフォーカスが移動されたか否かを判定する。マウスで入力ボックス53以外の場所がクリックされる、タブキーが入力されるといった操作がされると、入力ボックス53からフォーカスが移動される。操作特定部22は、これらの操作がされたか否かを判定する。
操作特定部22は、入力ボックス53からフォーカスが移動された場合には、処理をステップS13に進める。一方、操作特定部22は、入力ボックス53からフォーカスが移動されていない場合には、再び処理をステップS12に戻す。
【0045】
(ステップS13:更新画像生成処理)
画面更新部23は、入力ボックス53を表示対象から除外する。(入力ボックス53を消去する)。これと同時に、画面更新部23は、フォーカスが移動された際に入力ボック
ス53に入力されていたテキストデータを、画面データ52における対象の入力欄上に表示して、画面データ52を更新する。そして、表示制御部21は、更新された画面データ52を表示装置15に表示する。
これにより、画面データ52における対象の入力欄に、画面データ52の一部として入力ボックス53に入力されていたテキストデータが表示された状態になる。
【0046】
***実施の形態2の効果***
以上のように、実施の形態2に係る画面制御装置10は、フォーカスが当てられた入力欄に、テキストデータを入力可能な入力ボックス53を重畳表示する。これにより、操作特定部22及び画面更新部23の動作なしに、テキストデータの入力が可能になる。
【0047】
操作特定部22及び画面更新部23によって入力欄へのテキストデータの入力を実現するとする。この場合には、操作特定部22が入力された文字を特定し、画面更新部23が入力された文字を入力欄の中に表示して画面データ52を更新するという処理を繰り返し実行する必要がある。しかし、入力欄に入力ボックス53を重畳表示することにより、この処理を実装する必要がない。
特に日本語の漢字変換が必要な入力欄については、非常に煩雑な画面データ52の更新処理が発生する。しかし、この煩雑な画面データ52の更新処理も実装する必要がない。
【0048】
実施の形態3.
実施の形態3では、入力されたデータの記憶方法を説明する。実施の形態3では、実施の形態1,2と異なる点について説明し、同一の点については説明を省略する。
【0049】
***構成の説明***
図11を参照して、実施の形態3に係る画面制御装置10の構成を説明する。
画面制御装置10は、機能構成要素として、記憶処理部24を備える点が
図2に示す画面制御装置10と異なる。
【0050】
***動作の説明***
図12を参照して、実施の形態3に係る画面制御装置10の処理の流れを説明する。
図12に示す処理は、入力欄に情報が入力され、ウェブサーバ40に情報が送信される処理を示す。ここでは、実施の形態2で説明した入力ボックス53にテキストデータが入力された例を説明する。但し、入力される情報はテキストデータに限るものではない。
ステップS21からステップS23の処理は、
図9のステップS11からステップS13の処理と同じであるため説明を省略する。ステップS24及びステップS27の処理は、
図3の処理のバックグラウンドで実行される処理である。ステップS25の処理は、
図3のステップS2からステップS4の処理に相当する。ステップS26の処理は、
図3のステップS2の処理に相当する。
【0051】
(ステップS24:一時記憶処理)
記憶処理部24は、フォーカスが移動された際に入力ボックス53に入力されていたテキストデータをメモリ12に書き込む。この際、記憶処理部24は、ウェブアプリケーションにおけるセッション情報とは別に、情報をメモリ12に記憶する。
【0052】
(ステップS25:任意処理)
任意の処理が実行される。任意の処理には、ステップS21からステップS24の処理も含まれる。
【0053】
(ステップS26:更新判定処理)
操作特定部22は、更新ボタンがクリックされたか否かを判定する。つまり、操作特定
部22は、操作位置が更新ボタンであり、操作内容がクリックであるか否かを判定する。ここでは、更新ボタンは、ウェブサーバ40にデータを送信する処理33を指示するボタンである。
操作特定部22は、更新ボタンがクリックされた場合には、処理をステップS27に進める。一方、更新ボタンがクリックされていない場合には、処理がステップS25に戻される。
【0054】
(ステップS27:情報送信処理)
記憶処理部24は、ステップS22でメモリ12に書き込まれた情報を読み出す。そして、記憶処理部24は、情報をウェブサーバ40に送信する。これにより、ウェブサーバ40が入力欄に入力された情報を取得する。
【0055】
***実施の形態3の効果***
以上のように、実施の形態3に係る画面制御装置10は、入力欄からフォーカスが移動すると、入力欄に入力された情報をセッション情報とは別にメモリ12に記憶する。
これにより、ウェブサーバ40との通信が失敗した場合であっても、入力欄に入力された情報を保持しておくことが可能である。そして、後にウェブサーバ40との通信が復旧した際に、入力欄に入力された情報を利用してウェブアプリケーションの処理を続行可能である。また、セッションタイムアウトにより入力欄に入力された情報が破棄されてしまうことがない。そのため、例えば、画面制御装置10を数時間スリープさせても、後に入力欄に入力された情報を利用してウェブアプリケーションの処理を続行可能である。
また、複数のブラウザを利用することによる攻撃、又は、セッションハイジャック攻撃により、情報が漏洩することの防止にもつながる。
【0056】
また、以上の説明における「部」を、「回路」、「工程」、「手順」、「処理」又は「処理回路」に読み替えてもよい。
【0057】
以上、本開示の実施の形態及び変形例について説明した。これらの実施の形態及び変形例のうち、いくつかを組み合わせて実施してもよい。また、いずれか1つ又はいくつかを部分的に実施してもよい。なお、本開示は、以上の実施の形態及び変形例に限定されるものではなく、必要に応じて種々の変更が可能である。
【0058】
以上をまとめると、以下のようになる。
本開示に係る画面制御装置は、
操作画面を1つの画像データにより表した画面データを表示する表示制御部と、
前記画面データに対する操作の操作位置及び操作内容を特定する操作特定部と、
前記操作特定部によって特定された前記操作位置及び前記操作内容に応じて、前記画面データを更新する画面更新部と
を備え、
前記表示制御部は、前記画面更新部によって更新された前記画面データを表示する。
【0059】
前記画面更新部は、前記操作位置及び前記操作内容に応じた処理を実行し、実行された処理の結果を反映して前記画面データを更新する。
【0060】
前記画面データには、テキストデータの入力欄が含まれており、
前記画面更新部は、前記操作位置が前記入力前記操作画面に対して欄であり、かつ、前記操作内容が選択である場合には、前記入力欄にテキストデータを入力可能な入力ボックスを重畳表示する。
【0061】
前記画面更新部は、前記入力ボックスへの入力が終了すると、前記入力ボックスを消去し、前記入力ボックスに入力されたテキストデータを前記入力欄上に表示した状態に前記画面データを更新する。
【0062】
前記表示制御部は、ウェブページの少なくとも一部として前記画面データをウェブブラウザ上に表示する。
【0063】
前記画面制御装置は、さらに、
前記操作画面に対して入力された情報を、前記ウェブページのセッション情報とは別にメモリに記憶する記憶処理部
を備える。
【0064】
前記操作位置は、前記画面データの基準位置を原点とする座標値である。
【0065】
前記画面更新部は、前記操作位置及び前記操作内容によっては、外部サーバに処理を実行させ、前記外部サーバによって実行された処理の結果を反映して前記画面データを更新する。
【0066】
本開示に係る画面制御方法は、
コンピュータが、操作画面を1つの画像データにより表した画面データを表示し、
コンピュータが、前記画面データに対する操作の操作位置及び操作内容を特定し、
コンピュータが、特定された前記操作位置及び前記操作内容に応じて、前記画面データを更新し、
コンピュータが、更新された前記画面データを表示する。
【0067】
本開示に係る画面制御プログラムは、
操作画面を1つの画像データにより表した画面データを表示する表示制御処理と、
前記画面データに対する操作の操作位置及び操作内容を特定する操作特定処理と、
前記操作特定処理によって特定された前記操作位置及び前記操作内容に応じて、前記画面データを更新する画像更新処理と
を行う画面制御装置としてコンピュータを機能させ、
前記表示制御処理では、前記画像更新処理によって更新された前記画面データを表示する。
【符号の説明】
【0068】
10 画面制御装置、11 プロセッサ、12 メモリ、13 ストレージ、14 通信インタフェース、15 表示装置、21 表示制御部、22 操作特定部、23 画面更新部、24 記憶処理部、31 制御情報、32 領域、33 処理、40 ウェブサーバ、41 伝送路、51 初期画面、52 画面データ、53 入力ボックス。