前言


什么是套壳浏览器

套壳浏览器指的是在一个app内一些看似很复杂的东西其实是内嵌了一个web浏览器来解决,在Android平台上,你可以使用webview来将浏览器嵌入到你的应用中

开始开发

新建项目不写了 最低Android兼容版本为7.0 使用kotlin开发(学习)

绘制布局

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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=".MainActivity">

<androidx.swiperefreshlayout.widget.SwipeRefreshLayout
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
android:id="@+id/swipe_refresh"
android:layout_height="match_parent"
android:layout_width="match_parent">

<WebView
android:id="@+id/main_webView"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">

</WebView>
</androidx.swiperefreshlayout.widget.SwipeRefreshLayout>


</androidx.constraintlayout.widget.ConstraintLayout>

我使用了最新的ConstraintLayout,这种布局相对于Relativelayout性能更好,也更方便我这种小白使用(可以使用图形界面拖出你想要的效果)

其中SwipeRefreshLayout是官方的下拉刷新组件

编写代码

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
//设置
val settings = main_webView.settings
settings.javaScriptEnabled = true
settings.allowFileAccess = true
settings.cacheMode = WebSettings.LOAD_CACHE_ELSE_NETWORK
settings.userAgentString += " AndroidLabClient/${BuildConfig.VERSION_NAME}"

main_webView.webViewClient =
object : WebViewClient() {
override fun shouldOverrideUrlLoading(
view: WebView?,
request: WebResourceRequest?
): Boolean {
if (address in request?.url.toString()){ //如果是论坛内部
return false
}
//如果是外部就使用系统浏览器打开
startActivity(Intent(Intent.ACTION_VIEW,request?.url))
return true
}

override fun onPageFinished(view: WebView?, url: String?) {
Log.d(TAG, "当前url ${view?.url}")
if (baseContext.resources.configuration.orientation == Configuration.ORIENTATION_LANDSCAPE) { //横屏状态下
window.setFlags( //全屏
WindowManager.LayoutParams.FLAG_FULLSCREEN,
WindowManager.LayoutParams.FLAG_FULLSCREEN
)
main_webView.settings.apply { //允许缩放
builtInZoomControls = true
setSupportZoom(true)
displayZoomControls = true
}
main_webView.evaluateJavascript(SCRIPT, //插入优化代码
ValueCallback {

})
}
}

}


以下代码实现下拉刷新

1
2
3
4
5
6
7
8
9
10
11
12
//下拉刷新的颜色
swipe_refresh.setColorSchemeResources(
android.R.color.holo_blue_bright,
android.R.color.holo_green_light, android.R.color.holo_orange_light,
android.R.color.holo_red_light
)
//下拉刷新回调
swipe_refresh.setOnRefreshListener {
main_webView.clearCache(true)
main_webView.reload()
swipe_refresh.isRefreshing = false //让下拉球消失
}

以下代码实现按下back键返回webview中的网页而不退出app

1
2
3
4
5
6
7
override fun onKeyDown(keyCode: Int, event: KeyEvent?): Boolean {
if (keyCode == KeyEvent.KEYCODE_BACK && main_webView.canGoBack()) {
main_webView.goBack() //back键返回
return true
}
return super.onKeyDown(keyCode, event)
}

以下代码实现切换屏幕方向不丢失webview的返回数据,使屏幕翻转后也可以正常返回而不是直接退出app

1
2
3
4
5
6
7
8
9
10
11
12

//保存和加载信息
override fun onSaveInstanceState(outState: Bundle) {
main_webView.saveState(outState)
super.onSaveInstanceState(outState)
}

override fun onRestoreInstanceState(savedInstanceState: Bundle) {
main_webView.restoreState(savedInstanceState)

}

一些美化代码

1
2
3
this.window.decorView.systemUiVisibility =
View.SYSTEM_UI_FLAG_LIGHT_STATUS_BAR //设置白底黑图标状态栏
supportActionBar?.hide() //隐藏标题栏

状态栏颜色还需要在styles.xml中修改

源代码

Github