国内外Hybrid App的开发框架众多,PhoneGap(cordova )、AppCan、APICloud、WeX5 还有 Neact Native 等等好多,我当时接触的是 DCloud 公司的 MUI 框架,所以这篇文章采用的是用其 5+SDK 创建 Hybrid App工程
后续文章将讲到使用 Native.js 实现 Android 原生代码和 HTML 的数据交互,看本篇文章前建议先看如下文章:
Android独立应用方式集成HTML5+SDK,Widget方式离线打包,空项目讲解
工具准备
步骤
首先去DCloud官网下载5+SDK,下载后解压目录如下,解压的文件夹名称 Android-SDK
用 AndroidStudio 创建一个空的 Android 工程,一路NEXT直到finish(这图就不贴了吧)
把Android-SDK目录下 HBuilder-Hello 这个项目导入到 AndroidStudio,导入后如下
有错不用管,导入 AndroidStudio 只是更好的和自己新建的项目对比目录
接着把上图的 libs 和 src 文件拷贝到自己工程下的相应位置(覆盖掉自己生成的)
运行程序,如下表示成功了
项目精简
因为本系列文章是讲 Native.js,其它的功能我们暂时不用,所以是可以删掉的,比如我的项目把删减如下
AndroidManifest.xml文件删减如下
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="io.dcloud.HBuilder.Hello"
android:versionCode="570"
android:versionName="5.7.0">
<supports-screens
android:anyDensity="true"
android:largeScreens="true"
android:normalScreens="true"
android:resizeable="true"
android:smallScreens="true" />
<uses-sdk android:minSdkVersion="8" />
<!-- HBuilder Runtime 基础权限 begin -->
<!-- 联网 -->
<uses-permission android:name="android.permission.INTERNET" />
<!-- 使用存储卡 -->
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
<uses-permission android:name="android.permission.GET_TASKS" />
<!-- Html5Plus runtime基础权限 end -->
<application
android:name="io.dcloud.application.DCloudApplication"
android:allowClearUserData="true"
android:icon="@drawable/icon"
android:label="@string/app_name"
android:largeHeap="true">
<activity
android:name="io.dcloud.PandoraEntry"
android:configChanges="orientation|keyboardHidden|keyboard|navigation"
android:hardwareAccelerated="true"
android:label="@string/app_name"
android:launchMode="singleTask"
android:screenOrientation="user"
android:theme="@style/TranslucentTheme"
android:windowSoftInputMode="adjustResize">
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
<activity
android:name="io.dcloud.PandoraEntryActivity"
android:configChanges="orientation|keyboardHidden|screenSize|keyboard|navigation|mcc|mnc|fontScale"
android:hardwareAccelerated="true"
android:label="5+Debug"
android:launchMode="singleTask"
android:screenOrientation="user"
android:theme="@style/DCloudTheme"
android:windowSoftInputMode="adjustResize">
</activity>
<service
android:name="io.dcloud.common.adapter.io.MiniServerService"
android:exported="true" />
</application>
</manifest>
当然你可以继续阅读官方文档仔细删减,最后效果如下: