图解WebView -- (1) WebView概述_webview渲染

前言

目前各移动应用或多或少都内嵌了Web网页，在Android开发中，就不可避免的使用本系列的主角——WebView。

一、WebView 是什么？

• WebView是Android 展示Web网页的控件，类似于应用提供一个内置的浏览器，在应用内实现和浏览器一致的网页展示效果(如上图所示)。
• WebView基于开源的 webkit 引擎实现。
• 从Android 4.4开始基于Chromium引擎实现（渲染性能提升）。
  
  

二、 WebView 有什么用？

• 除了具备一般View的特性外，WebView还可完成url请求、Web页面加载、渲染、页面交互等。
• 直接加载html文件（网络上或本地assets中）作为页面布局。
• 提供了Android应用和JavaScript通信交互的通道（实现混合开发的基础）。
  
  

三、WebView的基本使用

3.1 应用权限配置

• 访问网络数据，需要在AndroidManifest添加网络权限。

 <uses-permission android:name="android.permission.INTERNET" />
1

3.2 在布局文件中添加WebView控件

   <WebView
        android:id="@+id/webview"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />
1
2
3
4

3.3 WebView网页加载

• 以下例子为打开百度页面。
• 由于网页中使用了Javascript ，所以需要设置支持Javascript 。

public final class Demo1Activity extends AppCompatActivity {

    private ActivityDemo1Binding binding;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        binding = ActivityDemo1Binding.inflate(getLayoutInflater());
        setContentView(binding.getRoot());
        //获取WebView设置对象
        WebSettings settings = binding.webview.getSettings();
        //设置支持JavaScript
        settings.setJavaScriptEnabled(true);
        binding.webview.loadUrl("https://www.baidu.com");
    }
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16

• 使用了ViewBinding，需要在build.gradle中加上以下配置

  viewBinding {
        enabled = true
    }
1
2
3

四、 WebView核心知识体系

整个WebView应用开发核心知识体系，主要包含以下几大块：

4.1 WebView提供的API

WebView 作为核心控件，其自身功能十分强大，提供了许多API，供开发调用。

4.2 WebSettings

• WebSettings是专门 对WebView控件配置和管理的类。
  
  

4.3 WebViewClient

WebViewClient是辅助WebView控件处理各种通知与请求事件的一个类。

4.4 WebChromeClient

WebChromeClient是辅助WebView处理Javascript的对话框、网站图标、网站title、加载进度等的类。

4.5 Android与JS通信交互

• 实现混合开发的基础，Web网页通过JS调用Android原生接口实现混合开发业务。
  
  

参考资料

• WebView(网页视图)基本用法
• Carson带你学Android：最全面、易懂的Webview使用教程
• WebView Android 官方开发者指南