GWT教程之 增加事件监听器

<!----><!----> <!-- /* Font Definitions */ @font-face {font-family:Wingdings; panose-1:5 0 0 0 0 0 0 0 0 0; mso-font-charset:2; mso-generic-font-family:auto; mso-font-pitch:variable; mso-font-signature:0 268435456 0 0 -2147483648 0;} @font-face {font-family:宋体; panose-1:2 1 6 0 3 1 1 1 1 1; mso-font-alt:SimSun; mso-font-charset:134; mso-generic-font-family:auto; mso-font-pitch:variable; mso-font-signature:3 135135232 16 0 262145 0;} @font-face {font-family:"\@宋体"; panose-1:2 1 6 0 3 1 1 1 1 1; mso-font-charset:134; mso-generic-font-family:auto; mso-font-pitch:variable; mso-font-signature:3 135135232 16 0 262145 0;} /* Style Definitions */ p.MsoNormal, li.MsoNormal, div.MsoNormal {mso-style-parent:""; margin:0cm; margin-bottom:.0001pt; text-align:justify; text-justify:inter-ideograph; mso-pagination:none; font-size:10.5pt; mso-bidi-font-size:12.0pt; font-family:"Times New Roman"; mso-fareast-font-family:宋体; mso-bidi-font-family:"Times New Roman"; mso-font-kerning:1.0pt; mso-bidi-language:AR-SA;} /* Page Definitions */ @page {mso-page-border-surround-header:no; mso-page-border-surround-footer:no;} @page Section1 {size:595.3pt 841.9pt; margin:72.0pt 90.0pt 72.0pt 90.0pt; mso-header-margin:42.55pt; mso-footer-margin:49.6pt; mso-paper-source:0; layout-grid:15.6pt;} div.Section1 {page:Section1;} /* List Definitions */ @list l0 {mso-list-id:1981036278; mso-list-template-ids:2046095588;} @list l0:level1 {mso-level-number-format:bullet; mso-level-text:; mso-level-tab-stop:36.0pt; mso-level-number-position:left; text-indent:-18.0pt; mso-ansi-font-size:10.0pt; font-family:Symbol;} ol {margin-bottom:0cm;} ul {margin-bottom:0cm;} --> <!---->

GWT教程之

增加事件监听器

和许多UI 框架一样，GWT 是基于事件驱动的。这意味着所以代码的执行要由其他事件做出响应。常常该事件由用户来触发，使用鼠标或键盘和应用程序接口来交互。

监听接口

在你响应一个事件之初，你先要告诉GWT 你对哪种类型的事件感兴趣。这称为事件注册。为注册一个事件，你需要给应用程序窗口指定一个特殊的监听器。当它发生的时候来声明一个事件，此监听器定义了一个或多个稍后要调用的方法。从窗口的视角来看，我们说窗口触发了一个可以前往任何监听器的事件。

注册事件

在GWT 中，可以使用很多不同的接口。例如，ClickListener 接口就是一个简单的单击事件的事件监听器。它仅仅包含了一个方法，onClick(Widget) 。当用户点击一个窗口声明单击事件的时候就会调用该方法。这样的窗口可以是一个Button   类。下面通过实践来弄清它，让我们返回到StockWatcher 例子中。在增加库存清单上我们已经建了一个按钮。现在我们通过调用ClickListener 接口来处理它的单击click 事件。

为此我们需要在适当的位置添加addClickListener(ClickListener) 的监听器。让我们继续在onModuleLoad() 方法中调用上面那个方法：

public void onModuleLoad() {

  // 设定库存类表的显示

  stocksFlexTable.setText(0, 0, "Symbol");

  stocksFlexTable.setText(0, 1, "Price");

  stocksFlexTable.setText(0, 2, "Change");

  stocksFlexTable.setText(0, 3, "Remove");

 

  // 为新增库存设定事件监听器

  addButton.addClickListener(new ClickListener() {

    public void onClick(Widget sender) {

      addStock();

    }

  });

 

  // 放到库存面板上。

  addPanel.add(newSymbolTextBox);

  addPanel.add(addButton);

 

  // assemble main panel

  mainPanel.add(stocksFlexTable);

  mainPanel.add(addPanel);

  mainPanel.add(lastUpdatedLabel);

 

  // 在HTML 元素id 为"stockList" 处嵌入主面板  RootPanel.get("stockList").add(mainPanel);

   

  // 将光标置于text box 中

  newSymbolTextBox.setFocus(true);

}

 

private void addStock() {

  // 当用户点击按钮时的执行的代码

}

你也需要在StockWatcher.java 头部增加2 条import 语句：

import com.google.gwt.user.client.ui.ClickListener;

import com.google.gwt.user.client.ui.Widget;

你可能注意到我们使用的实现ClickListener 的是匿名内部类。其内部定义了onClick(Widget)   方法，委托给一个新方法addStock() 。实际上。addStock() 才是我们验证库存符号和增加试图列表起作用的。

对于小一点的应用程序来说仅需要处理一些数目很小的相关的事件，这时使用匿名内部类足以完成这些小问题。但如果我们要对大量窗口注册事件，这种方法就没效率了，因为它导致了过多的独立监听器对象被创建。在这种情况下，对多个事件源来说指定包含的类实现监听器接口和使用独立的接口方法是比较好的方式。当窗口调用方法的时候，建议发送参数，这样你就可以知道哪个触发了该事件。这可以有效的使用内存但可能会多些代码，比如下面的例子：

public class ListenerExample extends Composite implements ClickListener {

  private FlowPanel fp = new FlowPanel();

  private Button b1 = new Button("Button 1");

  private Button b2 = new Button("Button 2");

 

  public ListenerExample() {

    initWidget(fp);

    fp.add(b1);

    fp.add(b2);

    b1.addClickListener(this);

    b2.addClickListener(this);

  }

 

  public void onClick(Widget sender) {

    if (sender == b1) {

      // handle b1 being clicked

    } else if (sender == b2) {

      // handle b2 being clicked

    }

  }

}

监听器适配器

现在回到StockWatcher 例子中. 如果我们在下部分中实现了addStock() 方法，用户就可以点击按钮来增加库存信息到列表中。为了方便起见，我们可以允许用户在newSymbolTextBox 内部使用键盘或通过敲击Enter 回车。为了达到这个目的，我们需要注册newSymbolTextBox's 的键盘事件通过KeyboardListener   中的addKeyboardListener(KeyboardListener) 方法。

查看KeyboardListener 接口，我们可以看出它包含了3 个监听方法：

• onKeyDown(Widget, char, int)   Fired when the user depresses a physical key.
• onKeyPress(Widget, char, int)   Fired when a keyboard action generates a character.
• onKeyUp(Widget, char, int)   Fired when the user releases a physical key.

在我们的例子中这好像太强大了，：我们只需要onKeyDown(Widget, char, int) 监听方法。我们需要一个类来允许我们绑定这个特殊的我们感兴趣的事件，忽略其他的。这也证明，GWT 为此目的建立了适配器类。Adapters 是简单的，空的，确定的一个特殊事件接口的实现。仅子类有适配器类，并对你想要注册的事件提供实现。

在StockWatcher 例子中, 我们实现了 KeyboardListenerAdapter   接口 并且重写了onKeyDown(Widget, char, int)   方法. 增加import:

import com.google.gwt.user.client.ui.KeyboardListenerAdapter;

之后在onModuleLoad() 方法中增加调用 addKeyboardListener(KeyboardListener) 具体如下:

// set up event listeners for adding a new stock

addButton.addClickListener(new ClickListener() {

  public void onClick(Widget sender) {

    addStock();

  }

});

 

newSymbolTextBox.addKeyboardListener(new KeyboardListenerAdapter() {

  @Override

  public void onKeyDown(Widget sender, char keyCode, int modifiers) {

    if (keyCode == KEY_ENTER) {

      addStock();

    }

  }

});

 

// assemble Add Stock panel

addPanel.add(newSymbolTextBox);

addPanel.add(addButton);

 

现在我们的事件监听器已整装待发，当我们要处理事件的时候，下一步将需要填写我们那个空的 addStock() 方法来增加库存信息到列表中。

 

 

 

评论

1 楼 diggywang 2010-02-15  

翻译的还行，只是有一个到处存在的错误，stock不是“存货”，而是“股票”