老调重弹，Android Studio 打包H5项目（2020版）

一、下载Android Studio

安卓Studio 下载可以直接去官网，如果你不能翻墙，可以去网盘下载（现在是2020年05月22日）网盘地址 提取码: pgqm:

二、新建安卓项目

选择 Empty Activity：

新建好了项目之后，需要修改配置文件，把我们的H5项目集成进去。

三、一个完整的安卓应用需要哪些东西

这里，你需要知道，一个完整的App需要哪些最最基础的功能，我列了一下：

1. 能访问网络
2. 能回退，像App一样
3. 自定义App图标，不要是个默认的Android 机器人就行
4. 修改应用名称
5. 修改主界面颜色，让它跟你的项目吻合
6. 添加H5逻辑

1. 能访问网络

这个其实就是一个配置项目，在 AndroidManifest.xml 加一行就行，具体如下：

<?xml version="1.0" encoding="utf-8"?>
<manifest>
    <application>
        ......
    </application>
    <uses-permission android:name="android.permission.INTERNET" />
</manifest>

示例代码中，加一段 uses-permission 的配置就可以了。

2. 能回退，像App一样

在MainActivity 中添加如下方法就行，它其实是重写了方法：

public class MainActivity extends AppCompatActivity {
    private WebView webview;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
    	......
    }
    @Override//设置回退
    public boolean onKeyDown(int keyCode, KeyEvent event) {
        if ((keyCode == KeyEvent.KEYCODE_BACK) && webview.canGoBack()) {
            webview.goBack();
            return true;
        }
        return false;
    }
}

通过监听设备的onKeyDown 方法，实现回退的功能，因为它没有像Pc端的回退键。

3. 自定义App图标，不要是个默认的Android 机器人就行

个人觉得，这个是实际开发中很现实的一个需求，业务当然希望看到自己的东西像是自己的产品。从应用图标开始：

如上图所示，这里面在res文件夹里有5个mipmap 开头的文件夹，它里面放的就是图标，一大一小，但是修改的时候，只需要一个，图片，然后起两个不同的名字就行，大概像正面这样：

ic_launcher.png和 ic_launcher_round.png这两个图片是默认的，我们只需要替换图片，名称不变就行。

4. 修改应用名称

每个项目都有自己的名称，H5应用也一样，所以，这个也算是硬性需求了，修改也简单， 还是在AndroidManifest.xml文件中：

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.example.we_research">

    <application
        android:allowBackup="true"
        android:icon="@mipmap/ic_launcher"
        android:label="应用名称"
        android:roundIcon="@mipmap/ic_launcher_round"
        android:supportsRtl="true"
        android:networkSecurityConfig="@xml/network_security_config"
        android:theme="@style/AppTheme">
        <activity android:name=".MainActivity">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />
                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
    </application>
</manifest>

替换掉 android:label="应用名称"中的“应用名称” 就行。

5. 修改主界面颜色，让它跟你的项目吻合

为了让它看起来更完美，还可以修改App的主题颜色，让它与H5界面无缝吻合。这样看起来就和原生App一模一样啦：

如上图所示，找到res/values/colors.xml文件，然后修改里面的色值就行：

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <color name="colorPrimary">#6c6c6c</color>
    <color name="colorPrimaryDark">#000</color>
    <color name="colorAccent">#03DAC5</color>
</resources>

6. 添加H5逻辑

最后一步，就是最关键的一步啦，添加H5逻辑，这里有两种方法 ： 第一种是把H5逻辑放在Assets 文件夹中（这个需要自己建）；第二种是已经有发布的链接了，直接引用H5项目的链接，然后在MainActivity 中添加方法：

public class MainActivity extends AppCompatActivity {
    private WebView webview;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        webview = new WebView(this);
        webview.getSettings().setJavaScriptEnabled(true);
//        webview.loadUrl("file:///assets/index.html"); 本地资源引用
        webview.loadUrl("http://178.178.178.178/projectname/"); // 链接引用
        setContentView(webview);
    }
}

这样，一个完整的H5集成方案就完成了。

撒花.jpg

四、调试

可能有朋友还会关心一个现实的问题，如何调试。
新安装的Android Studio是没有Module的，也没有模拟器，需要自己安装
找不到Module的话，可以通过这样去找：

然后模拟器就下载默认的虚拟设备就行，但是这里有一个点要注意，2020版本的Android studio是需要 Intel Hyper-V虚拟技术的，但是默认Windows系统没有打开，所以，根据正面的图片中的步骤，打开：

这样就可以愉快地运行调试啦，哈哈，最后附上一张运行图：

这样就大功告成啦，喜欢请评论，点赞，收藏三连哟~