Android MVVM 初探之 DataBinding 显示数据

一， 概述

MVVM是Model-View-ViewModel的简写。微软的WPF带来了新的技术体验，如Silverlight、音频、视频、3D、动画……，这导致了软件UI层更加细节化、可定制化。同时，在技术层面，WPF也带来了诸如Binding、DependencyProperty、RoutedEvents、Command、DataTemplate、ControlTemplate等新特性。MVVM（Model-View-ViewModel）框架的由来便是MVP（Model-View-Presenter）模式与WPF结合的应用方式时发展演变过来的一种新型架构框架。它立足于原有MVP框架并且把WPF的新特性揉合进去，以应对客户日益复杂的需求变化。
以上内容源自搜狗百科

MVVM 一般而言有下面这些优点。

1. 低耦合。视图（View）可以独立于Model变化和修改，一个ViewModel可以绑定到不同的”View”上，当View变化的时候Model可以不变，当Model变化的时候View也可以不变。
2. 可重用性。你可以把一些视图逻辑放在一个ViewModel里面，让很多view重用这段视图逻辑。
3. 独立开发。开发人员可以专注于业务逻辑和数据的开发（ViewModel），设计人员可以专注于页面设计。
4. 可测试。界面素来是比较难于测试的，而现在测试可以针对ViewModel来写。

Android 上 MVVM 的兴起则是谷歌推出了 DataBinding 之后的事情，真正在 Android 上应用 MVVM 首先还是得了解 DataBinding 是如何使用的，本篇文章侧重于几个基本的 DataBinding 的使用。

一个应用的内容显示无非就是 文字， 图片， 视频三种内容。而视频一般是单独去实现的，图片和文字可以单独存在，也可能在列表中，如 ListView 或 RecyclerView。
接下来实现一下 单个文本 和 图片的 DataBinding

二，单个文本的显示
这里来根据谷歌官方的例子稍加更改实现。首先，将项目的 build.gradle 更改，开启 DataBinding

android {
    compileSdkVersion 26
    //...
    dataBinding{
        enabled = true
    }
}

其次，按照普通 Bean 文件的写法来写一个 User 的 Bean， 只需要名称和头像两个属性就够了。

public class User {
   
    private String name;
    private String headerUrl;

    public User(String name, String headerUrl){
        this.name = name;
        this.headerUrl = headerUrl;
    }

    public User(){}

    public String getName() {
        return name;
    }

    public void setName(String name) {
        this.name = name;
    }

    public String getHeaderUrl() {
        return headerUrl;
    }

    public void setHeaderUrl(String headerUrl) {
        this.headerUrl = headerUrl;
    }
}

然后，来定义我们的 activity_main.xml 文件，很无奈，由于 ImageView 并不能直接加上 网络路径就去访问，我们先把文字的显示出来，毕竟说 MVVM 那么好，后面更改的时候加一个 ImageView 也应该并不需要多大改动。

<?xml version="1.0" encoding="utf-8"?>
<layout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    tools:context=".MainActivity">
    <data>
        <variable name="user" type="me.leo.mvvm.bean.User"/>
    </data>
    <LinearLayout
        android:orientation="vertical"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textSize="30sp"
            android:text="@{user.name}"/>
    </LinearLayout>
</layout>

和以前的布局文件写法对比一下，可以发现最明显的一个差别在于， xml 文件的根 变为 layout 了。其次就是下面可以增加 data 结点，在结点中声明了 该 xml 文件的名称以及 类。
也就是在布局文件中用 xml 的格式定义了一个 变量而已， 变量的类型是 type, 变量的名称是 user， 如果有必要，我们应该还可以定义 user1, user2… 等等.
定义了变量之后，就