Android：一个实用的WebView浏览网页，可直接使用

jekeyhui99 发表于 2019-7-31 11:42:07

<div><h1>1、前言</h1>
无论是日常开发还是练习，相信网页显示是经常需要实现的业务场景，现在的应用一般有网页链接传入，都直接在自己的应用中显示，不会去跳转自带浏览器。今天，我们就来实现一个能满足基本网页浏览需求的页面。国际惯例<a href="https://link.jianshu.com?t=https%3A%2F%2Fgithub.com%2FLeviWGG%2FEnableHands" target="_blank" rel="nofollow">附上源码</a>。
<h1>2、效果图</h1>
<div class="image-package">
<div class="image-container" style="max-width: 474px; max-height: 1168px; background-color: transparent;">
<div class="image-container-fill" style="padding-bottom: 166.88%;"><img data-original-src="//upload-images.jianshu.io/upload_images/5256137-860264953e2cf741.gif" data-original-width="474" data-original-height="791" data-original-format="image/gif" data-original-filesize="2488827" class="" src="//upload-images.jianshu.io/upload_images/5256137-860264953e2cf741.gif?imageMogr2/auto-orient/strip%7CimageView2/2/w/474/format/webp" style="background-color: transparent; cursor: zoom-in;"></div>
</div>
<div class="image-caption">WebView浏览.gif</div>
</div>
从图中可以看到进入新闻网页后，除了不能输入网址(关注自己的业务)，已经与普通浏览器浏览网页相同。 
下面上代码。
<h1>3、代码</h1>
<blockquote>
急用的同学下面可以直接ctrl c + ctrl v，如果想知道一些原理不妨接着往下看
</blockquote>
1、添加访问网络权限（AndroidManifest.xml）
<pre class="hljs xml"><code class="xml"><uses-permission android:name="android.permission.INTERNET"/>
</code></pre>
2、页面布局
<pre class="hljs xml"><code class="xml"><RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="app.main.wangliwei.enablehands.view.WebDetailActivity">

<FrameLayout
 android:id="@+id/web_frame"
 android:layout_width="match_parent"
 android:layout_height="match_parent"
 android:focusable="true"
 android:focusableInTouchMode="true">
</FrameLayout>

</RelativeLayout>
</code></pre>
3、WebDetailActivity.java
<pre class="hljs java"><code class="java">public class WebDetailActivity extends AppCompatActivity {
private Bundle bundle;
private WebView webView;
private FrameLayout frameLayout；

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

 frameLayout = findViewById(R.id.xwalk_view);
 bundle = getIntent().getExtras();
 initView();
}

private void initView() {
 webView = new WebView(this);
 WebSettings settings = webView.getSettings();
 settings.setDomStorageEnabled(true);
 //解决一些图片加载问题
 settings.setJavaScriptEnabled(true);
 settings.setBlockNetworkImage(false);
 webView.setWebViewClient(new WebViewClient(){
 @Override
 public boolean shouldOverrideUrlLoading(WebView view, String url) {
 Log.d("webview","url: "+url);
 view.loadUrl(url);
 return true;
 }
 });
 frameLayout.addView(webView);
 String url = bundle.getString("URL");
 webView.loadUrl(url);
}

//监听BACK按键，有可以返回的页面时返回页面
@Override
public boolean onKeyDown(int keyCode, KeyEvent event) {
 if(keyCode == KeyEvent.KEYCODE_BACK) {
 if(webView.canGoBack()) {
 webView.goBack();
 return true;
 }
 }

 return super.onKeyDown(keyCode, event);
}

@Override
protected void onDestroy() {
 if (webView != null) {
 webView.loadDataWithBaseURL(null, "", "text/html", "utf-8", null);
 webView.setTag(null);
 webView.clearHistory();

 ((ViewGroup) webView.getParent()).removeView(webView);
 webView.destroy();
 webView = null;
 }
 super.onDestroy();
}
}
</code></pre>
在浏览页面时主要做了两个处理，一个是对页面返回的链接(URL)做直接显示处理，由于我是实现一个新闻业务，所以在浏览过程中跳转到其他页面是必须的，重载<code>WebClientView</code>中的<code>shouldOverrideUrlLoading</code>方法。另一个是监听BACK按键，先用<code>canGoBack()</code>判断是否有可以回退的页面，如果有再调用<code>goBack()</code>返回上一个页面。
4、WebView的几种加载方式
<pre class="hljs java"><code class="java">//方式1. 加载一个网页：
webView.loadUrl("http://www.baidu.com/");

//方式2：加载apk包中的html页面
webView.loadUrl("file:///android_asset/test.html");

//方式3：加载手机本地的html页面
webView.loadUrl("content://com.android.levi/sdcard/test.html");

</code></pre>
5、Settings的常见设置
<pre class="hljs java"><code class="java">WebSettings settings=webView.getSettings();

// webview启用javascript支持用于访问页面中的javascript
settings.setJavaScriptEnabled(true);

//设置WebView缓存模式默认断网情况下不缓存
settings.setCacheMode(WebSettings.LOAD_DEFAULT);

/**
* LOAD_CACHE_ONLY: 不使用网络，只读取本地缓存数据
* LOAD_DEFAULT: （默认）根据cache-control决定是否从网络上取数据。
* LOAD_NO_CACHE: 不使用缓存，只从网络获取数据.
* LOAD_CACHE_ELSE_NETWORK，只要本地有，无论是否过期，或者no-cache，都使用缓存中的数据。
*/
//断网情况下加载本地缓存
settings.setCacheMode(WebSettings.LOAD_CACHE_ELSE_NETWORK);}

//让WebView支持DOM storage API
settings.setDomStorageEnabled(true);

//让WebView支持缩放
settings.setSupportZoom(true);

//启用WebView内置缩放功能
settings.setBuiltInZoomControls(true);

//让WebView支持可任意比例缩放
settings.setUseWideViewPort(true);

//让WebView支持播放插件
settings.setPluginState(WebSettings.PluginState.ON);

//设置WebView使用内置缩放机制时，是否展现在屏幕缩放控件上
settings.setDisplayZoomControls(false);

//设置在WebView内部是否允许访问文件
settings.setAllowFileAccess(true);

//设置WebView的访问UserAgent
settings.setUserAgentString(String string);

//设置脚本是否允许自动打开弹窗
settings.setJavaScriptCanOpenWindowsAutomatically(true);

// 加快HTML网页加载完成速度 
if (Build.VERSION.SDK_INT >= 19) {
settings.setLoadsImagesAutomatically(true);
} else {
settings.setLoadsImagesAutomatically(false);
}

// 开启Application H5 Caches 功能 
settings.setAppCacheEnabled(true);

// 设置编码格式
settings.setDefaultTextEncodingName("utf-8");

</code></pre>
<h1>3、跳转Activity</h1>
拿到链接(URL)以后可以这样开启浏览页面
<pre class="hljs java"><code class="java"> Bundle bundle = new Bundle();
bundle.putString("URL",url);
Intent intent = new Intent(getActivity(),WebDetailActivity.class);
intent.putExtras(bundle);
startActivity(intent,bundle);
</code></pre>
<h1>4、关于内存泄漏</h1>
每个应用在android中所占用的内存是有限制的，碰巧WebView又是内存大户，所以在关闭页面时，如果不及时释放内存，很可能导致OOM。
避免内存泄漏要做一些处理： 
不在xml中定义 Webview ，而是在需要的时候在Activity中创建，并且Context使用 <code>getApplicationgContext()</code>，因为WebView调用<code>destory</code>时,如果传入Activity的Context对象WebView会仍绑定在Activity上。在 Activity 销毁（ WebView ）的时候，先让 WebView 加载null内容，然后从父容器(<code>ViewGroup</code>)中移除 WebView，再销毁 WebView，最后置空。
<blockquote>
需要注意的是，如果你需要在WebView中打开链接或者你打开的页面带有flash，获得你的WebView想弹出一个dialog，都会导致从ApplicationContext到ActivityContext的强制类型转换错误，从而导致你应用崩溃。这是因为在加载flash的时候，系统会首先把你的WebView作为父控件，然后在该控件上绘制flash，他想找一个Activity的Context来绘制他，但是你传入的是ApplicationContext。
</blockquote>
解决方法：通常根治这个问题的办法是为WebView开启另外一个进程，通过AIDL与主进程进行通信，WebView所在的进程可以根据业务的需要选择合适的时机进行销毁，从而达到内存的完整释放。因为webview引发的资源无法释放等问题全部可以解决。
<h1>5、最后</h1>
通过以上步骤还是可以实现一个满足基本浏览需求的页面的，注意内存泄漏，比较开发到后期，对内存的使用时越来也关注。如果对你有帮助，欢迎 star 支持下，<a href="https://link.jianshu.com?t=https%3A%2F%2Fgithub.com%2FLeviWGG%2FEnableHands" target="_blank" rel="nofollow">源码地址</a>，个人项目里面有一些其他东西，直接看WebDetailActivity中的内容即可。</div> 作者：LeviWGG 链接：https://www.jianshu.com/p/e8eeec4e8d71 来源：简书 简书著作权归作者所有，任何形式的转载都请联系作者获得授权并注明出处。

页: [1]

吾知网's Archiver

Android：一个实用的WebView浏览网页，可直接使用