In IntelliJ IDEA, develop a fishing and reading plug-in

Posted by Leveler on Tue, 09 Nov 2021 02:44:55 +0100

Author: Xiao Fu Ge
Blog: https://bugstack.cn
Original text: https://mp.weixin.qq.com/s/R8qvoSNyedVM95Ty8sbhgg

Precipitate, share and grow, so that you and others can gain something! 😄

1, Explain

Wrong direction, efforts in vain!

There are always people who are anxious to get the product demand. Anyway, they are lazy to think about what will happen in the development and how many people will use it after it goes online. Let's pile up the code and have a look. Anyway, it's OK to run, whether the code or you!

In fact, many times before writing code, the technical research, architecture design, module layering, data structure, detailed analysis, scheme review, etc. that need to be done seem to be a little slow compared with the guy 3721. However, this seemingly slow process can solve many common and troublesome problems in the future, such as product requirements iteration, business process change, code logic change and online exception troubleshooting. Although it looks slow, the process of building a foundation is like laying a foundation. There must be a stable foundation to build the whole building. Ten thousand tall buildings rise from the ground. Don't build high platforms in floating sand

2, Demand purpose

If you need to develop a plug-in with custom functions, whether it is processing code, auxiliary ORM generation, log information recording, etc., you will need to configure the function of a plug-in, initialize it, and display the corresponding functions in the right or lower bar of the whole IDEA form, so as to meet the basic needs of a plug-in.

In this way, you need to expand your own configuration form in the IDEA form file - > settings, and develop the ToolWindow you need to be embedded in the IDEA (left, right and lower). Here, Swing is needed for the development of forms, but it is still quite easy to develop such functions in the IDEA by dragging and dropping the form.

Then next, we take a scene of fishing and reading in IDEA as an example to learn the function implementation of configuration form and reading form.

3, Case development

1. Engineering structure

guide-idea-plugin-tool-window
├── .gradle
└── src
    ├── main
    │   └── java
    │   	└── cn.bugstack.guide.idea.plugin 
    │       	└── factory
    │       	│	├── ReadFactory.java 
    │       	│	└── SettingFactory.java
    │       	└── ui
    │       	│	├── ReadUI.java 
    │       	│	├── ReadUI.form
    │       	│	├── SettingUI.java  
    │       	│	└── SettingUI.form
    │       	└── Config    
    ├── resources
    │   └── META-INF
    │       └── plugin.xml 
    ├── build.gradle  
    └── gradle.properties

Source code: the official account: bugstack wormhole stack reply: idea can download all the IDEA plug-in development source code.

This project mainly involves two parts. In the factory, one is the configuration form, the other is the reading form, and the implementation of the corresponding two groups of UI. Finally, the implementation of the factory class will be configured in plugin.xml for use. At the same time, it also controls the form position and icon in plugin.xml.

2. Create UI form

2.1 creation method

New -> Swing UI Designer -> GUI Form

The main ways to create forms in Java are AWT, Swing and JavaFx. Because IDEA is developed using Swing, the compatibility of creating Swing forms here will be better.
Here, the creation of Swing forms can be their own handwritten form structure, or use the visual drag and drop GUI Form. If your form is not complex, the drag and drop method can be used.

2.2 configuration page form

public class SettingUI {

    private JPanel mainPanel;
    private JPanel settingPanel;
    private JLabel urlLabel;
    private JTextField urlTextField;
    private JButton urlBtn;

    public SettingUI() {
        // Add an event to the button to select a file
        urlBtn.addActionListener(e -> {
            JFileChooser fileChooser = new JFileChooser();
            fileChooser.setFileSelectionMode(JFileChooser.FILES_ONLY);
            fileChooser.showOpenDialog(settingPanel);
            File file = fileChooser.getSelectedFile();
            urlTextField.setText(file.getPath());
        });
    }

    public JComponent getComponent() {
        return mainPanel;
    }

    public JTextField getUrlTextField() {
        return urlTextField;
    }
}

The configuration page form mainly provides the selection of article paths. The tags needed here include JLabel, JTextField and JButton
After creating a form using GUI Form, a visual page will appear. You can drag various labels to the middle panel on the right and set the display name and attribute name on the left.
Finally, the code tag code here will be displayed in SettingUI.java, and the rendered content will be hidden. This way is also more convenient to control the addition of some custom content, such as events and new forms
In addition, in SettingUI.java, you also need to add a button event in the constructor to open the file selector and set the file we need to open to urlTextField.

2.3 reading page form

public class ReadUI {

    private JPanel mainPanel;
    private JTextPane textContent;

    public JComponent getComponent() {
        return mainPanel;
    }

    public JTextPane getTextContent() {
        return textContent;
    }

}

In the form creation and configuration page, the form is the same. It is also dragged to the panel to display the contents of the path file.
You can add some other buttons appropriately, such as page turning reading, scroll bar, word number display, etc.

3. ToolWindow tool box

In order to put our own reading form into the right sidebar of the whole IDEA, we need to create an interface that implements ToolWindowFactory and configure the implementation class into plugin.xml

public class ReadFactory implements ToolWindowFactory {

    private ReadUI readUI = new ReadUI();

    @Override
    public void createToolWindowContent(@NotNull Project project, @NotNull ToolWindow toolWindow) {
        // Gets an instance of the content factory
        ContentFactory contentFactory = ContentFactory.SERVICE.getInstance();
        // Get the contents displayed by ToolWindow
        Content content = contentFactory.createContent(readUI.getComponent(), "", false);
        // Set what the ToolWindow displays
        toolWindow.getContentManager().addContent(content);
        // Global use
        Config.readUI = readUI;
    }

}

The interface method ToolWindowFactory#createToolWindowContent is a method that needs to be implemented by its own tool box class. In this createToolWindowContent method, instantiate its own form ReadUI and fill it in.
Adding a form mainly depends on ContentFactory.SERVICE.getInstance() creating a ContentFactory and finally using toolWindow to add a form to display the UI.
Here, we also add a global attribute Config.readUI, so that we can use this UI to set the file content in the configuration form later.

4. Configurable box

public class SettingFactory implements SearchableConfigurable {

    private SettingUI settingUI = new SettingUI();

    @Override
    public @NotNull String getId() {
        return "test.id";
    }

    @Override
    public @Nls(capitalization = Nls.Capitalization.Title) String getDisplayName() {
        return "test-config";
    }

    @Override
    public @Nullable JComponent createComponent() {
        return settingUI.getComponent();
    }

    @Override
    public boolean isModified() {
        return true;
    }

    @Override
    public void apply() throws ConfigurationException {
        String url = settingUI.getUrlTextField().getText();
        // Set text information
        try {
            File file = new File(url);
            RandomAccessFile randomAccessFile = new RandomAccessFile(file, "r");
            randomAccessFile.seek(0);

            byte[] bytes = new byte[1024 * 1024];
            int readSize = randomAccessFile.read(bytes);

            byte[] copy = new byte[readSize];
            System.arraycopy(bytes, 0, copy, 0, readSize);

            String str = new String(copy, StandardCharsets.UTF_8);

            // Set content
            Config.readUI.getTextContent().setText(str);

        } catch (Exception ignore) {
        }
    }

}

There are many methods to implement the self SearchableConfigurable interface, including getId, getDisplayName, createComponent, isModified and apply, which are mainly used to write logic implementation
The createComponent method mainly provides the UI panel created by ourselves to the jccomponent
apply is an event. This method will be triggered when we click OK and finish to complete the configuration. In this method, we get the URL address of the file, use RandomAccessFile to read and parse the file, and finally display the file content in the reading window Config.readUI.getTextContent().setText(str);

5. Configure plugin.xml

<extensions defaultExtensionNs="com.intellij">
    <!-- Add your extensions here -->
    <!-- to configure File -> Settings -> Tools -->
    <projectConfigurable groupId="tools" displayName="My Test Config" id="test.id"
                         instance="cn.bugstack.guide.idea.plugin.factory.SettingFactory"/>
                         
    <!-- forms  (IDEA Right side of the interface) -->
    <toolWindow id="Read-Book" secondary="false" anchor="right" icon="/icons/logo.png"
                factoryClass="cn.bugstack.guide.idea.plugin.factory.ReadFactory"/>
</extensions>

The main configuration contents in plugin.xml this time are projectConfigurable and toolWindow. In addition, an icon logo is added in toolWindow. After configuration, the forms we added can be displayed on the IDEA page.

4, Plug in test

Start the plug-in through Plugin. At this time, a new IDEA form will be opened. In this new form, you can see the functions we added.

Profile path

Click the select button, select your file location, and then click OK

View presentation file

After confirming the file path, you can see your file display in the right column. Is it expanding, which is suitable for you to fish!?

5, Summary

The process steps of learning to customize the development UI, filling the UI to the position of the IDEA form to be placed, and adding functions to the form mainly include three aspects: Swing UI, Factory implementation class, and plugin configuration.
The plugin configuration mainly includes form ID, location, icon icon and corresponding implementation classes. If these are not added, the form information cannot be displayed normally.
In addition, based on this case, you can add the functions you want to complete, such as making the function of fishing and reading more perfect, supporting different types of files, even PDF reading, and the books you want to read.

6, Series recommendation

Topics: Java

Programmer Think