uni-app&H5&Android混合開發一 || 最全面的uni-app離線打包Android平臺教程

追逐時光者發表於2021-05-05

前言：

　　為什麼會寫這麼一個教程，因為很久之前做過一個對接銀行POS我們的系統是使用的H5開發的app應用。但是假如對結果銀行相關業務的小夥伴應該都清楚，銀行的業務相對於其他的對接方而言安全性比較高，而且一般都不會提供定製開發，所以只能我們自己來實現與他們的對接。因此我們把支付這一塊做成了Android原生的對接，因為我們需要對接銀行提供的Activity元件來來實現POS機掃碼、刷卡等相關的支付功能。

什麼是原生開發？什麼是混合開發？兩者有什麼區別？

詳情概述：https://zhuanlan.zhihu.com/p/32146560

開發環境準備：

Android Studio 下載地址：Android Studio官網 OR Android Studio中文社群

(Android Studio 下載安裝詳細教程：https://blog.csdn.net/wangmx1993328/article/details/81905195)

uni-app開發環境安裝：HBuilderX

App離線SDK下載：最新android平臺SDK下載

下載uni-app 安卓打包所需要的 SDK：

https://nativesupport.dcloud.net.cn/AppDocs/download/android

下載成功，如下圖所示：

使用Android Studio 開啟Hbuilder-Hello （H5+專案模板），並編譯：

注意：

下文中的Hbuilder-Hello等於HBuilder-HelloUniApp因為之前版本是叫做HBuilder-Hello，所以大家只要知道這兩個SDK其實是一樣的只是版本不一樣而已。

注意不要把專案放在帶有中文的資料夾目錄下面，否則無法編譯通過提示一下錯誤：

編譯的時候會提示：專案路徑包含非ASCII字元。這很可能會導致Windows上的生成失敗。請將專案移到其他目錄或者更改為英文檔名。

開啟Hbuilder-Hello Android專案：

注意：匯入成功以後進行專案編譯，注意第一次專案編譯可能會出現ERROR: Read timed out的情況，不過不要慌繼續點選編譯即可解決。

解決專案編譯通過後無法直接在虛擬裝置中執行提示Error:moudle not specified：

問題查詢：

1、點選Edit Configurations：

2、在彈出層左側選擇，Android App>app 檢視General模組下的Module中是否存在其他模組:

Android Studio中執行專案時提示Error:moudle not specified，解決方案：

點選搜尋按鈕，輸入【Sync Project With Gradle Files】，直接點選下面搜尋到的內容，然後就會自動安裝缺少的Gradle Files檔案，安裝完成之後專案即可執行！

使用Android Studio中的虛擬裝置執行專案，檢視執行效果：

如何使用Android Studio中的虛擬裝置執行專案，如下圖所示：

虛擬裝置執行成功後的專案介面：

HBuilderX生成本地打包App資源：

生成本地打包App資源：

使用HBuilderX寫好的專案，點選發行 > 原生app-本地打包 > 生成本地打包資源，打包完成後，HBuilderX控制檯會輸出打包資訊和打包路徑：

生成的資原始檔如下圖所示：

Android知識點補充，assets資源目錄和res目錄介紹：

assets目錄下存放的原生資原始檔(不會被編譯)：

Android的體系架構設計中，assets目錄下的資料內容（圖片、檔案等等）將不會被Android系統壓縮、二次處理等，assets目錄下的檔案將保持原汁原味打包進Android的apk檔案中，因此，利用Android assets這一點特性，根據專案開發的需要，在某種情況下，可以在assets目錄下存放一些不希望被Android系統二次處理的原始檔案，就像在PC開發時候直接針對硬碟上存放的檔案內容進行讀寫一樣讀出原始資料。