Android开发第二步（全屏嵌套H5页面）

ZBY52031

已于 2022-07-29 10:14:29 修改

阅读量4k

点赞数 7

分类专栏： Android 文章标签： android webview

于 2022-07-29 09:43:50 首次发布

本文链接：https://blog.csdn.net/ZBYTSL/article/details/126048229

版权

Android 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

好久不见！这些躺平的日子里面，你们还好吗？磨磨蹭蹭好久开始Android开发第二步（全屏嵌套H5页面）那就直接来咯！

第一步：

搭建项目，不会的可以参照这个（Android开发第一步_ZBY52031的博客-CSDN博客）说明一下这个是我之前用AS搭建的，以下项目我都开始用IntelliJ IDEA（安装太多开发软件了，电脑不行了！就全部都卸载，留一个YYDS）

第二步：

找一个想嵌套H5页面（https://www.baidu.com/）

第三步：

嵌套进去（这样说！好怕被打死~~）正题！怎么嵌套进去？当然是写代码咯！

我这简单放个图，小白看一下！可以更好的了解项目结构

下面细说一下第三步：

a.修改activity_main.xml，下面就直接放整个文件代码！对比一下就把之前的TextView注释，放了一个WebView而已

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:tools="http://schemas.android.com/tools"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        tools:context=".MainActivity">

<!--    <TextView-->
<!--            android:layout_width="wrap_content"-->
<!--            android:layout_height="wrap_content"-->
<!--            android:text="Hello World!"-->
<!--            app:layout_constraintBottom_toBottomOf="parent"-->
<!--            app:layout_constraintLeft_toLeftOf="parent"-->
<!--            app:layout_constraintRight_toRightOf="parent"-->
<!--            app:layout_constraintTop_toTopOf="parent"/>-->

    <WebView
            android:id="@+id/webview"
            android:layout_width="match_parent"
            android:layout_height="match_parent"/>

</androidx.constraintlayout.widget.ConstraintLayout>

b.修改MainActivity.java（有可能写代码真的很难命名？我看的出来这两个命名就换了位置）

package com.example.myapplication;

import android.content.Intent;
import android.net.Uri;
import android.webkit.WebSettings;
import android.webkit.WebView;
import android.webkit.WebViewClient;
import androidx.appcompat.app.AppCompatActivity;
import android.os.Bundle;

public class MainActivity extends AppCompatActivity {

//    注释之前的代码
//    @Override
//    protected void onCreate(Bundle savedInstanceState) {
//        super.onCreate(savedInstanceState);
//        setContentView(R.layout.activity_main);
//    }

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        WebView webview = findViewById(R.id.webview);
        WebSettings webSettings = webview.getSettings();
        webSettings.setDomStorageEnabled(true);
        webSettings.setJavaScriptEnabled(true);
        webSettings.setBlockNetworkImage(false);

        // 覆盖WebView默认使用第三方或系统默认浏览器打开网页的行为，使网页用WebView打开
        webview.setWebViewClient(new WebViewClient() {
            @Override
            public boolean shouldOverrideUrlLoading(WebView view, String url) {
//                view.loadUrl(url);
//                return true;

                if (url.startsWith("http:") || url.startsWith("https:") || url.startsWith("ftp")) {
                    view.loadUrl(url);
                    return true;
                } else if (url.startsWith("scheme://")) {
                    // 使用浏览器打开
                    Intent intent = new Intent(Intent.ACTION_VIEW, Uri.parse(url));
                    startActivity(intent);
                    return true;
                } else {
                    return false;
                }

            }
        });
        
        webview.loadUrl("https://www.baidu.com/");

    }
}

注意：WebView这块findViewById(R.id.webview)，对应的是你activity_main.xml放的WebView【android:id="@+id/webview"】webSettings设置的三个应该很容易懂吧！那就不解释了。这样搞完感觉好像可以了，实际上还有一丢丢问题！

你运行可能会页面异常出现Webpage not available，当然出现问题就解决问题！

c.修改AndroidManifest.xml

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
          package="com.example.myapplication">
    <!-- 页面异常 出现Webpage not available，请添加 -->
    <uses-permission android:name="android.permission.INTERNET"/>
    <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE"/>
    <uses-permission android:name="android.permission.ACCESS_WIFI_STATE"/>

    <application
            android:allowBackup="true"
            android:icon="@mipmap/ic_launcher_tq"
            android:label="@string/app_name"
            android:roundIcon="@mipmap/ic_launcher_round_tq"
            android:supportsRtl="true"
            android:theme="@style/Theme.MyApplication"
            android:usesCleartextTraffic="true"
    >
        <activity
                android:name=".MainActivity"
                android:exported="true">
            <intent-filter>
                <action android:name="android.intent.action.MAIN"/>

                <category android:name="android.intent.category.LAUNCHER"/>
            </intent-filter>
        </activity>
    </application>
</manifest>

这样就OK了！最后备注一个怎么修改APP名称和logo（修改AndroidManifest.xml）找到下面三句代码修改

            android:icon="@mipmap/ic_launcher_tq"
            android:label="@string/app_name"
            android:roundIcon="@mipmap/ic_launcher_round_tq"

修改App名称和logo的时候！推荐两个在线工具
https://www.bejson.com/ui/borderradius/
https://onlineconvertfree.com/zh/convert-format/jpg-to-webp/

最后放一个我做的示例！检验一下我通过WebView学的怎么样吧！

链接:https://pan.baidu.com/s/1xJoYDsHcpHx8uctDLRym-w?pwd=g2fj 提取码:g2fj 复制这段内容后打开百度网盘手机App，操作更方便哦

抱歉！忘了一个全屏！找values文件夹下面的样式文件修改，我的这个文件名叫themes.xml，但是我看有些版本或者开发软件可能会导致名称不一样，所以你们要改的时候要注意看代码

<resources xmlns:tools="http://schemas.android.com/tools">
    <!-- Base application theme. -->
    <!-- <style name="Theme.MyApplication" parent="Theme.MaterialComponents.DayNight.DarkActionBar"> -->
    <style name="Theme.MyApplication" parent="Theme.MaterialComponents.DayNight.NoActionBar">
        <!-- Primary brand color. -->
        <!-- APP名称背景色. 设置不显示NoActionBar 暂时默认白色 -->
        <item name="colorPrimary">@color/purple_500</item>
        <!-- 通知栏背景色  通知栏字体颜色 -->
        <item name="colorPrimaryVariant">@color/purple_700</item>
        <item name="colorOnPrimary">@color/white</item>
        <!-- Secondary brand color. -->
        <item name="colorSecondary">@color/teal_200</item>
        <item name="colorSecondaryVariant">@color/teal_700</item>
        <item name="colorOnSecondary">@color/black</item>
        <!-- Status bar color. -->
        <item name="android:statusBarColor" tools:targetApi="l">?attr/colorPrimaryVariant</item>
        <!-- Customize your theme here. -->
    </style>
</resources>

主要是下面两句，我把原有的注释了（下期写一个style说明文）

    <!-- <style name="Theme.MyApplication" parent="Theme.MaterialComponents.DayNight.DarkActionBar"> -->
    <style name="Theme.MyApplication" parent="Theme.MaterialComponents.DayNight.NoActionBar">