[GWT]利用 HandlerManager 實作共用的 Event Bus

原作者：tkcn

利用 HandlerManager 實作共用的 Event Bus

GWT 從版本 1.6 開始提供了新的 Event Model - Handler，並捨棄了原先的 Listener 方式。

關於 Listener 與 Handler 的差別，我推荐看這篇文章: GWT’s new Event Model – Handlers in GWT 1.6 [1]。

在這篇文章中，我將兩者與本篇文章有關的部份做介紹:


Listener:

1. 對於每一個 Event Source 會有一個對應的 Listener，例如 MouseListener, KeyboardListener...等。
2. 在每一個 Widget 中，針對每一種 Event Source 的 Listener，都會用一個獨立的 ListenerCollection 去紀錄。
   

Handler:

1. 每一個 Event Type 都會有一個對應的 Handler，因此原先 MouseListener 相關的事件，將會被重新區分成 MouseDownHandler, MouseUpHandler...等。這樣做的一個額外的好處是，當只需要針對一種 Event Type 做處理時，實作 Handler 的類別只需要 over-ridding 一個對應的 method，而不需要像寫 Listener 時，仍然需要 over-ridding 其他沒用到的 method。
2. 每一個 Widget 中，都只會有一個 HandlerManager，負責紀錄所有的 Event Handler。

由於 HandlerManager 能夠針對不同的 Event，dispatch 其對應的 Handler 去處理，因此我們也可以利用 HandlerManager 來做為整個 Web App 共用的 Event Bus。[2], [3]


先說明一下本篇文章欲使用的例子：
在一個 Web App 上，有許多的 Panel，我們現在希望當按下 A Panel 上的 Button 時，B Panel 上的 TextBox 會輸出文字。

在原本的做法裡，我們會讓 A panel 實作 ClickHandler，當 A panel 收到事件時，就去呼叫 B panel 所提供的方法。

這個作法會使得 A panel 必須持有 B panel 的 reference(就 UML 的角度來說就是 A 對 B 有 Aggregation 關係)，這樣會使得 A, B 之間的耦合度高，造成未來擴充、修改的困難。

接下來就是解決辦法啦！

1. 首先，於 EntryPoint 建立 HandlerManager 物件，並且將 Reference 傳給所有的 sub-component，這個部份可以利用 Constructor 達成。
   HandlerManager eventBus = new HandlerManager(null);
2. 然後在 B panel 裡頭寫上事件處理，並且向 Event Bus 註冊。
   
@Override
protected onLoad(){
// register event handler
fooRegistration = eventBus.addHandler(FooEvent.TYPE, new FooHandler(){
@Override
public void onFoo(FooEvent event) {
textBox.setText("A panel's button click!");
}
});
}

@Override
protected onUnload(){
// unregister event handler
fooRegistration.removeHandler();
}

   
3. 最後是 A panel 的事件觸發，當按下按鈕時:
   
eventBus.fireEvent(new FooEvent());

   

這樣一來，A 與 B 彼此可以完全不知道對方的存在，將可以大大的降低耦合度。