Eclipseのビューを自分で作る【Eclipse + ChatGPT】

Eclipseのビューを自分で作成する方法を紹介したいと思います。
今回はEclipse2023 + JavaSE17 を使っていきます。
また後半ではEclipseとChatGPTという不思議な組み合わせを実装します。

PDE (Plug-in Development Environment)のインストール

「ヘルプ」 > 「新規ソフトウェアのインストール」
から作業対象に
https://download.eclipse.org/releases/latest
と入力し、「一般用ツール」から「Eclipse プラグイン開発環境」をインストール

表示される条項などに同意し、インストール後に再起動する (筆者はpleiades以下の”eclipse.exe -clean.cmd”によりキャッシュを削除して再起動しないと次のステップに行けませんでした)

2. プラグイン開発プロジェクトの作成

「ファイル」 > 「新規」 > 「その他」 > 「プラグイン開発」 > 「プラグイン・プロジェクト」
からビューを作成するためのプロジェクトを作成します。

今回は”MyView”プロジェクトをworkspace直下に作成します

続けて設定し、「次へ」を押下します

テンプレートは「カスタム・プラグイン・ウィザード」で作成します

今回は「example view extension」を選択します

ここはデフォルトで大丈夫だと思います

完了を押下してプロジェクトを作成します

3. ビューを立ち上げてみる

プロジェクトを作成すると、このように特殊なエディタ画面が表示されます。

ビューの立ち上げは、プロジェクトを「Eclipseアプリケーション」で実行することで実施できます

上手く立ち上がらない場合は、エラーのログから問題を解消してください。筆者は”plugin.xml”から”org.eclipse.ui.views”を選んで追加を押下し、”org.eclipse.ui.views”を追加したところ解決に至ったことがあります。

実行するとEclipseが別ウィンドウで立ち上がりますので、
「Window」 > 「Show View」 > 「Other」 > 「サンプル・カテゴリー」 > 「サンプル・ビュー」 (ここらへんは命名や設定に依存すると思います)
から、src/myview/views/SampleView.java で定義したカスタムビューを表示できます。

サンプル・ビューを実際に開くとこんな感じになると思います。

4. カスタムビューのエクスポート

今のままだとプラグイン開発用エディタでしかカスタムビューを開けない状態なので、エクスポートして本番用のエディタでもビューを開けるようにします。
ビューのプロジェクトクリックしてから
「ファイル」 > 「エクスポート」 > 「プラグイン開発」 > 「デプロイ可能なプラグインおよびフラグメント」
を選択し、jarファイルを出力します

出力先は”C:\pleiades\2023-12\eclipse\dropins\MyView”など、eclipse\dropins以下にすると、Eclipse側でインポートしてくれます。

また、Java21未満を使っている方はオプションタブに切り替えて「ワークスペースのコンパイル済みクラス・ファイルを使用」にチェックを入れてからエクスポートしてください

Eclipseをcleanで再起動すると、こちらのエディターでも「ウィンドウ」から「サンプル・ビュー」が開けるようになっていると思います

おまけ：ChatGPTのAPIを呼び出すビューを作る

Eclipse上でChatGPTを呼び出してみます。
以下はサンプルコードです

package copilotview.views;
import java.io.BufferedReader;
import java.io.InputStreamReader;
import java.io.OutputStreamWriter;
import java.net.HttpURLConnection;
import java.net.URL;
import org.eclipse.jface.dialogs.MessageDialog;
import org.eclipse.swt.SWT;
import org.eclipse.swt.layout.GridData;
import org.eclipse.swt.layout.GridLayout;
import org.eclipse.swt.widgets.Button;
import org.eclipse.swt.widgets.Composite;
import org.eclipse.swt.widgets.Text;
import org.eclipse.ui.IEditorPart;
import org.eclipse.ui.PlatformUI;
import org.eclipse.ui.part.FileEditorInput;
import org.eclipse.ui.part.ViewPart;
import org.eclipse.ui.texteditor.ITextEditor;
import com.google.gson.Gson;
import com.google.gson.JsonObject;
public class SampleView extends ViewPart {
    public static final String ID = "copilotview.views.SampleView";
    private Text inputText;
    private Text responseText;
    private Button copyFromEditorButton;
    private Button sendToChatGPTButton;
    @Override
    public void createPartControl(Composite parent) {
        parent.setLayout(new GridLayout(2, false));
        Composite leftComposite = new Composite(parent, SWT.NONE);
        leftComposite.setLayout(new GridLayout(1, false));
        leftComposite.setLayoutData(new GridData(SWT.FILL, SWT.FILL, true, true));
        inputText = new Text(leftComposite, SWT.BORDER | SWT.MULTI | SWT.WRAP | SWT.V_SCROLL);
        GridData inputTextGridData = new GridData(SWT.FILL, SWT.FILL, true, true);
        inputTextGridData.heightHint = 200;
        inputText.setLayoutData(inputTextGridData);
        Composite buttonComposite = new Composite(leftComposite, SWT.NONE);
        buttonComposite.setLayout(new GridLayout(2, false));
        buttonComposite.setLayoutData(new GridData(SWT.FILL, SWT.CENTER, true, false));
        copyFromEditorButton = new Button(buttonComposite, SWT.PUSH);
        copyFromEditorButton.setText("Copy from Editor");
        sendToChatGPTButton = new Button(buttonComposite, SWT.PUSH);
        sendToChatGPTButton.setText("Send to ChatGPT");
        responseText = new Text(parent, SWT.BORDER | SWT.MULTI | SWT.WRAP | SWT.V_SCROLL);
        GridData responseTextGridData = new GridData(SWT.FILL, SWT.FILL, true, true);
        responseTextGridData.heightHint = 200;
        responseText.setLayoutData(responseTextGridData);
        copyFromEditorButton.addListener(SWT.Selection, event -> copyTextFromEditor());
        sendToChatGPTButton.addListener(SWT.Selection, event -> sendTextToChatGPT());
    }
    private void copyTextFromEditor() {
        IEditorPart editor = PlatformUI.getWorkbench().getActiveWorkbenchWindow().getActivePage().getActiveEditor();
        if (editor instanceof ITextEditor) {
            ITextEditor textEditor = (ITextEditor) editor;
            FileEditorInput input = (FileEditorInput) textEditor.getEditorInput();
            try (BufferedReader reader = new BufferedReader(new InputStreamReader(input.getFile().getContents()))) {
                StringBuilder content = new StringBuilder();
                String line;
                while ((line = reader.readLine()) != null) {
                    content.append(line).append("\n");
                }
                inputText.setText(content.toString());
            } catch (Exception e) {
                showMessage("Failed to copy text from editor: " + e.getMessage());
            }
        } else {
            showMessage("No text editor is currently active.");
        }
    }
    private void sendTextToChatGPT() {
        String userInput = inputText.getText()
        		+ "\n日本語でコードの解説をしてください";
        try {
            String apiUrl = "https://api.openai.com/v1/chat/completions";
            String apiKey = "{OpenAIのAPIキー}";
            JsonObject requestBody = new JsonObject();
            requestBody.addProperty("model", "gpt-4o-mini");
            JsonObject message = new JsonObject();
            message.addProperty("role", "user");
            message.addProperty("content", userInput);
            requestBody.add("messages", new Gson().toJsonTree(new JsonObject[] { message }));
            URL url = new URL(apiUrl);
            HttpURLConnection connection = (HttpURLConnection) url.openConnection();
            connection.setRequestMethod("POST");
            connection.setRequestProperty("Content-Type", "application/json");
            connection.setRequestProperty("Authorization", "Bearer " + apiKey);
            connection.setDoOutput(true);
            try (OutputStreamWriter writer = new OutputStreamWriter(connection.getOutputStream())) {
                writer.write(new Gson().toJson(requestBody));
            }
            BufferedReader reader = new BufferedReader(new InputStreamReader(connection.getInputStream()));
            StringBuilder response = new StringBuilder();
            String line;
            while ((line = reader.readLine()) != null) {
                response.append(line);
            }
            JsonObject jsonResponse = new Gson().fromJson(response.toString(), JsonObject.class);
            String messageContent = jsonResponse
                .getAsJsonArray("choices")
                .get(0)
                .getAsJsonObject()
                .getAsJsonObject("message")
                .get("content")
                .getAsString()
                .replace("*", "").replace("`", "");
            responseText.setText(messageContent);
        } catch (Exception e) {
            showMessage("Failed to send text to ChatGPT: " + e.getMessage());
        }
    }
    private void showMessage(String message) {
        MessageDialog.openInformation(
            inputText.getShell(),
            "CopilotView",
            message);
    }
    @Override
    public void setFocus() {
        inputText.setFocus();
    }
}

importが上手くできない場合はplugin.xmlを開いて依存関係を調整してください。

以下は実際のビューです

ここではボタンからエディタのテキストをコピペしてChatGPTに投げることができています。使い方をもっと工夫すれば色々できそうですね。