idea插件开发-Icon and Image

最新推荐文章于 2025-03-28 10:00:55 发布

korgs

最新推荐文章于 2025-03-28 10:00:55 发布

阅读量3k

点赞数 2

分类专栏： # Intellij IDE插件开发文章标签： intellij-idea java ide

本文链接：https://blog.csdn.net/liudonglovehemin/article/details/130782066

版权

Intellij IDE插件开发专栏收录该内容

49 篇文章

订阅专栏

本文介绍了如何在IntelliJ平台中获取和使用图标资源，包括从指定文件夹通过IconLoader获取图标，建议的图标尺寸，SVG和PNG格式的要求，以及如何创建和使用AnimatedIcon。此外，还详细阐述了支持新UI的步骤，如创建expUi文件夹，复制图标，配置IconMappings.json文件，并通过iconMapper扩展点进行注册。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

官方提供的图标资源：Icons list | IntelliJ Platform UI Guidelines
平台图标位于：平台源码图标
也可以采用在线工具来自己制作：IntelliJ Icon Generator

一、图标

1、图标获取

图标一般放在src/main/resources文件夹下的特定文件夹中，比如icons，然后可以通过IconLoader工具类来获取；

public interface MyIcons {

  Icon Action = IconLoader.getIcon("/icons/myAction.png", MyIcons.class);
  Icon Structure = IconLoader.getIcon("/icons/myStructure.png", MyIcons.class);
  Icon FileType = IconLoader.getIcon("/icons/myFileType.png", MyIcons.class);

}

然后就可以在plugin.xml中使用MyIcons.java中定义的这些常量了，不需要指定package。如果是使用硬编码方式实现可以使用 @Presentation注解。

<actions>
  <action
          id="DemoPlugin.DemoAction"
          icon="MyIcons.Action"/> <!--不需要指定package->
</actions>

2、建议的图标尺寸

Node, Action, Filetype：16x16
toolWindows：13*13
Editor gutter：12*12

二、图标要求

1、.svg

因.svg是矢量图标，所以提供默认16*16即可。

2、.png

默认：iconName.png
深色theme：iconName_dark.png
默认2倍大小：iconName@2x.png
深色theme2倍：iconName@2x_dark.png

3、animated Icons

要从具有不同延迟的帧创建图标，请使用AnimatedIcon.Frame. 每一帧代表一个图标，以及到下一帧的延迟。如果你想在某个地方显示有一个漫长的过程，你可以使用预定义的AnimatedIcon.Default加载器图标。

AnimatedIcon icon = new AnimatedIcon(500,
          AllIcons.Ide.Macro.Recording_1,
          AllIcons.Ide.Macro.Recording_2);

4、icon tooltips

通过注册com.intellij.iconDescriptionBundle扩展点，可自动为所有工具栏配置默认图标，然后在资源文件中就可以按如下格式定义icon.<icon-path>.tooltip，比如/nodes/class.svg → icon.nodes.class.tooltip会自动加载/nodes/class.svg文件。

三、新UI支持

如果采用系统默认的UI，则可以省略这个操作。如果插件要支持新UI，则需要经过以下操作，比如原默认UI图标的存放路径为/src/main/resources/icons。

创建名为 expUi 的文件夹在图标根目录下，路径为/icons/expUi；可参考示例：images
copy所有的图标到新创建的expUi目录下；可参考示例：PlatformIconMappings.json：示例：MavenIconMappings.json
创建一个$PluginName$IconMappings.json，路径为/icons；
通过com.intellij.iconMapper扩展点在plugin.xml文件中注册 $PluginName$IconMappings.json，可参考示例：plugin.xml

1、plugin.xml中配置

<iconMapper mappingFile="MavenIconMappings.json"/>

2、Mappings.json配置

{
  "icons": {
    "expui": {
      "folderName": {
        "expUiIcon1.svg": "icons/icon1.svg",
        "expUiIcon2.svg": "icons/icon2.svg",
      },
      "anotherFolder": {
        "expUiAnotherIcon.svg": "images/anotherIcon.svg"
      }
    }
  }
}

在json中也可以实现一个新图标替换多个老图标，比如一个vcs.svg代替了两个原图标，配置方式如下：

"vcs.svg": [
  "toolwindows/toolWindowChanges.svg",
  "vcs/branch.svg"
]