紙上得來終覺淺贝搁，絕知此事要躬行
Flux
Flux是Facebook在2014年提出的一種Web前端架構凡蚜，主要用來處理復雜的UI邏輯的一致性問題忘衍。AndroidFlux就是利用flux的思想在android平臺上的應用晴股。
flux最大的特點就是單向的數(shù)據(jù)流恃慧，它的UI狀態(tài)更新模式繼承了MVC模式的設計思想。flux框架中主要包含三個部分
- Dispatcher: flux中數(shù)據(jù)流的中轉樞紐添瓷，通過dispatcher把數(shù)據(jù)分發(fā)到store梅屉，傳送的對象是一個action
- Store: 包含應用的狀態(tài)和邏輯，它負責管理App中一片邏輯相關的UI區(qū)域
- View: 這里的view是view-controller鳞贷，負責數(shù)據(jù)分發(fā)和UI邏輯的處理坯汤，對應android中的Activity
借用一張官方的圖
從圖中可以看出數(shù)據(jù)是朝單一方向流動的，單項數(shù)據(jù)流是Flux模式的核心搀愧，各個View可以在響應用戶操作的時候產(chǎn)生新的action惰聂，新的action再通過dispatcher分發(fā)給store，store通過狀態(tài)或數(shù)據(jù)的變化再通知view發(fā)生相應的UI上的變化
Demo
下面通過一個官方的demo實踐一下flux框架咱筛。首先新建一個dispatcher類搓幌，從上面的簡介中可以看到，它負責向store分發(fā)數(shù)據(jù)迅箩，需要register()和unregister()兩個方法管理所有的store溉愁。同時需要dispatch()方法進行數(shù)據(jù)分發(fā)，因為分發(fā)的數(shù)據(jù)都會封裝為action饲趋，所以dispatch()方法的參數(shù)為action拐揭。
public class Dispatcher {
private final List<Store> stores = new ArrayList<>();
private Dispatcher() {
}
private static class Singleton {
private static Dispatcher INSTANCE = new Dispatcher();
}
public static Dispatcher getInstance() {
return Singleton.INSTANCE;
}
public void register(Store store) {
stores.add(store);
}
public void unregister(Store store) {
stores.remove(store);
}
public void dispatch(Action action) {
post(action);
}
private void post(Action action) {
for (Store store : stores) {
store.onAction(action);
}
}
}
dispatcher需要通過action封裝數(shù)據(jù)，下面看下action奕塑。action通過type來區(qū)分類型堂污，代碼如下
public class Action<T> {
private final String type;
private final T data;
public Action(String type, T data) {
this.type = type;
this.data = data;
}
public String getType() {
return type;
}
public T getData() {
return data;
}
}
這里用一個String類型的action進行測試，代碼如下
public class MessageAction extends Action<String> {
public static final String ACTION_NEW_MESSAGE = "new_message";
public MessageAction(String type, String data) {
super(type, data);
}
}
在官方的demo中建議使用ActionCreator來生成一個action爵川，ActionCreator可以用來生成action敷鸦，并將action傳遞給dispatcher，代碼如下
public class ActionCreator {
private Dispatcher mDispatcher;
private static class Singleton {
public static ActionCreator INSTANCE = new ActionCreator();
}
public ActionCreator create(Dispatcher dispatcher) {
this.mDispatcher = dispatcher;
return this;
}
public static ActionCreator getInstance() {
return Singleton.INSTANCE;
}
public void sendMessage(String message) {
MessageAction messageAction = new MessageAction(MessageAction.ACTION_NEW_MESSAGE, message);
mDispatcher.dispatch(messageAction);
}
}
接下來定義一個抽象類Store，主要用來向View發(fā)送changeEvent()時間扒披。這里采用了EventBus值依，也可以自己寫一個消息分發(fā)的方法。其中onAction(Action action)用來處理Dispatcher分發(fā)搞來的數(shù)據(jù)碟案。
public abstract class Store {
private static EventBus sEventBus;
public Store() {
sEventBus = new EventBus();
}
public void register(Object view) {
sEventBus.register(view);
}
public void unregister(Object view) {
sEventBus.unregister(view);
}
void emitStoreChange() {
sEventBus.post(changeEvent());
}
public abstract StoreChangeEvent changeEvent();
public abstract void onAction(Action action);
public static class StoreChangeEvent {
}
}
之后實現(xiàn)MessageStore愿险，實現(xiàn)Store中的abstract方法
public class MessageStore extends Store {
private Message mMessage = new Message();
public MessageStore() {
super();
}
public String getMessage() {
return mMessage.getMessage();
}
@Override
public StoreChangeEvent changeEvent() {
return new StoreChangeEvent();
}
@Subscribe
@Override
public void onAction(Action action) {
switch (action.getType()) {
case MessageAction.ACTION_NEW_MESSAGE:
mMessage.setMessage((String) action.getData());
break;
default:
}
emitStoreChange();
}
}
在流程中需要一個Model實體類，這里封裝一個只有String類型的Model類
public class Message {
private String message;
public Message() {
}
public Message(String message) {
this.message = message;
}
public String getMessage() {
return message;
}
public void setMessage(String message) {
this.message = message;
}
}
最后价说，在一個view-controller中監(jiān)聽和處理dispatcher分發(fā)的事件辆亏，在onStoreChange()中監(jiān)聽變化來刷新UI。
public class MainActivity extends AppCompatActivity implements View.OnClickListener {
private EditText mEditText;
private TextView mTextView;
private Button mEditButton;
private Dispatcher mDispatcher;
private ActionCreator mActionCreator;
private MessageStore mMessageStore;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initView();
init();
}
private void init() {
mDispatcher = Dispatcher.getInstance();
mActionCreator = ActionCreator.getInstance().create(mDispatcher);
mMessageStore = new MessageStore();
mDispatcher.register(mMessageStore);
}
private void initView() {
mEditText = (EditText) findViewById(R.id.edit_text);
mTextView = (TextView) findViewById(R.id.text_view);
mEditButton = (Button) findViewById(R.id.edit_button);
mEditButton.setOnClickListener(this);
}
@Override
public void onClick(View v) {
int id = v.getId();
if (id == R.id.edit_button) {
Editable text = mEditText.getText();
if (!TextUtils.isEmpty(text)) {
mActionCreator.sendMessage(text.toString());
}
}
}
@Override
protected void onResume() {
super.onResume();
mMessageStore.register(this);
}
@Override
protected void onPause() {
super.onPause();
mMessageStore.unregister(this);
}
@Subscribe
public void onStoreChange(Store.StoreChangeEvent event) {
mTextView.setText(mMessageStore.getMessage());
}
}
至此鳖目，就完成了一個簡單的flux的demo扮叨，在輸入框中輸入內(nèi)容后點擊button，通過ActionCreator創(chuàng)建Action领迈，并向dispatcher發(fā)送一個消息彻磁，再由dispatcher分發(fā)給個各個store，再通過store中的onAction()方法狸捅，將數(shù)據(jù)分發(fā)給view衷蜓，view收到數(shù)據(jù)收通過onStoreChange()方法刷新UI。當view觸發(fā)事件時尘喝，也通過ActionCreator創(chuàng)建一個Action磁浇，重復以上邏輯。
