目录
在这篇文章中我会手把手教大家如何使用一个简易的webview
访问 https://www.baidu.com,输入其他网址进行访问
( 创作不易,希望得到大家的点赞支持,谢谢大家)
一.关于WebView
问:什么是WebView?
答:WebView 是 Android 平台上的一个 View 类,用于在应用程序中显示网页内容。它允许应用程序加载和显示网页,可以用来展示网页内容、嵌入第三方网页、展示网页应用等。WebView 可以与 Web 页面进行交互,支持加载 HTML、JavaScript、CSS 等网络内容,并提供了一些方法和接口来处理网页的加载和交互。
开发人员可以在 Android 应用中使用 WebView 来展示各种网页内容,包括静态网页、动态网页、Web 应用程序等。通过 WebView,用户可以在应用内部浏览网页,而不必离开应用程序的环境。
总的来说,WebView 是 Android 中用于展示网页内容、与 Web 页面交互的一个重要组件。
使用WebView,我们就可以自己做一个简易的浏览器
二.使用WebView
2.1 添加网络权限
!!!非常重要
网络权限一定要添加
<!-- 网络权限 -->
<uses-permission android:name="android.permission.INTERNET" />
按照下图所示,添加网络权限
2.2 修改布局xml文件
我放了几个button,用于控制网页的前进、后退、重新加载等功能
<?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:id="@+id/main"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<WebView
android:id="@+id/webview"
android:layout_width="match_parent"
android:layout_height="0dp"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toTopOf="@+id/bottom_view"/>
<RelativeLayout
android:id="@+id/bottom_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintBottom_toBottomOf="parent">
<Button
android:id="@+id/back"
android:layout_width="wrap_content"
android:layout_height="60dp"
android:text="后退"/>
<Button
android:id="@+id/go"
android:layout_width="wrap_content"
android:layout_height="60dp"
android:layout_toEndOf="@+id/back"
android:text="前进"/>
<Button
android:id="@+id/reload"
android:layout_width="wrap_content"
android:layout_height="60dp"
android:layout_toEndOf="@+id/go"
android:text="重新加载当前页面"/>
<EditText
android:id="@+id/editttext"
android:layout_width="250dp"
android:layout_height="60dp"
android:layout_alignLeft="@+id/back"
android:singleLine="true"
android:hint="www.bilibili.com"
android:layout_below="@+id/back"/>
<Button
android:id="@+id/gogo"
android:layout_width="wrap_content"
android:layout_height="60dp"
android:layout_alignParentRight="true"
android:layout_alignTop="@+id/editttext"
android:text="前往该网页"/>
</RelativeLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
实现这样的布局效果,上面为WebView,下面就是自己放的一些控件
2.3 修改kt文件
class MainActivity : AppCompatActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_main)
val webview: WebView = findViewById(R.id.webview)
val back: Button = findViewById(R.id.back)
val go: Button = findViewById(R.id.go)
val reload: Button = findViewById(R.id.reload)
val editttext: EditText = findViewById(R.id.editttext)
val gogo: Button = findViewById(R.id.gogo)
webview.settings.javaScriptEnabled=true//启用JavaScript的支持
webview.webViewClient= WebViewClient()//目标的网页仍然在当前WebView中显示
webview.loadUrl("https://www.baidu.com")//.将网址传入
webview.canGoBack()
//三个按钮点击事件,返回、前进、重新加载
back.setOnClickListener(){
webview.goBack()
}
go.setOnClickListener(){
webview.goForward()
}
reload.setOnClickListener(){
webview.reload()
}
//点击前往输入的网址
gogo.setOnClickListener(){
if (!editttext.text.toString().isNullOrEmpty()){
webview.webViewClient= WebViewClient()
webview.loadUrl("https://"+editttext.text.toString())
}else{
Toast.makeText(this,"请输入网址", Toast.LENGTH_LONG).show()
}
}
}
}
按照这样写,就可以实现WebView的功能
webview.settings.javaScriptEnabled=true//启用JavaScript的支持
webview.webViewClient= WebViewClient()//目标的网页仍然在当前WebView中显示
其中这两句比较重要,一定要启用 JavaScript
剩下的也比较简单了,我也都写了注释,相信可以看明白
( 对于输入框输入的网址判断没用写的很明确,我只写了判断是否为空 )
2.4 效果
按照这样编辑代码就可以实现最基础的WebView了
WebView 效果