前言
android中webview打卡前端页面时受到网路环境,页面内容大小的影响有时候会让用户等待很久。显示一个加载进度条可以提升很大的体验。微信内访问h5页面加载效果不错,效仿着写了一个。
1.实现
1-1.自定义类继承webview类
class progresswebview(context: context, attr: attributeset) : webview(context, attr) { /** *xml布局中使用,所以用两个构造参数的构造函数 */ private var progressbar: progressbar? = null /** *初始化属性操作 */ init { /** *设置progressbar是横向 */ progressbar = progressbar(context, null, android.r.attr.progressbarstylehorizontal) /** *设置进度条属性 */ progressbar!!.progressdrawable = context.resources.getdrawable(r.drawable.webview_hori_progress) /** *设置progressbar的布局参数 */ val layoutparams = framelayout.layoutparams(layoutparams.match_parent, 10, 0) /** *绑定参数 */ progressbar!!.layoutparams = layoutparams /** *将progressbar添加到webview上 默认头部 */ addview(progressbar) /** *设置webview辅助类webchromeclient,获取实时加载进度 */ setwebchromeclient(object : webchromeclient() { override fun onprogresschanged(webview: webview?, progress: int) { super.onprogresschanged(webview, progress) log.d("progressview", progress.tostring()) if (progress == 100) progressbar!!.visibility = view.gone else { progressbar!!.visibility = view.visible /** *设置进度参数 */ progressbar!!.progress = progress } } }) }}
看下设置的加载进度条的属性,webview_hori_progress.xml
<layer-list xmlns:android="http://schemas.android.com/apk/res/android"> <!--最下层item属性--> <item> <shape> <!--无圆角--> <corners android:radius="0dp" /> <!--线条颜色--> <gradient android:endcolor="#ffe4e3e3" android:startcolor="#ffe4e3e3" /> </shape> </item> <!--上层item属性--> <item> <clip> <shape> <!--无圆角--> <corners android:radius="0dip" /> <!--线条颜色 渐变,由深到浅--> <gradient android:centercolor="#96ef1627" android:endcolor="#50f53d4b" android:startcolor="#ffef1627" /> </shape> </clip> </item></layer-list>
1-2.xml 布局中引用
<com.ypl.csdndemo.progresswebview android:id="@+id/wvprogress" android:layout_width="match_parent" android:layout_height="match_parent"/>
1-3.代码实现
/** *android kotlin 的拓展,导入此包 使用到的组件不用findviewbyid */import kotlinx.android.synthetic.main.activity_main.*class mainactivity : appcompatactivity() { override fun oncreate(savedinstancestate: bundle?) { super.oncreate(savedinstancestate) setcontentview(r.layout.activity_main) /** *webview设置属性 */ val setting = wvprogress.settings /** *本地缓存无则网络 */ setting.cachemode = websettings.load_cache_else_network /** *设置识别javascript代码 */ setting.javascriptenabled = true /** *纵向scrollbar去除 */ wvprogress.isverticalscrollbarenabled =false /** *加载页面 */ wvprogress.loadurl("https://blog.csdn.net/") }}
2.效果图
以上就是本文的全部内容,希望对大家的学习有所帮助,更多相关内容请关注!
相关推荐:
利用css实现一款仿ios7的switches开关按钮
以上就是使用android仿微信加载h5页面的进度条的详细内容。
