Top / Eclipse / プラグイン開発のTIPS集 / GooglePlugin / 検索結果一覧を表示するビューの作成

概要

さて前回はGoogleの検索機能を呼び出したり、スペルミスを変更するダイアログだったりを作成しました。今回はその検索結果を表示するためのビューを作成していきたいと思います。プロジェクトは引き続き「nu.mine.kino.plugin.google.ui」を使用します。

plugin.xml、MANIFEST.MFを記述する

「META-INF/MANIFEST.MF」をマニフェストエディタで開き、[拡張]タブを選択して[追加]をクリックします。すると、拡張ポイントを選択するダイアログが開くので、「org.eclipse.ui.views」を選択し[終了]をクリックします。

view.gif

次に、この「org.eclipse.ui.views」を右クリックして[新規]−[view]を選択します。下に要素が追加されました。右側にはidやクラス名を指定する画面が表示されているので、以下のように指定します。

idnu.mine.kino.plugin.google.ui.views.GoogleResultView?
nameGoogle検索結果
classnu.mine.kino.plugin.google.ui.views.GoogleResultView?
categorynu.mine.kino.plugin.google
iconicons/icon.png

カテゴリーなども追加して結局plugin.xmlには以下のコードが追加されました。

  <extension
        point="org.eclipse.ui.views">
     <view
           category="nu.mine.kino.plugin.google"
           class="nu.mine.kino.plugin.google.ui.views.GoogleResultView"
           icon="icons/icon.png"
           id="nu.mine.kino.plugin.google.ui.views.GoogleResultView"
           name="Google検索結果"/>
     <category
           id="nu.mine.kino.plugin.google"
           name="Googleプラグイン"/>
  </extension>

ビュークラスを追加する

先のマニフェストエディタでidやクラス名を指定しましたが、classのラベルはクリックできるようになっています。

label.gif

これをクリックするとビューのクラスを作成するウィザードが起動します。そのまま終了をクリックすると「GoogleResultView?」のソースコードが作成されます。

では、そのソースコードに色々追加していこうと思います。

ビューの本体にテーブルビューワを配置する

まずはビューの本体を構築していきます。ビューの構築は

public void createPartControl(Composite parent);

をOverrideすることで行います。引数のCompositeに色々ウィジェットを配置していくわけですね。

さて今回は下記のとおりビュー全体にTableViewer?を配置することにしました。ここで出てくるTableViewer?とはEclipseの「問題ビュー」のようにヘッダとデータ部分を持った表形式のビューワーです。

public void createPartControl(Composite parent) {
    // ビューワを追加。
    Composite container = new Composite(parent, SWT.NONE);
    container.setLayout(new FillLayout());

    viewer = new TableViewer(container, SWT.FULL_SELECTION | SWT.BORDER);
    viewer.setContentProvider(new ArrayContentProvider());
    viewer.setInput(getViewSite());
    initTable(viewer);

    createActions();
    initializeToolBar();
    initializeMenu();
}

TableViewer?にカラムを追加する処理は initTable(viewer); で行っています。具体的なソースは以下の通りです。

private void initTable(final TableViewer viewer) {
    table = viewer.getTable();
    TableLayout layout = new TableLayout();
    table.setLayout(layout);
    table.setHeaderVisible(true); //ヘッダを表示する 
    table.setLinesVisible(true);  //ラインを表示する

    ColumnLayoutData[] columnLayouts = getColumnLayouts();

    for (int i = 0; i < columnLayouts.length; i++) {
        layout.addColumnData(columnLayouts[i]);
        TableColumn tc = new TableColumn(table, SWT.NONE, i);
        tc.setText(VISIBLE_FIELDS[i].getColumnHeaderText());
        tc.setImage(VISIBLE_FIELDS[i].getColumnHeaderImage());
    }
}

ColumnLayoutData?はフィールドの幅などレイアウト情報を管理するクラスです*1

このColumnLayoutData?クラスは

table = viewer.getTable();
TableLayout layout = new TableLayout();
table.setLayout(layout);

というようにTableViewer?TableLayout?が関連づけられており、TableLayout?

layout.addColumnData(columnLayouts[i]);

とすることでTableViewer?に関連づいています。

さて

ColumnLayoutData[] columnLayouts = getColumnLayouts();

で、各カラムのレイアウト情報を配列で取得していますが、現段階ではgetColumnLayouts?();は

private ColumnLayoutData[] getColumnLayouts() {
  return DEFAULT_COLUMN_LAYOUTS;
}

とフィールドに定義されている配列をそのまま返すようになっています。ここはあとで「すでに前回の情報が保存されていたらその情報を復元する」という処理に変更します。たとえば前回使用していたときにフィールドの幅などを変更していたとして、その幅を次回に復元する、といったことをできるようにするわけですね。

ColumnLayoutData?でカラムの設定をする

ポイントは

というところですね。わけがわからないと思うので、もっと具体的に、コーディングはこんな感じになります。

となるような感じです。

こうすることで、

などの効果が得られそうです。

ソースコード

最後にソースはこんな感じです。

//作成日: 2005/05/21
package nu.mine.kino.plugin.google.ui.views;

import nu.mine.kino.plugin.google.ui.views.fields.IField;
import nu.mine.kino.plugin.google.ui.views.fields.SummaryField;
import nu.mine.kino.plugin.google.ui.views.fields.TitleField;
import nu.mine.kino.plugin.google.ui.views.fields.URLField;

import org.eclipse.jface.action.Action;
import org.eclipse.jface.action.IMenuManager;
import org.eclipse.jface.action.IToolBarManager;
import org.eclipse.jface.viewers.ArrayContentProvider;
import org.eclipse.jface.viewers.ColumnLayoutData;
import org.eclipse.jface.viewers.ColumnWeightData;
import org.eclipse.jface.viewers.TableLayout;
import org.eclipse.jface.viewers.TableViewer;
import org.eclipse.swt.SWT;
import org.eclipse.swt.layout.FillLayout;
import org.eclipse.swt.widgets.Composite;
import org.eclipse.swt.widgets.Table;
import org.eclipse.swt.widgets.TableColumn;
import org.eclipse.ui.IMemento;
import org.eclipse.ui.IViewSite;
import org.eclipse.ui.PartInitException;
import org.eclipse.ui.part.ViewPart;

public class GoogleResultView extends ViewPart {

  // TableLayoutと一緒になって使う。各カラムの表示幅など情報を設定する。
  private final ColumnLayoutData[] DEFAULT_COLUMN_LAYOUTS = {
      new ColumnWeightData(200), new ColumnWeightData(200),
      new ColumnWeightData(200) };

  private final IField[] VISIBLE_FIELDS = { new TitleField(),
      new SummaryField(), new URLField() };

  private Table table;

  private Action doubleClickAction;

  private Action openBrowserAction;

  private IMemento memento;

  public void init(IViewSite site, IMemento memento) throws PartInitException {
    super.init(site, memento);
    this.memento = memento;
  }

  public void createPartControl(Composite parent) {
    Composite container = new Composite(parent, SWT.NONE);
    container.setLayout(new FillLayout());

    final TableViewer viewer = new TableViewer(container,
        SWT.FULL_SELECTION | SWT.BORDER | SWT.H_SCROLL | SWT.V_SCROLL);

    viewer.setContentProvider(new ArrayContentProvider());
    viewer.setInput(getViewSite());
    initTable(viewer);

    createActions();
    initializeToolBar();
    initializeMenu();
  }

  private void initTable(final TableViewer viewer) {
    table = viewer.getTable();

    TableLayout layout = new TableLayout();
    table.setLayout(layout);
    table.setHeaderVisible(true);
    table.setLinesVisible(true);

    ColumnLayoutData[] columnLayouts = getColumnLayouts();

    for (int i = 0; i < columnLayouts.length; i++) {
      layout.addColumnData(columnLayouts[i]);
      TableColumn tc = new TableColumn(table, SWT.NONE, i);
      tc.setText(VISIBLE_FIELDS[i].getColumnHeaderText());
      tc.setImage(VISIBLE_FIELDS[i].getColumnHeaderImage());
      // tc.addSelectionListener(headerListener);
    }
  }

  private ColumnLayoutData[] getColumnLayouts() {
    if (memento == null) {
      return DEFAULT_COLUMN_LAYOUTS;
    }
    // ↓実際はmementoからColumnLayoutData[]を構築して返す
    return DEFAULT_COLUMN_LAYOUTS;
  }

  private void createActions() {

    openBrowserAction = new Action("サイトにアクセスする") {
      public void run() {
      }
    };

    doubleClickAction = new Action("") {
      public void run() {
      }
    };
  }

  private void initializeToolBar() {
    IToolBarManager tbm = getViewSite().getActionBars().getToolBarManager();
  }

  private void initializeMenu() {
    IMenuManager manager = getViewSite().getActionBars().getMenuManager();
  }

  public void setFocus() {
  }

}

スクリーンショット

実際にビューを表示してみると、こんな感じです。

view.png

次は 検索ロジックをビューに実装 します。


この記事は

選択肢 投票
おもしろかった 2  
そうでもない 0  

Top / Eclipse / プラグイン開発のTIPS集 / GooglePlugin / 検索結果一覧を表示するビューの作成

現在のアクセス:12546


*1 Eclipseでテーブルビューワを使うときはカラムの制御はColumnLayoutDataでやるのがよいみたいです*2ColumnLayoutDataはフィールドの幅などの情報を表現するクラスです。
*2 とりあえずEclipseのMarkerView?などの実装はそうなってた

トップ   新規 一覧 単語検索 最終更新   ヘルプ   最終更新のRSS