GWTでJavaScriptを書かないAjax開発--第6回:イベント処理の組み込み - (page 3)

沖林正紀

2007-11-22 23:12

リスナーの組み込み(選択肢の変更で画像切り替え)

 選択肢を変更したら画像が切り替わるようにするには、ListBoxに対してChangeListenerを追加するという方法をとる(リスト5)。

 ChangeListenerはJavaインタフェースだが、new ChangeListener() { ... }のようにしてChangeListenerの実装クラスを定義することが可能だ。もちろん、別途実装クラスを作成して組み込んでもかまわない。

 なお、ここでは画像切り替え用のDeckPanelをRootPanelからたどって取得しているが、必ずしもこのようにしなくてもよい。

リスト5 リスナーの組み込み(Java)

lBox.addChangeListener( new ChangeListener()  {  // 選択肢が変更されたら
  public void onChange( Widget sender )  {       // 以下の処理を行う
    // 画像を切り替えるDeckPanelの取得(リスト4参照)
    HorizontalPanel hPanel =
        (HorizontalPanel)RootPanel.get( "events" ).getWidget( 0 );
    DeckPanel dPanel = (DeckPanel)hPanel.getWidget( 1 );
    // 選択肢にしたがって画像切り替え
    dPanel.showWidget( ((ListBox)sender).getSelectedIndex() );
  }
} );

 これで図1の操作を実現できるようになった。操作とリスナーとの関連を画面上で確かめてみよう。

 リスナーは他にも、マウスのクリックを検知するClickListenerなどいろいろと用意されているので、com.google.gwt.user.client.uiパッケージのページを参照していただきたい。

 次回は、本格的なAjaxアプリケーションを構築するにはどうしても欠かせない、サーバと通信を行う方法を紹介する。

ZDNET Japan 記事を毎朝メールでまとめ読み(登録無料)

ホワイトペーパー

新着

ランキング

  1. セキュリティ

    「デジタル・フォレンジック」から始まるセキュリティ災禍論--活用したいIT業界の防災マニュアル

  2. 運用管理

    「無線LANがつながらない」という問い合わせにAIで対応、トラブル解決の切り札とは

  3. 運用管理

    Oracle DatabaseのAzure移行時におけるポイント、移行前に確認しておきたい障害対策

  4. 運用管理

    Google Chrome ブラウザ がセキュリティを強化、ゼロトラスト移行で高まるブラウザの重要性

  5. ビジネスアプリケーション

    技術進化でさらに発展するデータサイエンス/アナリティクス、最新の6大トレンドを解説

ZDNET Japan クイックポール

自社にとって最大のセキュリティ脅威は何ですか

NEWSLETTERS

エンタープライズ・コンピューティングの最前線を配信

ZDNET Japanは、CIOとITマネージャーを対象に、ビジネス課題の解決とITを活用した新たな価値創造を支援します。
ITビジネス全般については、CNET Japanをご覧ください。

このサイトでは、利用状況の把握や広告配信などのために、Cookieなどを使用してアクセスデータを取得・利用しています。 これ以降ページを遷移した場合、Cookieなどの設定や使用に同意したことになります。
Cookieなどの設定や使用の詳細、オプトアウトについては詳細をご覧ください。
[ 閉じる ]