Intellij插件开发：MonkeyMaster插件的实现（二）——入门及UI搭建

【转载请注明出处】
笔者：DrkCore (http://blog.csdn.net/DrkCore)
原文链接：(http://blog.csdn.net/drkcore/article/details/55000247)

接上文我们已经实现了Monkey测试的核心功能，接下来我们就要开始进入Intellij Idea插件开发的正式部分了。

近年来Intellij Idea以及基于其社区版的Android Studio逐渐开始替代老旧的Eclipse成为大家日常开发中比不可少的IDE，配合着各式各样的插件极大地提高了工作效率。然而在享受着插件带来的便利的同时不知道你有没有好奇过插件到底是如何开发的呢？

Intellij Idea插件开发算是很冷门的一个领域，国内几乎没有相关的社区或论坛（PS：如果有的话请留言告诉我），并且搜索引擎能够找到的博客大都也只是介绍了环境搭建以及Hello World而已。看来这注定是一条只能凭借兴趣才能走下去的路啊。

废话少说让我们进入正题吧。

一、 入门插件开发的正确姿势

官方开发文档永远是最一手最准确的开发资料，考虑国内相关博客不多这差不多是你深入学习以及填坑时唯一能用的资料了。地址如下：

IntelliJ Platform SDK Documentation

毕竟是做IDE的，JetBrains的文档写得相当到位，不需要多少的英文水平也能看懂。

由于本文主要讲如何实现MonkeyMaster插件，关于环境搭建以及如何创建一个插件工程便不再赘述，各位看官可以通过搜索引擎自行学习。

二、 创建GUI Form

如果你做过Android应用开发的话（你肯定做过）你应该会很习惯通过编写XML或者拖拽控件来定义一个页面的样式，简单一点布局直接在源码里面 new 然后设置样式也是可以的。Intellij Idea的插件UI是通过java.swing来实现的，但是同Android类似你也可以单独定义一个 布局文件 来定义UI。

创建好之后你就会在包中看到以 form 结尾的布局文件。该布局文件是和类绑定在一起的，你在GUI中拖拽入一个控件并添加上名称，IDE便会自动在类中添加响应的成员变量：

你可以右键点击GUI的Form Source菜单来查看GUI的源代码，虽然也是xml格式的但毕竟和Android不一样，没那么容易看懂。不过大多数时候使用拖拽来定义差不多就够了。

右键菜单点击Preview或者直接点击Preview按钮可以打开预览窗口，如你所见是Swing的样式，和Intellij Idea的酷炫主题果然没法相提并论。但是在实际运行的时候会套入Intellij Idea的主题的，这点不需要担心。

接下来让我们看看被绑定的类 ConsoleWin 的源码：

package core.plugin.monkey.win;public class ConsoleWin extends BaseWin {    //在GUI中定义的控件    //控件的实例将在类实例化时被赋值到成员变量中    //该操作大约是在非静态初始化块中执行的    private JPanel contentPanel;    private JTextArea logTxt;    private JButton createBtn;    public ConsoleWin() {        //由于控件实例的赋值是在非静态初始化中执行的        //如果你的父类初始化中用到了这些控件的话，可能会遇到NullPointer异常        super(TITLE);        //父类初始化结束后控件已经被正常赋值了，能够执行初始化操作        createBtn.addActionListener(e -> showDeviceDlg());    }    //其他拓展方法，详情请查看源代码}

三、 像Fragment一样使用GUI Form

在Android中我们可以将布局和逻辑封装成一个个Fragment来降低代码的粒度，更低的耦合性能显著提升程序的灵活性。在很多带有UI的语言或者平台中你都能看到类似设计思想的身影，GUI Form也不例外。

自定义组件的类及Form需要满足以下条件：

• Form绑定的类必须直接或者间接继承自JComponent
• Form中根布局的JPanel必须存在绑定的成员变量

你可以在UI设计界面的右边找到添加自定义组件的入口：

将添加的自定义组件拖拽进Form设计界面，之后像对待普通组件那样操作即可。

四、 ToolWindow

如果你想直接阅读关于 ToolWindow 的官方英文文档的话请点这里：

IntelliJ Platform SDK DevGuide: Tool Windows

在之后的内容以及章节中笔者都只将简要提及实现流程和要点。

首先让我们来看看什么是 ToolWindow：

如你所见，你日常使用的 Version Control 和 Terminal 等这些时长处于底部或者侧边的工具，都是以 ToolWindow 的形式实现的。

就如同Android中的 AndroidManifest.xml 清单文件一样，插件开发中也有类似的配置文件（PS：如果你开发过Eclipse的插件的话你会发现大家的路子其实都差不多）：

ToolWindow 其实就是是一个GUI Form而已，为了方便后续的开发我们先封装一个 BaseWin：

//用于简化ToolWindow的基类，省略部分get/set方法public abstract class BaseWin {    //窗口标题        private String title;    public BaseWin(String title) {        this.title = title;    }    private Project project;    private WinFactory factory;    private Content content;    //该方法将在ToolWindow添加到界面后回调    public void onAttached(Project project, WinFactory factory, Content content) {        if (this.project != null ||this.factory != null || this.content != null) {            throw new IllegalStateException("Win could only be attached once");        }        this.project=project;        this.factory = factory;        this.content = content;    }    //该方法将在ToolWindow从界面上移除后回调    public void onRemoved() {        this.content = null;    }}

接下来让我们来看一下如何实现一个 WindowFactory，你可以在这里找到MonkeyMaster中实现的源码：

//用于管理插件的ToolWindow的辅助类，需要在plugin.xml中注册才能使用public class WinFactory implements ToolWindowFactory {    private Project project;    private ToolWindow toolWin;    private ContentManager mgr;    private ConsoleWin consoleWin;    private List<DeviceWin> deviceWins;        //填充初始的ToolWindow       @Override    public void createToolWindowContent(@NotNull Project project, @NotNull ToolWindow toolWindow) {        this.project = project;        this.toolWin = toolWindow;        this.mgr = toolWin.getContentManager();        //MonkeyMaster中默认会先创建一个ConsoleWin        //用于打印插件运行时的日志等        consoleWin = new ConsoleWin();        attach(consoleWin);    }    /*Tab*/    public void attach(BaseWin win) {        attach(win, false);    }    //将ToolWindow依附到UI上    public void attach(BaseWin win, boolean focus) {        //通过JConponent创建Content        Content content = mgr.getFactory().createContent(win.getContentPanel(), win.getTitle(), false);        //回调BaseWin方法        win.onAttached(project, this, content);        //将Content依附到UI上        mgr.addContent(content);        if (focus) {//让ToolWindow获取焦点            mgr.setSelectedContent(content);        }    }    //从UI上移除ToolWindow        public boolean remove(BaseWin win) {        boolean result = mgr.removeContent(win.getContent(), true);        win.onRemoved();        return result;    }}

点击运行你就能可以看到如下效果：

五、 Dialog

官方文档：IntelliJ Platform SDK DevGuide: DialogWrapper

博文建设中……