[發明專利]一種基于瀏覽器擴展的跨平臺GUI快速原型開發方法

無效

• 申請號: 201110454183.0
• 申請日: 2011-12-30
• 公開（公告）號: CN102455914A
• 公開（公告）日: 2012-05-16
• 發明（設計）人: 王耀龍
• 申請（專利權）人: 四川長虹電器股份有限公司
• 主分類號: G06F9/44
• 分類號: G06F9/44
• 代理公司: 成都九鼎天元知識產權代理有限公司 51214
• 代理人: 徐宏;吳彥峰

技術領域

本發明涉及跨操作系統平臺應用程序GUI界面快速原型開發的設計實現技術。

背景技術

GUI是現代計算機軟件的主要人機界面，由于操作系統平臺的多樣性和不同圖形庫、編程語言、開發框架的異構分散性，形成了多種GUI開發技術并存、不統一的格局。HTML超文本標記語言和瀏覽器技術的興起，給圖形界面應用帶來了新的發展階段，以XML結合腳本語言的方式開發GUI軟件正逐漸成為一種主流。

現代GUI應用程序的核心組成通常以各種控件形成的工具欄、菜單欄的形式出現，不同的應用開發平臺和操作系統環境提供的開發框架都各不相同。對快速原型的應用開發者來說，學習多種編程接口、使GUI軟件得以跨平臺無疑具有一定的難度。

發明內容

本發明的目的是針對現有的GUI開發方法不統一、初學者難以掌握的缺陷，提供一基于瀏覽器擴展的跨平臺GUI快速原型開發方法。

本發明采用的技術方案是這樣的：一種基于瀏覽器擴展的跨平臺GUI快速原型開發方法，包括：

步驟1：啟動原始軟件部分，調用當前系統的基本圖形設備接口初始化瀏覽器核心引擎，并為瀏覽器引擎注冊GUI事件消息循環；

步驟2：利用HTML構造用于繪制控件的控件區域；

步驟3：利用HTML或XML定義控件；

步驟4：利用JavaScript?Native語言在所述控件上定義擴展對象方法。

優選地，在步驟4中，利用JavaScript?Native語言調用原始軟件的程序接口實現控件上的對象方法定義。

優選地，還包括利用CSS為控件添加背景圖片、設置控件上文字標識以及設定控件寬高的步驟。

綜上所述，由于采用了上述技術方案，本發明的有益效果是：

本方法開發出來的GUI可以在各種操作系統上使用；統一了GUI開發風格；最大程度上利用了HTML/XML/CSS/JavaScript的既有成熟技術和先進的內容布局面、樣式風格面、應用邏輯面相互分離獨立的架構，GUI原型開發速度大大提高。

具體實施方式

本說明書中公開的所有特征，或公開的所有方法或過程中的步驟，除了互相排斥的特征和/或步驟以外，均可以以任何方式組合。

本說明書（包括任何附加權利要求、摘要）中公開的任一特征，除非特別敘述，均可被其他等效或具有類似目的的替代特征加以替換。即，除非特別敘述，每個特征只是一系列等效或類似特征中的一個例子而已。

當原始軟件基本功能實現之后，為其增添GUI控件接口，形成一用戶界面友好的原型，其界面可劃分為兩部分：需要添加的控件GUI區域和原有文檔內容區域。文檔內容區域可以存在，也可能不存在（不存在的情況即原始軟件沒有任何GUI部分）。

首先，啟動原始軟件部分，調用當前系統的基本圖形設備接口初始化瀏覽器核心引擎，并為瀏覽器引擎注冊GUI事件消息循環；

然后，利用HTML構造用于繪制控件的控件區域；利用HTML或XML定義控件；利用JavaScript?Native語言在所述控件上定義擴展對象方法。

其中，利用JavaScript?Native語言在所述控件上定義方法的具體做法是利用JavaScript?Native語言調用原始軟件的程序接口。當頁面控件區域的用戶事件如鼠標點擊、鍵盤按鍵發生時，頁面的JavaScript腳本調用對應的JavaScript擴展對象方法，進而調用原始軟件的程序接口，完成控件的控制和交互功能。

?為了使控件更加美觀，還可以利用CSS細化控件外觀，為控件添加背景圖片、設置控件上文字標識以及設定控件寬高。

進一步舉例說明本發明中定義控件的步驟，以單行多列控件欄為例，控件依次為按鈕1、按鈕2、輸入框，則其HTML可寫為：

<table>

??????<tr>

???????????<td>

?????????????????<button??id?=?“controlButton1”>?..?</button>

???????????</td>

???????????<td>

?????????????????<button??id?=?“controlButton2”>?..?</button>