国内外Hybrid App的开发框架众多,PhoneGap(cordova )、AppCan、APICloud、WeX5 还有 Neact Native 等等好多,我当时接触的是 DCloud 公司的 MUI 框架,所以这篇文章采用的是用其 5+SDK 创建 Hybrid App工程
后续文章将讲到使用 Native.js 实现 Android 原生代码和 HTML 的数据交互,看本篇文章前建议先看如下文章:
Android独立应用方式集成HTML5+SDK,Widget方式离线打包,空项目讲解
HBuilder、 AndroidStudio、5+SDK
首先去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>当然你可以继续阅读官方文档仔细删减,最后效果如下:
