Android Databinding 从入门到转行(一)初步介绍

转载请声明:http://blog.csdn.net/yoyo_newbie/article/details/51955426

这是google官方的介绍,不过需要翻墙,你懂的。。。。https://developer.android.com/topic/libraries/data-binding/index.html


这官方上的简介,翻译过来是酱紫的:

Data Binding Library提供了灵活性和广泛的兼容性-这是一个支持库,前提是要使用版本Android 2.1(API级别7+)以上。

要使用Data Binding,就要提供Gradle 1.5.0-α1 或更高版本。

构建环境


要开始使用数据绑定,从在Android SDK管理器支持库下载库。

要配置您的应用程序使用数据绑定,添加绑定 元素,您的build.gradle应用模块中的文件。

使用下面的代码片段来配置数据绑定:

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

如果您有依赖于它使用数据绑定的库的应用程序模块,应用程序模块必须配置数据在其绑定的build.gradle文件中。

此外,请确保您使用的是 Android Studio,兼容版本  Android Studio1.3及更高版本提供了数据描述绑定支持数据绑定的Android Studio支持




----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------


接下来,不吹比了,上码!

需求: 用户介绍页面---已知一用户的姓名和年龄,分别为Sam,年龄25,要求显示。


第一步,找到主项目的app文件夹下的build.gradle文件,然后添加

dataBinding {
    enabled = true
}
然后,rebuild项目
如图





第二步:编写视图xml

在layout文件夹下创建个main_activity.xml,这时候就有人嘲讽,一看就知道菜鸡,命名规范都不会,应该是activity_main.xml。呵呵哒,看完下面你就知道为什么要这样取名字了。


<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:padding="16dp"
    android:orientation="vertical"
    >


    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        >
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="姓名:"
            />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="未知"
            />
    </LinearLayout>


    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:layout_marginTop="@dimen/activity_vertical_margin"
        >
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="年龄:"
            />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="未知"
            />
    </LinearLayout>



</LinearLayout>

预览图:






注意, 还没结束,我们还得改改,使用databingding的视图,格式发生了改变至于(data 里面是什么鬼,别急!往下看!)

格式为:

<layout   xmlns:android="http://schemas.android.com/apk/res/android">
    
    <data>
        
        
    </data>
    
   xml视图内容
    
  
</layout>


因此,改动为:

<?xml version="1.0" encoding="utf-8"?>
<layout   xmlns:android="http://schemas.android.com/apk/res/android">

    <data>

    </data>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:padding="16dp"
        android:orientation="vertical"
        >


        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:orientation="horizontal"
            >
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="姓名:"
                />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="未知"
                />
        </LinearLayout>


        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:orientation="horizontal"
            android:layout_marginTop="@dimen/activity_vertical_margin"
            >
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="年龄:"
                />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="未知"
                />
        </LinearLayout>

    </LinearLayout>
</layout>


这时候!!!Android studio 就会生成,一个叫 MainActivityBinding.class文件给你(不用找,不会出现在你编写包里,看不见)。 这东西有什么用,往下看。

这时候就知道为什么命名xml的名字为main_activity了吧?如果为activity_main那么生成的文件叫ActivityMainBinding.


然后我们再创建个Activity, 包名为
com.yoyonewbie.mvvm.view.activity

主意,使用databingding 后 ,activity 在这不再充当view controller角色,而是view(可参考MVVM架构)

package com.yoyonewbie.mvvm.view.activity;

import android.databinding.DataBindingUtil;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;

import com.yoyonewbie.test.R;
import com.yoyonewbie.test.databinding.MainActivityBinding;

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        MainActivityBinding mainActivityBinding = DataBindingUtil.setContentView(this, R.layout.main_activity);
    }


}

配置MainActivity到AndroidManifest.xml后,运行效果为






UI终于刷出来了!!!赶紧下一步!

第三步:编写View Model 
创建一个UserModel.class用来与用户简介交互


package com.yoyonewbie.mvvm.vm;


public class UserModel {

    public   String name="未知";

    public  String  age;

    /**
     * 是刷新用户数据,显示用户名字为Sam,年龄为25
     */
    public void freshUserInfo()
    {
        name = "Sam";
        age =  "25";
    }


}

第四步:将View Model与 View绑定

这里也就是把UserModel和MainActivity绑定。

修改main_activity.xml


<?xml version="1.0" encoding="utf-8"?>
<layout   xmlns:android="http://schemas.android.com/apk/res/android">

    <data>
        <variable
            name="userModel"
            type="com.yoyonewbie.mvvm.vm.UserModel"
            />
    </data>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:padding="16dp"
        android:orientation="vertical"
        >


        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:orientation="horizontal"
            >
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="姓名:"
                />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="@{userModel.name}"
                />
        </LinearLayout>


        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:orientation="horizontal"
            android:layout_marginTop="@dimen/activity_vertical_margin"
            >
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="年龄:"
                />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="@{userModel.age}"
                />
        </LinearLayout>

    </LinearLayout>
</layout>

修改MainActivity


package com.yoyonewbie.mvvm.view.activity;

import android.databinding.DataBindingUtil;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;

import com.yoyonewbie.mvvm.vm.UserModel;
import com.yoyonewbie.test.R;
import com.yoyonewbie.test.databinding.MainActivityBinding;

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        MainActivityBinding mainActivityBinding = DataBindingUtil.setContentView(this, R.layout.main_activity);
        UserModel user = new UserModel();
        mainActivityBinding.setUserModel(user);
        user.freshUserInfo();
    }


}


data 的 variable的name 可以理解为,当前界面的引用,当你编写了这个值XXX,XXXBinding就会生成一个setXXX方法来设置引用。如这里是userModel, 那么对应的 MainActivityBinding就会生成一个方法叫setUserModel来绑定。
通过@{引用.属性}表达式来同步视图。如这里的android:text="@{userModel.age}", 当UserModel的age变化的时候,
这个年龄的text也会随之改变,就是这么叼!!!不信你自己试试!!!!

预览效果:











发布了77 篇原创文章 · 获赞 9 · 访问量 10万+
展开阅读全文

没有更多推荐了,返回首页

©️2019 CSDN 皮肤主题: 大白 设计师: CSDN官方博客

分享到微信朋友圈

×

扫一扫,手机浏览