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;
}

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

実際にカラムを追加する

実際にカラムを追加する処理は

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());
}

の箇所です。先のレイアウト情報をセットするのと、ヘッダの文言やイメージデータをカラムごとにセットしています。この

VISIBLE_FIELDS[];

インスタンスはあらかじめ

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

とフィールドに定義されているインスタンスです。IFieldは

public interface IField {
    String getColumnHeaderText();
    Image getColumnHeaderImage();
    String getValue(Object obj);
    Image getImage(Object obj);
    int compare(Object obj1, Object obj2);
}

というように、ヘッダ名やヘッダに表示するアイコンの情報、またビューワの各カラムにオブジェクトが渡されたときにオブジェクトを文字列に変換する変換処理、などを備えたインタフェースです。実装しているクラスTitleField?,SummaryField?,URLFieldはそれぞれ

public class TitleField implements IField {
  public String getColumnHeaderText() {return "Title";}
  public String getValue(Object obj) {
    ResultElement element = (ResultElement) obj;
    return element.getTitle();
  }
}
public class SummaryField implements IField {
  public String getColumnHeaderText() {return "Summary";}
  public String getValue(Object obj) {
    ResultElement element = (ResultElement) obj;
    return element.getSnippet();
  }
}
public class URLField implements IField {
  public String getColumnHeaderText() {return "URL";}
  public String getValue(Object obj) {
    ResultElement element = (ResultElement) obj;
    return element.getURL();
  }
}

と定義されています。つまりここまでで、ビューにはTableViewer?が配置されていて、そのTableViewer?にはTitle,Summary,URLの3つのカラムがある、ということになります。

ここまででビューのソースは以下のようになりました。

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.IMenuManager;
import org.eclipse.jface.action.IToolBarManager;
import org.eclipse.jface.viewers.ArrayContentProvider;
import org.eclipse.jface.viewers.ColumnLayoutData;
import org.eclipse.jface.viewers.ColumnPixelData;
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.part.ViewPart;

public class GoogleResultView extends ViewPart {
    private TableViewer viewer;
    public static final String ID = "nu.mine.kino.plugin.google.ui.views.GoogleResultView"; //$NON-NLS-1$
    private Table table;

    // TableViewerの各カラムを定義するフィールド
    private final IField[] VISIBLE_FIELDS = { new TitleField(),
            new SummaryField(), new URLField() };

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

    /**
     * フィールドのColumnLayoutData[]か、mementoの値で初期化された ColumnLayoutData[]を返すメソッド。
     * 
     * @return
     */
    private ColumnLayoutData[] getColumnLayouts() {
        return DEFAULT_COLUMN_LAYOUTS;
    }

    // TableViewerの初期化。
    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());
        }
    }

    /**
     * Create contents of the view part
     * 
     * @param parent
     */
    @Override
    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();
    }
    // 以下、割愛
}

スクリーンショット

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

view2.gif

さて引き続き、前回の状態を復元する処理を追加したいと思います。


この記事は

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

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

現在のアクセス:12546


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

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