Android UI开发利器-DataBinding

254 阅读5分钟
原文链接: mp.weixin.qq.com

DataBinding是谷歌官方推出的一个数据/UI绑定框架,官方解释是

The Data Binding Library is a support library that allows you to bind UI components in your layouts to data sources in your app using a declarative format rather than programmatically.

简单的说就是它提供了一种数据和UI绑定的方法,UI元素可以自动的根据数据的更新而自动改变。在没有DataBinding的情况下我们是这么更新视图的,先通过findViewById实例化视图控件比如 TextView,当数据发生改变时通过 setText 去更新UI。

而DataBinding能让我们免除这一切重复的工作,下面会以最简单的例子说明如何使用它。DataBinding非常简单,以至于对于新手来说只要按照这篇内容,不用20分钟就可以掌握它的使用方法。

配置环境

DataBinding是Support Library里已经内置的框架,你所需要的只是在需要使用的模块的 build.gradle里加上这一句

android {    ....    dataBinding {        enabled = true    }}

不需要添加更多的依赖,接下来就可以使用DataBinding了。

绑定数据和UI

DataBinding做的事情是把数据和视图绑定,为了有个初步的印象,可以把它分为两部分理解,一部分是数据,一部分是UI,也就是传统的layout。现从数据说起。

我们假定有一个数据bean叫UserInfo,它的结构是这样的

public class UserInfo{    String name;    int age;}

为了使用DataBinding,首先要让UserInfo继承BaseObservable类,并且实现getter/setter。对于setter方法来说,需要在数据变更之后调用notifiyProperty方法,对于getter,需要用@Bindable注释。修改后的代码如下

public class UserInfo extends BaseObservable{    String name;    int age;    @Bindable    public String getName() {        return name;    }    public void setName(String name) {        this.name = name;        notifyPropertyChanged(BR.name);    }    @Bindable    public int getAge() {        return age;    }    public void setAge(int age) {        this.age = age;        notifyPropertyChanged(BR.age);    }}

到这里就完成了大部分的准备工作了。注解是为了让DataBinding插件找到数据类型,notify方法的调用是通知观察者更新UI。

接下来我们要修改layout文件,把需要绑定的UI元素和数据用注解关联起来。对于这个例子来说,UI上分别有显示name和age的 TextView,和两个输入name和age的 EditText。EditText输入的数据会即时的更新到TextView上。视图中的 name 和 age 是需要注解的部分,注意这个注解是在xml文件中,而不是说在java的注解。首先在layout文件中声明变量,

<data>    <variable name="user" type="com.phoenix.databindingdemo.UserInfo"/></data>

以name为例子,修改TextView的 android:text属性为对变量 user.name的引用

<TextViewandroid:id="@+id/tv_name"android:layout_height="wrap_content"android:layout_width="wrap_content"android:textColor="@android:color/black"android:textSize="15sp"android:text="@{user.name}"/>

对于age来说有些类似,但有个问题,因为UserInfo的age是 int类型,直接写 user.age作为引用的话会导致崩溃,原因是int类型被当做资源索引作为参数,所以在对非String类型的属性进行设置的时候需要转换一下,DataBinding考虑到这点,允许开发者在xml中使用Java语法进行转换,对于age来说layout会变成下面这样,

<TextViewandroid:id="@+id/tv_age"android:layout_height="wrap_content"android:layout_width="wrap_content"android:textColor="@android:color/black"android:textSize="15sp"android:text="@{String.valueOf(user.age)}"/>

这里可以用String.valueOf对int类型的age进行转换。

下面进入正题,准备修改操作UI的代码了。我们要把使用findViewById的调用都给去除了,同时要移除的还有 setText这样的调用,我们也不再需要它们了。对于这个例子来说,我们定义的layout名字叫 activity_main.xml,DataBinding会自动帮我们生成类ActivityMainBinding,生成的规则是layout的名字加上Binding后缀。这就是我们的重点对象,下面是UI中的代码,

public class MainActivity extends Activity {    UserInfo mUser;    @Override    protected void onCreate(@Nullable Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        ActivityMainBinding binding = DataBindingUtil.setContentView(this, R.layout.activity_main);        mUser = new UserInfo();        binding.setUser(mUser);    }

mUser就是我们需要绑定的数据对象,在绑定完成后,每次对mUser的数据进行修改,在UI上会直接更新,而不需要我们手动去调用 setText方法。

DataBinding的原理和Demo资源

可能很多朋友看到数据类所继承的 BaseObservable 类就明白,其实DataBinding是一种观察者模式,它只是帮我们生成了样板代码,实际上也是观察者中的 notify -> update 结构。对于这部分原理我们在下一篇文章里进行分析。DataBinding是谷歌官方推出的框架,可以从下面这个链接上学习更多关于它的姿势,https://developer.android.com/topic/libraries/data-binding/,关于DataBinding还有很多限于篇幅没有仔细说明,比如事件监听,还有对于Adapter类型的数据怎么绑定,都可以在上面的链接中了解到。如果觉得对于你的项目来说DataBinding有作用的话,建议详细阅读链接中官方的文档,会节省你很多时间。

上面的例子代码可以在后台回复 "数据绑定" 获得,参考demo代码食用本篇文章效果更佳哦。

==== 今日沙雕 ====

(关于Matlab下标从1开始的梗)