How to create a SplitEditorToolbar in Intellij IDEA plugin?

Answered

I am trying to create an Intellij IDEA plugin for Android Studio. I want to add a SplitEditorToolbar to the plugin and add actions to it via buttons. I am trying to achieve something like this:

The photo above is of Android Studio and area marked in red is what I want. I viewed it in UI Inspector and it shows that it is derived from SplitEditorToolbar and then has JPanel and inside it has the three buttons. So please can someone guide me on how to achieve this?

28 comments
Comment actions Permalink

Hi,

Could you please clarify more? Do you want to create a new editor or modify an existing one?

0
Comment actions Permalink

I am trying to modify the current Intellij Platform Editor that is used to edit Java and Kotlin codes in Android Studio. I am currently trying to create a plugin in which I want to split the editor window with a custom view. I want to add buttons which would show one full part of the code editor or a full part of the custom view or split in half both of them. Which would be similar to the layout designer provided in the Android Studio.

0
Comment actions Permalink

It sounds like you need to implement your custom editor with preview. Take a look at com.intellij.openapi.fileEditor.TextEditorWithPreview.

You will also have to register com.intellij.fileEditorProvider to provide it for the files you want.

0
Comment actions Permalink

Thanks and could you please share a link to any example or documentation showing how to implement this?

0
Comment actions Permalink

Karol Lewandowski I have implemented the FileEditorProvider, however it shows up when opening any type of file, which is what I don't want. So how can I make it such that the editor shows up only when Java and Kotlin files are opened?

0
Comment actions Permalink

Hi,

How is your "FileEditorProvider.accept()" implemented? You should implement it to accept only the files you want to open the custom editor with.

Also, please remember to accept only the files you want to handle with your editor, not all Java/Kotlin files. It is important from the users' point of view to have a custom editor only when it is required. Otherwise, it will degrade IDE's UX.

0
Comment actions Permalink

In my FileEditorProvider.accept() method I check if the current project has Android Facet. However I don't know how to check for specific Java/Kotlin files.

0
Comment actions Permalink

I'm sorry, but I probably don't understand the issue.

The accept() method takes an opened file and decides if the editor should be opened for it:

boolean accept(@NotNull Project project, @NotNull VirtualFile file)

You should check if this file is suitable for your custom editor.

0
Comment actions Permalink

My issue is that I don't know how to check if the VirtualFile is the file that I want. For example, I don't know how to check if the VirtualFile is Java/Kotlin. So could you please tell me how to check if the file is Java/Kotlin?

0
Comment actions Permalink

I see now.

According to the docs:

https://plugins.jetbrains.com/docs/intellij/psi-files.html#how-do-i-get-a-psi-file

...get PsiFile for a given VirtualFile:

PsiFile checkedFile = PsiManager.getInstance(project).findFile(virtualFile);

...and then check its language:

checkedFile.getLanguage() == JavaLanguage.INSTANCE // or Kotlin

 

0
Comment actions Permalink

Thank you very much! It worked!

0
Comment actions Permalink

Karol Lewandowski The editor is showing up fine, however, another editor, i.e.,  Android Studio's own editor also shows up along with it as seen in image below:

The "custom-editor" is the editor created by me and the "Source Code Editor With Preview" is Android Studio's own editor. So how can I hide that button? Also can I contribute to the docs of plugin development so that I can add documentation on how to create a custom editor?

0
Comment actions Permalink

Hi,

Take a look at FileEditorProvider.getPolicy() Javadoc:

Returns: policy that specifies how editor created via this provider should be opened.
See Also:
FileEditorPolicy.NONE,
FileEditorPolicy.HIDE_DEFAULT_EDITOR,
FileEditorPolicy.PLACE_BEFORE_DEFAULT_EDITOR
0
Comment actions Permalink

But does it work with TextEditorWithPreview class? Because the name of the editor that is shown is defined in the class that extends TextEditorWithPreview and if I go to the generate methods panel, the getPolicy() method is not there.

0
Comment actions Permalink

It is part of FileEditorProvider API, not Editor's.

If you mean something else, please clarify.

0
Comment actions Permalink

Karol Lewandowski Thanks, I have tried using HIDE_DEFAULT_EDITOR in the getPolicy() method, however it isn't working. Please help me fix it. Here's my plugin's source code:

https://github.com/RivanParmar/Android-Studio-Visual-Scripting-Plugin

0
Comment actions Permalink

Hi,

I can't see the reason, but I suggest debugging com.intellij.openapi.fileEditor.impl.FileEditorProviderManagerImpl.getProviders() to understand what's happening. Especially this line:

ContainerUtil.retainAll(sharedProviders, provider -> !(provider instanceof DefaultPlatformFileEditorProvider));

Maybe the default editor is an instance of DefaultPlatformFileEditorProvider. If yes, then it seems there is no option to hide it.

0
Comment actions Permalink

Karol Lewandowski I have debugged the line that you had said and found that the default editor is not an instance of DefaultPlatformFileEditorProvider. The default editor is this one:

https://github.com/JetBrains/android/blob/master/designer/src/com/android/tools/idea/uibuilder/editor/multirepresentation/sourcecode/SourceCodeEditorProvider.kt

So now, what should I do?

 

0
Comment actions Permalink

Hi,

Sorry, but the code I pasted retains all non-default editors, so also the one you pasted. It seems that this editor also hides the default one:
https://github.com/JetBrains/android/blob/master/designer/src/com/android/tools/idea/uibuilder/editor/multirepresentation/sourcecode/SourceCodeEditorProvider.kt#L62

It seems editor providers cannot hide others.

I don't know any supported ways of hiding non-default editors. There is FileEditorProviderSuppressor, but it is a part of the internal API and it can't be used by plugins.

0
Comment actions Permalink

Karol Lewandowski So if I cannot hide the other editor then can I just create a single FileEditorProvider and make it split with the given editor? Or should I use a Tool Window instead? But I don't know if Tool Windows can span across the whole layout of the editor or not.

0
Comment actions Permalink

So if I cannot hide the other editor then can I just create a single FileEditorProvider and make it split with the given editor?

No, the problem of hiding the existing editor would still remain or I don't understand the idea.

For displaying an editor, you should definitely use editors, not a Tool Window.

I suggest using "order" attribute for fileEditorProvider extension in plugin.xml. With this attribute, you can make your editor displayed before the current one Android Studio provides. It will still remain visible, but at least users will see your editor as first.

0
Comment actions Permalink

Karol Lewandowski What I meant was that instead of creating a TextEditor along with a Preview editor (i.e. a custom view), would it be ok to only just create a Preview editor and make it split with the editor given in Android Studio?

0
Comment actions Permalink

Do you mean that you would create TextEditorWithPreview and you would use Android Studio's editor as text editor, and your custom editor as preview editor?

I think it could work and it's worth trying (if AS' editor is public and easy to use), but the default Android Studio editor will still be visible. You could order your editor provider as the first one, so it should be displayed as default when you open a file.

0
Comment actions Permalink

Do you mean that you would create TextEditorWithPreview and you would use Android Studio's editor as text editor, and your custom editor as preview editor?

Karol Lewandowski Yes that is what I meant. However, I don't have any ideas as to how to do it and it would be great if you could help me in doing it. And if the above solution does not work, then I will just order my editor before the Android Studio's editor. Thanks!

0
Comment actions Permalink

Hi,

I suggest taking a look at how:
https://github.com/JetBrains/intellij-community/blob/master/platform/platform-impl/src/com/intellij/openapi/fileEditor/TextEditorWithPreview.java

is implemented and trying to follow this approach. Maybe it can be used directly or you need to implement a similar editor which embeds two editors. I'm sorry, but I can't give you a more detailed solution.

0
Comment actions Permalink

Karol Lewandowski I looked at the source code that you had provided. However, TextEditorWithPreview creates a new editor with two editors embedded inside it. So even if I try to implement something like that then it would be the same thing all over again as I won't be able to hide AS's editor. So I have ordered my editor as the first editor. But I would also like to add settings to my plugin such that you could select between a TextEditorWithPreview or just the Preview editor. Like you could select which type of editor to use, i.e., an editor with split functionality or an editor without split functionality. Is it possible to do so?

0
Comment actions Permalink

Hi,

Please take a look at: https://plugins.jetbrains.com/docs/intellij/settings.html

Once you have your configurable class, you can execute specific logic depending on settings values.

This topic gets out of the original track now (split editor). Please open new threads if there are follow-up questions that are not related to the split editor, so other developers can more easily find answers to their problems.

0

Please sign in to leave a comment.