Data Binding 解决了 Android UI 编程中的一个痛点,官方原生支持 MVVM 模型可以让我们在不改变既有代码框架的前提下,非常容易地使用这些新特性。其实在此之前,已经有些第三方的框架(RoboAndroid) 可以支持 MVVM 模型,无耐由于框架的侵入性太强,导致一直没有流行起来。
如何配置DataBinding到AndroidStudio中?
新的Gradle已经支持AndroidDataBinding的设置,我们应该在app-gradle中进行如下配置:
android{
....
defaultConfig{
....
}
dataBinding{
enabled true
}
}
具体的使用,请查看第三方文档http://www.jcodecraeer.com/a/anzhuokaifa/androidkaifa/2015/0603/2992.html。请注意,该配置说明已经过时。
现在开始重点说明,如何对控件绑定自定义属性。我们用的最多的是ImageView控件,以及给文本组件加一条删除线。
ImageView,如何让它加载网络图片
首先,我们应该定义相关的扩展类,如下:
/**
* Created by mrper on 17-2-22.
* 图片加载扩展
*/
public class ImageViewExt {
/**
* 展示网络图片
*
* @param imgView 图片控件对象
* @param url 图片加载地址
*/
@BindingAdapter({"url"})
public static void displayImage(ImageView imgView, String url) {
displayImage(imgView, url, null, null, false, 0);
}
/**
* 展示网络图片
*
* @param imgView 图片控件对象
* @param url 图片加载地址
* @param isCircle 是否是圆形
*/
@BindingAdapter({"url", "isCircle"})
public static void displayImage(ImageView imgView, String url, boolean isCircle) {
displayImage(imgView, url, null, null, isCircle, 0);
}
/**
* 展示网络图片
*
* @param imgView 图片控件对象
* @param url 图片加载地址
* @param isCircle 是否是圆形
* @param radius 圆角图形的圆角值
*/
@BindingAdapter({"url", "isCircle", "radius"})
public static void displayImage(ImageView imgView, String url, boolean isCircle, int radius) {
displayImage(imgView, url, null, null, isCircle, radius);
}
/**
* 展示网络图片
*
* @param imgView 图片控件对象
* @param url 图片加载地址
* @param placeholder 图片占位符
* @param errorholder 图片加载失败时的占位符
*/
@BindingAdapter({"url", "placeholder", "errorholder"})
public static void displayImage(ImageView imgView, String url, Drawable placeholder, Drawable errorholder) {
displayImage(imgView, url, placeholder, errorholder, false, 0);
// Picasso.with(imgView.getContext()).load(url).placeholder(placeholder).error(errorholder).fit().into(imgView);
}
/**
* 展示网络图片
*
* @param imgView 图片控件对象
* @param url 图片加载地址
* @param placeholder 图片占位符
* @param errorholder 图片加载失败时的占位符
* @param radius 圆角图片圆角半径
*/
@BindingAdapter({"url", "placeholder", "errorholder", "radius"})
public static void displayImage(ImageView imgView, String url, Drawable placeholder, Drawable errorholder, int radius) {
displayImage(imgView, url, placeholder, errorholder, false, radius);
}
/**
* 展示网络图片
*
* @param imgView 图片控件对象
* @param url 图片加载地址
* @param isCircle 是否是圆形图片
* @param placeholder 图片占位符
* @param errorholder 图片加载失败时的占位符
*/
@BindingAdapter({"url", "isCircle", "placeholder", "errorholder"})
public static void displayImage(ImageView imgView, String url, boolean isCircle, Drawable placeholder, Drawable errorholder) {
displayImage(imgView, url, placeholder, errorholder, isCircle, 0);
}
/**
* 展示网络图片
*
* @param imgView 图片控件对象
* @param url 图片加载地址
* @param placeholder 图片占位符
* @param errorholder 图片加载错误时的占位符
* @param isCircle 是否是圆形图片
* @param radius 圆角图形的圆角值
*/
@SuppressWarnings("unchecked")
@BindingAdapter({"url", "placeholder", "errorholder", "isCircle", "radius"})
public static void displayImage(ImageView imgView, String url, Drawable placeholder, Drawable errorholder, boolean isCircle, int radius) {
Context context = imgView.getContext();
DrawableTypeRequest drawableRequest = ImageLoader.getDrawableTypeRequest(context, url, placeholder, errorholder);
drawableRequest.bitmapTransform(isCircle ? new GlideCircleTransform(context) : new GlideRoundTransform(context, radius));
drawableRequest.into(imgView);
}
}
那么我们应该如何把定义的这些属性使用起来呢?下面请看一段界面xml示例,我们使用app:xxxx进行了相关的属性配置。就这样,我们的图片组件就能加载网络图片啦!
<ImageView
android:id="@+id/imgGoods"
android:layout_width="80dp"
android:layout_height="80dp"
android:layout_marginBottom="8dp"
android:layout_marginTop="8dp"
android:background="#efefef"
android:scaleType="centerCrop"
android:src="@drawable/ic_image_load_default"
app:errorholder="@{@drawable/ic_image_load_fail}"
app:placeholder="@{@drawable/ic_image_load_default}"
app:url="@{StringExt.toFullImageURL(goodsInfo.mgooImage)}" />
再举个栗子,TextView! 这个组件我们经常会给它添加删除线的属性,那么我们先定义一下删除线。如下:
/**
* Created by mrper on 17-2-22.
* 文本控件扩展
*/
public class TextViewExt {
/**
* 是否给TextView加上删除线
* @param txtView 文本控件
* @param isShowStrikeThrough 是否显示删除线
*/
@BindingAdapter("isShowStrikeThrough")
public static void showStrikeThrough(TextView txtView, boolean isShowStrikeThrough){
if(isShowStrikeThrough) {
Paint paint = txtView.getPaint();
paint.setAntiAlias(true);
paint.setFlags(Paint.STRIKE_THRU_TEXT_FLAG);
}
}
}
是不是已经熟悉了?重点是配置注解标签@BindingAdapter, 里面的参数即是要在xml中配置的属性名。再看看,如何使用这个自定义属性:
<TextView
android:id="@+id/txtOriginPrice"
android:text="一入IT深似海,从此节操是路人"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:isShowStrikeThrough="@{true}"
/>
差不多就这样了,哈哈,朋友们,请尽情享受写代码带来的快乐吧!