RxBinding的使用，实现数据和View的绑定

rxbinding是一个开源项目,可以实现数据层与View层的绑定，当数据发生变化，View会自动更新UI。还有其他功能非常强大，github地址 
https://github.com/ogaclejapan/RxBinding

下面使用AndroidStudio写一个小例子，点击button让sharedpreferences中的内容发生改变，textview订阅到变化自动更新文本。效果很简单，如下图 


 

图怎么这么大，怎么改小= =

1、首先配置 

在app的build.gradle中dependencies节点添加 

compile ‘io.reactivex:rxjava:1.0.14’ 

compile ‘io.reactivex:rxandroid:1.0.1’ 

compile ‘com.ogaclejapan:rxbinding:1.2.0’ 

lambda表达式配置参考http://blog.csdn.net/forad/article/details/49100317

2、看代码

<code class="hljs avrasm has-numbering" style="display: block; padding: 0px; color: inherit; box-sizing: border-box; font-family: "Source Code Pro", monospace;font-size:undefined; white-space: pre; border-radius: 0px; word-wrap: normal; background: transparent;">package <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">com</span><span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.example</span><span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.administrator</span><span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.testrxbinding</span><span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">;</span>

import android<span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.content</span><span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.SharedPreferences</span><span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">;</span>
import android<span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.support</span><span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.v</span>7<span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.app</span><span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.AppCompatActivity</span><span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">;</span>
import android<span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.os</span><span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.Bundle</span><span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">;</span>
import android<span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.view</span><span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.Menu</span><span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">;</span>
import android<span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.view</span><span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.MenuItem</span><span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">;</span>
import android<span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.widget</span><span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.Button</span><span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">;</span>
import android<span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.widget</span><span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.TextView</span><span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">;</span>

import <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">com</span><span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.ogaclejapan</span><span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.rx</span><span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.binding</span><span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.Rx</span><span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">;</span>
import <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">com</span><span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.ogaclejapan</span><span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.rx</span><span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.binding</span><span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.RxProperty</span><span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">;</span>
import <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">com</span><span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.ogaclejapan</span><span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.rx</span><span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.binding</span><span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.RxView</span><span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">;</span>

import rx<span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.Observable</span><span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">;</span>

public class MainActivity extends AppCompatActivity {
private Button mBtn<span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">;</span>
private TextView mTv<span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">;</span>
//属性对象，封装了要观察的数据
private RxProperty<String> spContent = RxProperty<span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.create</span>()<span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">;</span>
private SharedPreferences mSP<span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">;</span>

@Override
protected void onCreate(Bundle savedInstanceState) {
super<span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.onCreate</span>(savedInstanceState)<span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">;</span>
setContentView(R<span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.layout</span><span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.activity</span>_main)<span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">;</span>

mBtn = (Button) findViewById(R<span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.id</span><span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.btn</span>)<span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">;</span>
mTv = (TextView) findViewById(R<span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.id</span><span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.tv</span>1)<span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">;</span>

mSP = this<span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.getSharedPreferences</span>(<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"my_sharedpreference"</span>, MODE_PRIVATE)<span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">;</span>

//给sp注册监听器
mSP<span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.registerOnSharedPreferenceChangeListener</span>(spListener)<span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">;</span>

mSP<span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.edit</span>()<span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.putString</span>(<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"key"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"我是原值"</span>)<span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.apply</span>()<span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">;</span>

//点击button改变SharedPreferences中的值
mBtn<span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.setOnClickListener</span>(v -> {
mSP<span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.edit</span>()<span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.putString</span>(<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"key"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"我是改后的值"</span>)<span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.apply</span>()<span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">;</span>
}
)<span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">;</span>

//原始写法
<span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">/*RxView.of(mTv).bind(spContent, new Rx.Action<TextView, CharSequence>() {
@Override
public void call(TextView textView, CharSequence charSequence) {
textView.setText(charSequence);
}
});*/</span>

//使用RxView将需要绑定的View对象和属性对象进行绑定，当属性对象的内容（被观察者）发生变化
//观察者RxView，会观察到并自动更新UI
RxView<span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.of</span>(mTv)<span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.bind</span>(spContent, (v, content) -> {
v<span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.setText</span>(content)<span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">;</span>
})<span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">;</span>
}

//原始写法
<span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">/*private SharedPreferences.OnSharedPreferenceChangeListener spListener = new SharedPreferences.OnSharedPreferenceChangeListener() {
@Override
public void onSharedPreferenceChanged(SharedPreferences sharedPreferences, String key) {
spContent.set(sharedPreferences.getString(key, ""));
}
});*/</span>

//使用lambda写法
private SharedPreferences<span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.OnSharedPreferenceChangeListener</span> spListener = (sp, key) -> {
spContent<span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.set</span>(sp<span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.getString</span>(key, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">""</span>))<span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">;</span>
}<span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">;</span>

@Override
public void finish() {
super<span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.finish</span>()<span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">;</span>
//记得取消注册       mSP<span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.unregisterOnSharedPreferenceChangeListener</span>(spListener)<span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">;</span>
}
}</code>