HBuilder打包App方法

來源:互聯網
上載者:User

標籤:ica   管理器   裝置   使用者   許可權   下載   cat   src   分享   

HBuilder是DCloud(數字天堂)推出的一款支援HTML5的Web開發IDE。該軟體既可以支援web代碼編寫,也可以將已經編寫好的項目代碼打包為手機APP。

HBuilder提供的打包有雲端打包和本地打包兩種,雲端打包的特點是DCloud官方配置好了原生的打包環境,可以把HTML等檔案編譯為原生安裝包。

 

1,下載HBuilder,註冊並登陸。首先開啟“檔案”-“建立”-“移動APP”,輸入“應用程式名稱”,“位置”可以根據需要自己選擇即可,“選擇模板”建議選擇空模板;

2,建立完成後, 在專案管理器會顯示建立的項目目錄,其中css,img,js和index.html這幾個檔案可刪可改可替換。

unpackage檔案夾是放置app表徵圖和啟動介面的圖片。

manifest.json檔案是移動App的設定檔,用於指定應用的顯示名稱、表徵圖、應用入口檔案地址及需要使用的裝置許可權等資訊,使用者可通過HBuilder的可視化介面視圖或者源碼視圖來配置移動App的資訊。

3,如果刪除了css,img,js檔案夾和index.html檔案,就把其他自己的專案檔對應複製到檔案夾中,注意html檔案中的引用路徑需要保持正確。

如自己拷貝的項目:

 

4, 檔案複製完成後,重新整理更新下,雙擊開啟manifest.json檔案來配置App。

appid:點擊雲端擷取。版本號碼:根據需要來編輯。頁面入口:預設是index.html,根據自己項目需要,更改APP的啟動頁面。應用描述:自己隨便填。應用是否全螢幕顯示:勾上就全螢幕顯示。

5,表徵圖配置:點擊頁面下方的表徵圖配置,配置APP顯示表徵圖。

1)點擊"+"號的正方形方框,選擇表徵圖素材的路徑找到表徵圖素材,再點擊" 自動產生所有表徵圖並替換"按鈕,完成表徵圖產生和替換。

2),產生的表徵圖自動在unpackage檔案夾下

6,啟動圖片(splash)配置,點擊切換到啟動圖片配置

1),啟動選項:預設

2),啟動圖片設定,根據自己需要是Android還是iOS平台,再根據不同裝置對應做出啟動圖片

3),在unpackage→res檔案下建立個檔案命名"splash",把做好的啟動圖片放到這個檔案裡面。

4),在啟動圖片設定裡點擊"選擇",找到剛放進來的啟動圖片

7,SDK配置:有需要就配置,沒有就預設就行。

8,模組許可權配置:有需要就配置,沒有就預設就行。

9,頁面參考關聯性:

首先點擊“掃描碼”,再點擊左邊index.html檔案

該功能是什麼意思:點擊左側html檔案,右側會顯示不同的檔案,圖片等。可以表示左側html檔案載入時所需要的資源。

10,程式碼檢視:在程式碼檢視裡查看設定是否正確,確定後ctrl+s儲存好。

11,設定好配置選項,正式進入打包階段

HBuilder裡點:"發行"-"發行為原生安裝包"開始打包

這裡介紹一下iOS打包

1),這裡如果選擇越獄包就不需要蘋果認證,一路預設設定就可以打包成功,但是打包的App只能安裝在越獄過的手機,沒越獄安裝不了。

2),如果使用蘋果認證,這裡推薦一個申請iOS認證的工具 Appuploader。免蘋果付費開發人員帳號,直接使用普通蘋果id,就能使用Appuploader申請ios測試認證,打包ipa安裝到非越獄裝置。

工具的安裝網址:http://www.applicationloader.net/blog/zh/72.html

免開發人員帳號申請iOS認證教程:http://www.applicationloader.net/blog/zh/1073.html

 

12,提交成功後點擊確定,就可以查看App打包狀態

等打包成功,就可以點手動下載,通過第三方工具 蘋果助手安裝到ipad上了。

13,調試和安裝模擬器

如果你需要在電腦本機進行調試那就需要安裝模擬器,請參考http://ask.dcloud.net.cn/article/151如何安裝配置手機模擬器,或者在HBuilder裡→→運行→→手機運行→→如何安裝配置手機模擬器進入查看。

如果需要安裝到手機進行真機調試,把手機用資料線串連到電腦,然後重新啟動HBuilder→→運行→→手機運行→→串連上真機。

 

HBuilder打包App方法

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.