Kotlin语言使用WebView示例介绍

 更新时间:2022年09月07日 08:34:36   作者:枕上书531  
随着后台技术的不断发展,App前端的应用都布置了Web页面的界面,这个界面就是由WebView组件渲染出来的。WebView由如下优点:可以直接显示和渲染Web页面或者网页;可以直接调用网络上或者本地的html文件,也可以和JavaScript交互使用

1、WebView类提供的常用方法

2、WebView的简单用法实现浏览网页

步骤:

布局文件

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

MainActivity.kt文件

1、启用JavaScript的支持

调用WebSetting类的setJavaScriptEnabled()方法,设置启动JavaScript的支持

val webView:WebView=findViewById(R.id.webView)
webView.settings.javaScriptEnabled=true

2、目标的网页仍然在当前WebView中显示

调用WebView的setWebViewClient()方法,从一个网页跳转到另一个网页时,跳转的网页也在webView中显示

webView.webViewClient= WebViewClient()

3、将网址传入

调用WebView的loadUrl方法,将网址传入,显示网页内容

webView.loadUrl("https://www.baidu.com")

AndroidManifest文件

加入权限声明

访问网络时需要声明权限的,在AndroidManifest中加入以下权限声明

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

3、结合WebView方法做一个迷你浏览器

<LinearLayout 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"
    android:orientation="vertical">
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal">
        <Button
            android:id="@+id/back"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="back"/>
        <Button
            android:id="@+id/forward"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="forward"/>
        <Button
            android:id="@+id/refresh"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="refresh"/>
    </LinearLayout>
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal">
        <EditText
            android:id="@+id/edittext"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="2" />
        <Button
            android:id="@+id/go"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="go" />
    </LinearLayout>
    <WebView
        android:id="@+id/webView"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
         />
</LinearLayout>
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 forward:Button=findViewById(R.id.forward)
        val refresh:Button=findViewById(R.id.refresh)
        val go:Button=findViewById(R.id.go)
        val edittext:EditText=findViewById(R.id.edittext)
        //浏览网页
        webView.settings.javaScriptEnabled=true//启用JavaScript的支持
        webView.webViewClient= WebViewClient()//目标的网页仍然在当前WebView中显示
        webView.loadUrl("https://www.baidu.com")//.将网址传入
        //按键的点击事件
        back.setOnClickListener {
            webView.goBack()//返回
        }
        forward.setOnClickListener {
            webView.goForward()//前进
        }
        refresh.setOnClickListener {
            webView.reload()//重新加载当前页面
        }
        go.setOnClickListener {
            if(edittext.text.toString()!=null) {//判断是否输入网址
                webView.loadUrl("http://" +edittext.text.toString())//加载输入的网址
                webView.webViewClient=WebViewClient()
            }
        }
    }
}
<uses-permission android:name="android.permission.INTERNET"/>

最终的效果图如下

4、加载本地html页面

新建html的方法(android studio)

右键点击main->"New"->"Folder"->"Assets Folder"

在文件名的后面加".html"

步骤

1.在布局文件中添加WebView组件

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

2、调用WebView的loadUrl()方法(注意是三条///)

val webView:WebView=findViewById(R.id.webView)
        webView.loadUrl("file:///android_asset/a.html")

5、于JavaScript交互调用

WebSetting类提供的常用方法

步骤

在布局文件中添加WebView,调用WebSetting类的setJavaScriptEnabled()方法,设置启动JavaScript的支持,调用WebView的setWebViewClient()方法,调用WebView的loadUrl方法,将html文件传入,新建JavaScriptObject类,调用addJavascriptInterface方法,这样,我们就可以通过js直接使用app,执行JavaScriptObject类里面的方法。

例子展示JavaScript调用Android的通话功能

html文件

<html>
  <head>
    <title>JavaScript交互</title>
  </head>
   <body>
      hello
   </body>
</html>
<script language="JavaScript">
    app.call("10086");
</script>

布局文件(上面已有,就不多放代码了)

AndroidManifest文件

class MainActivity : AppCompatActivity() {
    class JavaScriptObject(var context: Context) {
        @JavascriptInterface//一定要添加这个标签,将该方法暴露给JavaScript
           fun call(n:String)
           {
               var intent= Intent(Intent.ACTION_DIAL).setData(Uri.parse("tel:" + n));
               startActivity(context,intent,null);
           }
    }
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
        val webView:WebView=findViewById(R.id.webView)
        webView.webViewClient=WebViewClient()
        webView.settings.javaScriptEnabled=true;
        webView.loadUrl("file:///android_asset/a.html")
        webView.addJavascriptInterface(JavaScriptObject(this),"app")
    }
}

在"Manifest"文件添加电话的权限

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

运行结果如图

到此这篇关于Kotlin语言使用WebView示例介绍的文章就介绍到这了,更多相关Kotlin WebView内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • 深入理解Android MD5数据加密

    深入理解Android MD5数据加密

    在Android中需要对各种数据进行加密的操作,比如用户短信备份的数据加密、用户账户登陆的密码加密以及应用于服务器连接传递重要数据的加密,用处非常的多,所以今天来总结一下MD5加密算法。
    2016-09-09
  • Android自定义View实现多边形统计图示例代码

    Android自定义View实现多边形统计图示例代码

    这篇文章主要给大家介绍了关于Android自定义View如何实现多边形统计图的相关资料,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧。
    2018-01-01
  • Android QQ新用户注册界面绘制

    Android QQ新用户注册界面绘制

    这篇文章主要为大家详细介绍了Android QQ新用户注册界面绘制代码,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2016-09-09
  • 详解Android Selinux 权限及问题

    详解Android Selinux 权限及问题

    本篇文章主要介绍了详解Android Selinux 权限及问题,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-11-11
  • 轻松实现Android仿淘宝地区选择功能

    轻松实现Android仿淘宝地区选择功能

    这篇文章主要介绍了轻松实现Android仿淘宝地区选择功能的相关资料,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2016-06-06
  • 详解利用Flutter中的Canvas绘制有趣的图形

    详解利用Flutter中的Canvas绘制有趣的图形

    本文将利用Flutter中的Canvas绘制三个有趣的图形:使用等边三角形组合成彩虹伞面、五角星和彩虹,快来跟随小编一起动手尝试一下吧
    2022-03-03
  • Android View源码解读 DecorView与ViewRootImpl浅谈

    Android View源码解读 DecorView与ViewRootImpl浅谈

    这篇文章主要解读了Android View源码,为大家详细介绍DecorView与ViewRootImpl,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-02-02
  • AndroidStudio:手势识别

    AndroidStudio:手势识别

    这篇文章主要介绍了AndroidStudio手势识别,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2019-04-04
  • Android提高之SurfaceView与多线程的混搭实例

    Android提高之SurfaceView与多线程的混搭实例

    这篇文章主要介绍了Android提高之SurfaceView与多线程的混搭,很实用的功能,需要的朋友可以参考下
    2014-08-08
  • android轻松管理安卓应用中的log日志 发布应用时log日志全部去掉的方法

    android轻松管理安卓应用中的log日志 发布应用时log日志全部去掉的方法

    android合理的管理log日志,在开发的时候打印出来,在发布的时候,把所有的log日志全部关掉,下面就把方法给你一一道来
    2013-11-11

最新评论