65.9K
CodeProject 正在变化。 阅读更多。
Home

Android 数据绑定库入门 - 第一部分

starIconstarIconstarIcon
emptyStarIcon
starIcon
emptyStarIcon

3.81/5 (6投票s)

2016 年 1 月 24 日

CPOL

4分钟阅读

viewsIcon

22467

downloadIcon

282

更快地编写 Android 应用程序。开始使用数据绑定库。

引言

在 Android 中,将数据与 UI 绑定是一项非常繁琐的任务。无论您构建什么来更新一个 UI 元素,您都必须通过 ID 找到它,然后将其转换为您正在使用的 widget,然后才能更新它。 没有正确的数据绑定方法。 随着 Google IO 2015 中数据绑定库的发布,有了一种更好的方法。 有了这个库,开发人员可以更快地编写应用程序。 它是支持库,并且一直支持到 API 版本 7(或 Android 2.1)。 查看本文附带的源代码和快照。

数据绑定库可以做什么

使用数据绑定库,您可以

  • 更快地编写应用程序
  • 从您的代码中删除“通过 ID 查找视图”和转换为 widget
  • 最大限度地减少绑定 UI 和数据所需的粘合代码
  • 为 XML 布局定义自定义属性
  • 绑定自定义变量和事件
  • 使用可观察字段,以便在绑定对象的状态发生变化时自动更新 UI(本文未涵盖)

这只是可能的一部分。 你可以做更多。 我将在即将发表的文章中发布更多内容。

设置 Android Studio

在开始探索和使用数据绑定库进行开发之前,需要一些步骤来设置您的 Android Studio IDE(必须是 1.3 或更高版本,Gradle 插件必须是 1.5 或更高版本)。 设置模块的 gradle 文件

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

在您的项目的 gradle 文件中添加此依赖项

classpath "com.android.databindig:databinder:1.0.-rc1"

就是这样。 您的 Android Studio 现在已准备好使用数据绑定库。

引用

如果您正在使用 Android 数据绑定库创建一个库项目,则使用您的库的项目必须在模块 gradle 文件中启用数据绑定(如上所述,不需要 databinder 依赖项)。 不要忘记在库的发行说明中提及这一点。

声明数据绑定布局

这是我们在 Android 中声明常规或普通布局的方式

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto">
    <TextView android:id="@+id/txt_version_name"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"......

对于编写数据绑定布局,布局 xml 的根元素必须更改为 <layout> 标签。 如果要使用变量填充 UI 元素,或者需要 import 语句,则可以选择包含一个数据标签。 这是一个例子。

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

    <data>

        <import type="org.drulabs.secretspy.VersionItem" />

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

        <variable
            name="vItem"
            type="VersionItem" />
    </data>

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="150dp">

        <TextView
            android:id="@+id/txt_version_name"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content".....

从上面的示例中可以看出,只需添加一点额外的代码,您就可以轻松编写数据绑定布局或迁移旧布局。 没有使用反射技巧。 所有处理都在编译时完成。 <layout> 标签告诉 XMLLayoutProcessor 这是一个数据绑定布局。 <data> 标签用于定义要在填充 UI 中使用的变量; 并导入自定义或其他类。 例如,如果在数据绑定表达式中使用 View.VISIBLE 属性(如下所示),则必须在使用之前导入 View 类。

一些数据绑定表达式

在前面的章节中,我解释了数据绑定库可以做什么。 这是您可以如何实现这些功能

  • 绑定自定义变量
    • 在上一节中描述的是自定义变量 (vItem)
    • 除此之外,您还可以绑定数组、列表、原始类型、稀疏列表、映射等
    • 所有声明和导入都在 <data> 标签内
  • 将基本 UI 逻辑移动到 XML 布局文件
    android:text="@{vItem.name.substring(1)}" //substring while setting value
    android:text='@{vItem.code + "(" + 
    	vItem.versionNum+")"}' //String manipulation
    android:visibility="@{vItem.even ? 
    	View.VISIBLE : View.INVISIBLE}" //setting attribute conditionally
  • 定义自定义属性
    app:imageURL="@{vItem.imageUrl}"

没有这样的自定义属性。 您可以使用自定义方法定义来绑定它,例如

@BindingAdapter("bind:imageURL")
public static void loadImage(ImageView img, String url) {
    Picasso.with(img.getContext()).load(url).into(img);
}

酷,不是吗? 你可以想象它的可能性。 一个很棒的例子是设置文本字体。 像 2 倍一样提高可读性。

app:textFont="@{'awesome-font.ttf'}"

@BindingAdapter("bind:textFont")
public static void setFont(TextView tv, String fontName) {
    String fontPath = "/assets/fonts/"+fontName;
    // set font in text view here
}

区别... 过去和现在

代码已大大简化

基本的 UI 逻辑已移动到 xml 布局。 您在上面看到的是 Activity 的简化版本。 所有通过 ID 查找视图、转换和将详细信息设置到 widget 的操作都消失了。

一个示例应用程序

我创建了一个示例应用程序来显示当前设备型号、制造商和操作系统版本图像在顶部,并在底部的 Recycler 视图中显示所有可用的 Android 操作系统版本。 查看本文附带的源代码中的基本字符串操作、使用列表和在 Recycler 视图适配器中绑定列表项。

查看下面的示例应用程序源。 或者从这里下载它 (https://goo.gl/KJDG4R)。 应用程序的快照

源代码: 下载 Secretspy.zip

历史

  • 版本 1.1
© . All rights reserved.