当前位置: 首页 > 知识库问答 >
问题:

Webview和ProgressBar的双向数据绑定

乐钱青
2023-03-14
@BindingAdapter({"app:webUrl"})
    public void configureWebView(WebView iWebView, String iUrl) {

        iWebView.getSettings().setJavaScriptEnabled(true);
        iWebView.setWebViewClient(new WebViewClient() {

            @Override
            public void onPageFinished(WebView view, String url) {
                super.onPageFinished(view, url);
                // code to set visibility of progress bar
            }
        });

        iWebView.loadUrl(iUrl);
    }

/////////////////布局

<layout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto">

    <data>

        <import type="android.view.View" />

        <variable
            name="newsUrl"
            type="com.example.bindingdemo.data.model.Post" />
    </data>


    <android.support.constraint.ConstraintLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <WebView
            android:id="@+id/news_web_view"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_margin="8dp"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintLeft_toLeftOf="parent"
            app:layout_constraintRight_toRightOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            app:webUrl="@{newsUrl.url}" />

        <ProgressBar
            android:id="@+id/news_prog_bar"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:visibility="@{**<WhatConditionToWrite>** ? View.GONE: View.Visible}"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintLeft_toLeftOf="parent"
            app:layout_constraintRight_toRightOf="parent"
            app:layout_constraintTop_toTopOf="parent" />

    </android.support.constraint.ConstraintLayout>
</layout>

共有1个答案

赏高格
2023-03-14

绑定适配器

@BindingAdapter({ "setWebViewClient" })
public static void setWebViewClient(WebView view, WebViewClient client) {
    view.setWebViewClient(client);
}

@BindingAdapter({ "loadUrl" })
public static void loadUrl(WebView view, String url) {
    view.loadUrl(url);
}

viewmodel

public class YourObjectModel extends BaseObservable {

    private class Client extends WebViewClient {
        @Override
        public void onReceivedError(WebView view, WebResourceRequest request,
            WebResourceError error) {
            super.onReceivedError(view, request, error);
            setHideProgress(true);
        }

        @Override
        public void onPageFinished(WebView view, String url) {
            super.onPageFinished(view, url);
            setHideProgress(true);
        }
    }

    public WebViewClient getWebViewClient() {
        return new Client();
    }

    @Bindable
    public boolean isHideProgress() {
        return hideProgress;
    }

    private void setHideProgress(boolean hideProgress) {
        this.hideProgress = hideProgress;
        notifyPropertyChanged(BR.hideProgress);
    }
}

XML

<layout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto">
    <data>
        <variable
            name="viewModel"
            type="YourObjectModel"
            />
    </data>
    <WebView 
            ... 
            app:loadUrl="@{viewModel.url}"  
            app:setWebViewClient="@{viewModel.webViewClient}" />
    <ProgressBar 
            ... 
            android:visibility="@{viewModel.hideProgress ? View.GONE : View.VISIBLE}" />

</layout>
 类似资料:
  • 1. 前言 本小节我们将介绍 Vue 中数据的双向绑定指令 v-model。v-model 的学习相对简单 我们可以用 v-model 指令在表单 、 及 元素上创建双向数据绑定。它会根据控件类型自动选取正确的方法来更新元素。它负责监听用户的输入事件以更新数据,并对一些极端场景进行一些特殊处理。 2. 慕课解释 用 v-model 指令在表单 、 及 元素上创建双向数据绑定。它会根据控件类型自动选

  • 出于好奇和增加知识,我想在dom元素和javascript变量之间实现某种双向数据绑定。 我很幸运,在这里@stackoverflow找到了一个很好的答案,解决了我一半的问题,这就引出了这个要点https://gist.github.com/384583,但我仍然无法100%完成这件事。 下面是我的代码示例:http://jsfiddle.net/bpH6Z/ 如果您尝试运行fiddle并单击“查

  • 本文向大家介绍Nuxt.js 数据双向绑定的实现,包括了Nuxt.js 数据双向绑定的实现的使用技巧和注意事项,需要的朋友参考一下 假定我们有一个需求,一开始通过mounted()将一个字符串渲染在页面上,但是我们经过操作后修改了数据并且需要将得到的结果重新异步渲染到页面中去,而不是跳转刷新页面来重新渲染 首先模板中data()中定义数据,并且要将定义的数据显示出来 然后我们通过methods里的

  • 本文向大家介绍Vue实现双向数据绑定,包括了Vue实现双向数据绑定的使用技巧和注意事项,需要的朋友参考一下 Vue实现双向数据绑定的方式,具体内容如下 Vue是如何实现双向数据绑定的呢?答案是前端数据劫持。其通过Object.defineProperty()方法,这个方法可以设置getter和setter函数,在setter函数中,就可以监听到数据的变化,从而更新绑定的元素的值。 实现对象属性变化

  • 本文向大家介绍vue数据双向绑定的注意点,包括了vue数据双向绑定的注意点的使用技巧和注意事项,需要的朋友参考一下 最近一个vue和element的项目中遇到了一个问题: 动态生成的对象进行双向绑定是失败 直接贴代码: 上面一个简单的element的表单;addClass就是我要将数据绑定到的对象;他初始是一个空对象;我需要在其他地方读取然后给他添加属性,同时给表单进行绑定。 在这个过程中就发现,

  • 问题内容: 我一直在尝试定义指令,以便可以根据字段的类型及其参数(存储在数据库中)以表格形式显示不同的“窗口小部件”。我需要对不同类型的场景做出反应,因此需要使用指令来处理布局。 在玩一些示例时,我想出了 kinda 可以工作的代码: HTML 指示 这似乎可行(尽管明显比* proper * angularJS变量绑定要慢),但我认为必须有更好的方法来做到这一点。谁能阐明这件事? 问题答案: 我