一種手機客戶端應(yīng)用程序的開發(fā)方法【專利說明】[
技術(shù)領(lǐng)域：
][0001]本發(fā)明涉及手機客戶端應(yīng)用程序，尤其涉及一種手機客戶端應(yīng)用程序的開發(fā)方法。[【
背景技術(shù)：
】][0002]現(xiàn)在，智能手機已全面普及，智能手機使用得最多的有四大系統(tǒng)，S卩Sym手機客戶端應(yīng)用程序的開發(fā)方法ian、WP7、10S和Android，不同系統(tǒng)的應(yīng)用軟件互不兼容。所以，不同系統(tǒng)的手機需要開發(fā)不同的手機客戶端，這就造成的重復開發(fā)；同時每次發(fā)布新的APP都需要用戶重新下載客戶端，這不僅拖慢整個開發(fā)進度，同時也會給用戶帶來不良的體驗。[【
發(fā)明內(nèi)容】][0003]本發(fā)明要解決的技術(shù)問題是提供一種開發(fā)周期短、程序兼容性好、無須用戶下載更新客戶端的手機客戶端應(yīng)用程序的開發(fā)方法。[0004]為了解決上述技術(shù)問題，本發(fā)明采用的技術(shù)方案是，一種手機客戶端應(yīng)用程序的開發(fā)方法，包括以下步驟:[0005]101、使用HTML5做出網(wǎng)頁框架；[0006]102、使用CSS3修飾網(wǎng)頁頁面；[0007]103、使用JQuery或者Javascript框架，使網(wǎng)頁靜態(tài)界面具有動態(tài)功能，能夠與用戶進行交互；[0008]104、將步驟103制作的網(wǎng)頁嵌入到手機APP的框架中，進行調(diào)試，使不同手機系統(tǒng)的APP都能夠嵌入網(wǎng)頁并正常顯示。[0009]以上所述的手機客戶端應(yīng)用程序的開發(fā)方法，在步驟101中，調(diào)整網(wǎng)頁的表單、文字和圖片的位置，并在不同的手機系統(tǒng)上測試兼容性并進行調(diào)整。[0010]以上所述的手機客戶端應(yīng)用程序的開發(fā)方法，在步驟102中，使用CSS3修飾網(wǎng)頁的顏色和動態(tài)效果。[0011]本發(fā)明手機客戶端的應(yīng)用程序開發(fā)周期短、程序兼容性好、程序可以存儲在服務(wù)器中，每次加載都是從服務(wù)器獲取最新的版本，無須用戶下載更新客戶端。[【附圖說明】][0012]下面結(jié)合附圖和【具體實施方式】對本發(fā)明作進一步詳細的說明。[0013]圖1是本發(fā)明實施例手機客戶端應(yīng)用程序的開發(fā)方法的流程圖。[【具體實施方式】][0014]本發(fā)明實施例手機客戶端應(yīng)用程序的開發(fā)方法的流程如圖1所示，包括以下步驟:[0015]1、使用HTML5做出網(wǎng)頁框架，調(diào)整網(wǎng)頁的表單、文字和圖片的位置，并在不同的手機系統(tǒng)上測試兼容性并進行調(diào)整。具體操作如下:[0016]I)搭建:使用html5的div、table、span等標簽，借助DreamWeaver網(wǎng)頁前端開發(fā)工具，將需要展示內(nèi)容框架搭建起來。同時可以借用當前主流的框架如:bootstrap、jqueryMobiIe，搭建出展示效果更好的網(wǎng)頁框架。確定整個網(wǎng)頁的框架后，同樣可以借助DreamWeaver調(diào)整元素之間的距離。此時也可以確定圖片的尺寸和大小，讓美工同步進行項目開發(fā)。[0017]2)兼容性:HTML5完美支持IE9及以上、谷歌、火狐等主流瀏覽但國內(nèi)還是有很多用戶使用IE8及以下瀏覽器，如果需要將開發(fā)的項目運行在PC端，就需要做兼容性的測試，例如IE6的div垂直居中問題，需要將行距增加到和整個div—樣高，然后插入文字；div中margin距離加倍問題，需要在div中加入display:none。在調(diào)試工具上我們可以選擇IETest工具。[0018]2、使用CSS3修飾頁面的顏色、動態(tài)效果，使頁面看起來美觀，抓住用戶的眼球。具體操作如下:[0019]I)樣式生成:CSS即層疊樣式表，在網(wǎng)頁制作時采用層疊樣式表技術(shù)，可以對頁面的字體、布局以及其它效果實現(xiàn)更加精確的控制；同時CSS3是CSS的升級版本，CSS3語言開發(fā)是朝著模塊化發(fā)展的，包括盒子模型、列表模型、語言模塊、背景和邊框等?？梢允褂矛F(xiàn)有成熟的框架進行生成，如:CSS3Marker?？稍诰€演示漸變、陰影、旋轉(zhuǎn)、動畫等多種效果，并且能生成對應(yīng)效果的代碼。[0020]2)兼容性調(diào)整:可以使用DreamWeaver進行顏色、背景、布局的調(diào)整，也可以使用谷歌、火狐瀏覽器進行調(diào)試，點擊F12即可進入調(diào)試界面。[0021]3、使用JQuery或者Javascript框架，使靜態(tài)界面富有動態(tài)性，可以與用戶進行交互。具體操作如下:?0022]I)引入類庫:推薦使用JQuery，JQuery是一個兼容多瀏覽器的javascript庫，全球目前55%的前端開發(fā)人員在使用，并且它是免費和開源的。jQuery可以操作文檔對象、選擇DOM元素、制作動畫效果、事件處理等。當然如果沒有接觸過JQuery可以使用原生態(tài)的javascript，在引入類庫時，我們可以借助新浪、百度等⑶N上已經(jīng)存在的資源，這樣在用戶加載類庫時更快。[0023]2)使用插件:javascript提供了很多插件，如官方的JqueryUI。可以借助它實現(xiàn)Ajax輔助、數(shù)據(jù)表格、動態(tài)列表、XML工具、cookie處理操作。進一步將用戶體驗提升一個高度。[0024]4、將步驟3制作的網(wǎng)頁嵌入到手機APP的框架中，進行調(diào)試，使不同手機系統(tǒng)的APP都能夠嵌入網(wǎng)頁并正常顯示，具體操作如下:[0025]I)方法一:安卓、蘋果工程師配合開發(fā)APP框架，引入制作完成的網(wǎng)頁，當需要使用手機系統(tǒng)權(quán)限時，需要安卓、蘋果工程師提供接口，網(wǎng)頁可以使用js調(diào)用。測試完成后就完成了整個工程的開發(fā)[0026]2)方法二:使用現(xiàn)有成熟框架如:WeX5，WeX5提供了安卓、蘋果統(tǒng)一生成打包功能，無須安卓、蘋果工程師配合。[0027]本發(fā)明以上實施例具有以下優(yōu)點:[0028]1、無須多次開發(fā)，多個工種的程序員開發(fā)?；贖TML5的應(yīng)用只需要前端工程師參與，配合現(xiàn)有的APP框架，也可以使用第三方框架，全程無須安卓、蘋果工程師參與，HTML5基于瀏覽器運行，無須考慮系統(tǒng)的多樣性，做到一次開發(fā)，多處運行的效果。[0029]2、無須用戶多次下載更新客戶端。基于HTML5應(yīng)用，加載的內(nèi)容是HTML5開發(fā)的網(wǎng)頁，存儲在服務(wù)器中，每次加載都是從服務(wù)器獲取最新的版本，所以無須用戶多次下載更新客戶端。而傳統(tǒng)的APP應(yīng)用，文件內(nèi)容都存儲在本地，如果需要升級版本，需要重新下載整個客戶端，會造成用戶體驗不好。[0030]3、使用HTML5無須考慮到頁面的兼容性。現(xiàn)在的智能手機系統(tǒng)的瀏覽器均支持超文本標記語言HTML5，前端工程師無須像開發(fā)PC端網(wǎng)頁一樣兼容多個標準的瀏覽器，省去了調(diào)試兼容性的煩惱，大大提高了開發(fā)效率?！局鳈?quán)項】1.一種手機客戶端應(yīng)用程序的開發(fā)方法，其特征在于，包括以下步驟:101、使用HTML5做出網(wǎng)頁框架；102、使用CSS3修飾網(wǎng)頁頁面；103、使用JQuery或者Javascript框架，使網(wǎng)頁靜態(tài)界面具有動態(tài)功能，能夠與用戶進行交互；104、將步驟103制作的網(wǎng)頁嵌入到手機APP的框架中，進行調(diào)試，使不同手機系統(tǒng)的APP都能夠嵌入網(wǎng)頁并正常顯示。2.根據(jù)權(quán)利要求1所述的手機客戶端應(yīng)用程序的開發(fā)方法，其特征在于，在步驟101中，調(diào)整網(wǎng)頁的表單、文字和圖片的位置，并在不同的手機系統(tǒng)上測試兼容性并進行調(diào)整。3.根據(jù)權(quán)利要求1所述的手機客戶端應(yīng)用程序的開發(fā)方法，其特征在于，在步驟102中，使用CSS3修飾網(wǎng)頁的顏色和動態(tài)效果?！緦＠勘景l(fā)明公開了一種手機客戶端應(yīng)用程序的開發(fā)方法，包括以下步驟：使用HTML5做出網(wǎng)頁框架；使用CSS3修飾網(wǎng)頁頁面；使用JQuery或者Javascr？i？pt框架，使網(wǎng)頁靜態(tài)界面具有動態(tài)功能，能夠與用戶進行交互；將上一步制作的網(wǎng)頁嵌入到手機APP的框架中，進行調(diào)試，使不同手機系統(tǒng)的APP都能夠嵌入網(wǎng)頁并正常顯示。本發(fā)明手機客戶端的應(yīng)用程序開發(fā)周期短、程序兼容性好、程序可以存儲在服務(wù)器中，每次加載都是從服務(wù)器獲取最新的版本，無須用戶下載更新客戶端?！綢PC分類】G06F9/44【公開號】CN105653270【申請?zhí)枴俊景l(fā)明人】張峰,劉洋【申請人】深圳市泰比特科技有限公司【公開日】2016年6月8日【申請日】2015年12月29日