bl双性强迫侵犯h_国产在线观看人成激情视频_蜜芽188_被诱拐的少孩全彩啪啪漫画

HTML5Plus移動應用如何使用-創新互聯

今天就跟大家聊聊有關HTML5Plus移動應用如何使用,可能很多人都不太了解,為了讓大家更加了解,小編給大家總結了以下內容,希望大家根據這篇文章可以有所收獲。

專注于為中小企業提供成都做網站、成都網站建設、成都外貿網站建設服務,電腦端+手機端+微信端的三站合一,更高效的管理,為中小企業善左免費做網站提供優質的服務。我們立足成都,凝聚了一批互聯網行業人才,有力地推動了成百上千企業的穩健成長,幫助中小企業通過網站建設實現規模擴充和轉變。

什么是 HTML5Plus 移動應用HTML5 Plus移動App,簡稱5+App,是一種基于HTML、JS、CSS編寫的運行于手機端的App,這種App可以通過擴展的JS API任意調用手機的原生能力,實現與原生App同樣強大的功能和性能。

簡單一句就是,用開發 Web 的技術完成原生移動應用的開發。

5+App 與 移動 Web

雖然 5+App 與移動 Web 開發,采用的相關技術大體一致,但是兩者的區別還是很明顯的。

  • 5+App 是 C/S 的,Web 是 B/S 的。

  • 5+App 是獨立的客戶端,應用資源通常只能是靜態的文件。PHP、JSP 這些服務器模板,沒有解析器去處理。

  • 5+App 打包后是 apk 及 ipa 后綴的包,也就是原生的移動應用。

  • window.plus擴展的 API,依賴 5+Runtime 引擎。普通瀏覽器沒有集成這個引擎,Web 開發通常用不了這些 API。

準備工作開發工具

HBuilder 內置了 5+App 的開發環境,因此需要先下載此 IDE。

注冊賬號

下載并解壓 HBuilder 后,啟動 IDE。首次使用需要注冊一個賬號,方便之后管理應用以及在社區活動。

設備
由于在下沒有 iOS 設備以及 Mac OS 的機器,因此這個系列的分享都是以 Windows 系統下開發 Android 應用為例。

一臺電腦,一部手機。手機最好是 Android 4.4 及以上的,不推薦用模擬器。USB 線也是必須的,當然 HBuilder 同樣支持 WiFi 調試。

第一個 5+App新建應用
  • 啟動 HBuilder,并且登錄。

  • 菜單 -> 文件 -> 新建 -> 移動 App

  • 模板暫時不需要調整,輸入應用名“HelloWorld”,點擊完成即可。

index.html

應用的入口頁面,概念和 Web 的入口頁類似。默認是應用根目錄下的 index.html,這個可以調整。

manifest.json

5+App 的配置文件,用于配置應用的信息。HBuilder 對此文件做了特殊處理,并提供了可視化的編輯界面。

  • 應用信息

    • 應用名稱:就是你的應用在手機桌面上顯示的名字。

    • appid:這個是 5+App 創建時分配的,不要修改。更不要和 iOS 的 AppID 或者其它第三方平臺上的 appid 混淆。

    • 版本號:應用版本號

    • 頁面入口:就是首頁是哪個頁面,可修改。

    • 應用描述:簡單說明一下應用的信息

  • 圖標配置

    • 就是應用的 logo,按照提示做一張符合規格的圖,然后一鍵生成替換。

  • 啟動圖片

    • splash 圖就是應用啟動的時候那張占位的圖片,QQ 是個企鵝,微信是那個月球。

    • 啟動選項:通常用默認的就行,根據需要調整。

    • 圖片設置:按照需要,制作相應尺寸的 png 圖,選擇配置即可。

  • SDK 配置

    • 如果用到了一些第三方的 SDK 的功能,就需要配置相應的信息。

    • SDK 啟用需填寫的信息,去相應的第三方開放平臺注冊即可。

  • 模塊權限配置

    • 某些模塊的啟用需要配置下權限

  • 頁面引用關系

    • 不是特別懂,看說明書吧。

  • 代碼視圖

    • 配置的源代碼部分,不是所有配置都提供了可視化編輯視圖。

真機運行

將手機連上電腦,HBuilder 會自動檢測到連接到電腦上的設備。菜單 -> 運行 -> 真機運行,選擇你的設備即可。首次使用會安裝一個調試基座 HBuilder,如果 HBuilder IDE 版本變化的話,真機運行會覆蓋舊版本的 HBuilder 基座。

調試
  • 頁面的樣式,推薦使用電腦的 Chrome 瀏覽器手機模式進行調試。

  • Android 真機運行時,每次修改完文件并保存,手機端的基座會同步代碼。

  • Android 還是可以使用 Chrome RemoteDebugging 進行調試,但是需要是 Android 4.4 以上的設備并且首次需要翻墻。

調用 5+API

簡單封裝一下擴展 API 加載完成的事件回調

var plusReady = function(callback) {
  if(window.plus) {
    callback();
  } else {
    document.addEventListener('plusready', callback);
  }
};

然后,讀取下當前設備連接的網絡類型并輸出到頁面上。

plusReady(function() {
  var netType = plus.networkinfo.getCurrentType();
  document.write('當前網絡類型為:' + netType);
});

真機運行,可以看到頁面上的內容“當前網絡類型為:3”,也就是 WiFi 網絡環境。

打包
  • 確認 manifest.json 中的信息無誤

  • logo 及 splash 圖不配置的話,會用默認的 HBuilder 相關圖片。

  • 菜單 -> 發行 -> 云打包-打原生安裝包

  • 勾選 Android,Android 的證書相對隨意一些,用 DCloud 提供的現成的或者自己生成的都一樣。

  • 包名要嚴格遵循 Android 包名的格式規范,不要亂寫。這里調整一下,改為com.helo.html5plus

  • 如果配置信息有錯誤,會有提示,必須修改正確才能繼續。

  • 一切無誤之后,點擊“打包”,等待即可。

  • 打包完成后,會自動下載到相應的目錄下。

安裝

將云打包下載下來的 apk 安裝到手機上,啟動應用就可以查看當前網絡狀態信息。那么,我們的第一個 5+App 就順利制作完成了。

看完上述內容,你們對HTML5Plus移動應用如何使用有進一步的了解嗎?如果還想了解更多知識或者相關內容,請關注創新互聯網站制作公司行業資訊頻道,感謝大家的支持。

本文名稱:HTML5Plus移動應用如何使用-創新互聯
本文鏈接:http://vcdvsql.cn/article48/dihjhp.html

成都網站建設公司_創新互聯,為您提供營銷型網站建設手機網站建設Google定制開發用戶體驗電子商務

廣告

聲明:本網站發布的內容(圖片、視頻和文字)以用戶投稿、用戶轉載內容為主,如果涉及侵權請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網站立場,如需處理請聯系客服。電話:028-86922220;郵箱:631063699@qq.com。內容未經允許不得轉載,或轉載時需注明來源: 創新互聯

成都網站建設