IntelliJ IDE 插件开发 | (十)主题插件开发入门

系列文章

本系列文章已收录到专栏,交流群号:689220994,也可点击链接加入。

前言

在前面的章节中,我们介绍的都是功能性插件的开发内容,本文则会介绍一下主题类插件的开发方式。不过本文也只是带大家入个门,目前插件市场存在很多开源的主题插件,还是建议大家在开发不同类型的插件前,参考相应的源码进行学习和个人定制,另外本文所涉及到的完整代码也已上传到GitHub。

创建项目

主题类插件的创建方式和功能性插件步骤一样,如果不清楚的话参考本系列的第一篇文章即可,不过创建完项目后需要创建主题文件:

image-20240405175231763

选择完毕后会出现以下弹框:

image-20240405184323085

点击 OK 后,会发现 plugin.xml 中多了几行配置,同时还会有两个配置文件:

image-20240405184640722

这里以.theme.json结尾的文件用于保存编辑器配置文件位置和其它各类组建的样式配置:

image-20240405185637523

这里editorScheme配置的就是用于控制编辑器内部样式的文件位置,xml 文件初始内容如下:

image-20240405185747515

点击上方的运行还可以预览主题效果:

动画

自定义颜色

在开发主题前,我们可以先自定义命名一些颜色,只需要在.theme.json文件里配置在colors属性下即可:

{"name": "demo","dark": true,"author": "butterfly","editorScheme": "/demo.xml","colors": {"demoColor": "#409EFF"},"ui": {"RunWidget.foreground": "demoColor"}
}

想要修改某个元素的颜色,只需要在 ui 属性中配置相应的键值即可。

如上所示,demoColor就是我们自定义的颜色,然后使用的时候直接用引号包围即可,如上就是把运行配置的前景色设置为了#409EFF(蓝色),效果如下:

image-20240621131525455

那我们是如何知道界面上的某个元素,例如RunWidget.foreground用于配置运行配置的前景色呢?这里就使用到了内部模式文章中提到的UI Inspector这个工具,如下图所示:

image-20240621131925062

可以看到在我们选中了运行配置这个元素后,foreground属性里包含属性名RunWidget.foreground

同时,ui 属性配置也支持通配符符批量设置颜色,例如我们去把所有的前景色都设置为蓝色:

{"name": "demo","dark": true,"author": "butterfly","editorScheme": "/demo.xml","colors": {"demoColor": "#409EFF"},"ui": {"*": {"foreground": "demoColor"}}
}

可以看到(尤其是项目文件部分样式最明显)所有的前景色都变为了蓝色:

image-20240621132703721

除了上述直接设置的颜色,还有类似 Tab 栏在各种状态下的颜色,例如设置编辑器 Tab 栏的悬浮色:

image-20240621140058386

当我们不知道某个元素包含哪些样式设置的时候,也可以根据提示进行选择:

image-20240621140148233

自定义图标

自定义图标颜色

自定义图标包含自定义图标颜色和图标内容两方面,首先展示一下自定义图标颜色:

{"name": "demo","dark": true,"author": "butterfly","editorScheme": "/demo.xml","colors": {"demoColor": "#409EFF"},"ui": {},"icons": {"ColorPalette": {"#AFB1B3": "demoColor","Actions.Red": "#67C23A","Objects.Blue": "#F56C6C"}}
}

其中icons.ColorPalette的内容用于自定义图标颜色,这里展示了两种处理方式,首先看第一行,#AFB1B3是灰色,这里将 IDE 的所有灰色按钮改为了demoColor即蓝色。然后是第二和第三行,这里的ActionsObjects是 IDE 内部对图标的分类,Actions主要包括编译、运行、调试等按钮,Objects则包含文件,运行配置等图标。下面直接展示效果会比较清晰:

image-20240621155820907

可以和默认样式进行对比:

image-20240621155855314

需要注意的是,想要看到自定义图标的效果,需要我们在设置中选择自定义的主题:

image-20240621155951973

自定义图标内容

自定义图标内容很简单,只需要配置图标的源路径和目标路径即可,可以看一个例子:

{"name": "demo","dark": true,"author": "butterfly","editorScheme": "/demo.xml","colors": {"demoColor": "#409EFF"},"ui": {},"icons": {"ColorPalette": {"#AFB1B3": "demoColor","Actions.Red": "#67C23A","Objects.Blue": "#F56C6C"},"/actions/execute.svg": "/demo.svg","/run/run.svg": "/demo.svg"}
}

上述的"/actions/execute.svg"即是将原本的运行按钮替换为我们自己的图标demo.svg(相对于 resources 文件夹的路径),而/actions/execute.svg这个路径则是通过前文提到的内部工具进行获取:

image-20240621160400313

可以看到只要选中了图标就可以通过 icon 属性看到其相对路径,变更效果如下:

image-20240621161104011

不过如果使用了 IDE 新版的 New UI,这里的配置会有些不同,首先看一下截图:

image-20240621161218921

这里直接先说结论,新版 UI 的图标位置都进行了变更,同时会多一个/expui前缀,在配置的时候需要去掉。因此上文中配置的是"/run/run.svg": "/demo.svg",少了/expui,最终效果如下:

image-20240621161435542

除了上述颜色和图标的设置,平台还支持一些尺寸和边框的设置,这里就不再介绍,可以参考官方提供的darcula主题样式文件内容进行一步的学习。

自定义编辑器样式

在前文中提到,生成主题文件的时候会有一个 xml 结尾的文件,这个文件就是用于自定义编辑器内的样式,例如以下配置可以修改行号的颜色和 CTRL 点击时的样式(直线变为了波浪线,通过配置 EFFECT_TYPE 为 2 实现):

<scheme name="demo" version="142" parent_scheme="Darcula"><colors><option name="LINE_NUMBERS_COLOR" value="409EFF"/></colors><attributes><option name="CTRL_CLICKABLE"><value><option name="FOREGROUND" value="548af7" /><option name="EFFECT_COLOR" value="548af7" /><option name="EFFECT_TYPE" value="2" /></value></option></attributes>
</scheme>

效果如下:

image-20240621163407030

由于平台提供的配置项很多,这里就不再一一介绍,可以选择导出自带的主题文件进行学习,导出步骤如下:

image-20240621162643309

用文本文件方式打开上述文件可以看到Dark主题的编辑器样式配置:

image-20240621162921848

总结

本文介绍了主题类插件的开发流程和方式,整体内容比较简单,也只属于入门级别,建议大家在开发主题的时候还是多参考开源的主题插件源码进行学习和改造开发,如果有问题也欢迎在评论区或者讨论群进行交流讨论。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/pingmian/32031.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

linux下chromium/chrome中文字体粗体渲染问题

估计不少人更新后都遇到这个情况了吧&#xff0c;粗体渲染如然变得很模糊&#xff0c;很奇怪&#xff0c;Google下说是字体实现方式变了&#xff0c;国内一些网站用的中文字体都是宋体&#xff0c;但是宋体本身没有粗体&#xff0c;Win下的粗体是微软自己通过某种方式实现的&am…

靠3个字寻求机会,情商不够,别勉强自己

之前我分享了一篇文章寻求一个自由职业的前端伙伴&#xff0c;吸引了好几位朋友来咨询合作&#xff0c;中间出现了不少插曲&#xff0c;好在结果是令人满意的。 作为一名初次创业者&#xff0c;我承认很多地方做的不是那么到位&#xff0c;比如招聘合作伙伴&#xff0c;理想的状…

LLM2Vec论文阅读笔记

这是篇LLM论文&#xff0c;用decoder-like的LLM去提取embedding文章认为&#xff0c;decoder-like的LLM在text embedding task表现不优的一大原因就是其casual attention mechanism&#xff0c;其实就是mask的问题。所以只要对现有的decoder-only LLM进行如下三步改进&#xff…

从零到一学FFmpeg:av_compare_ts函数详析与实战

文章目录 前言一、函数原型二、功能描述三、使用场景四、使用实例 前言 av_compare_ts是FFmpeg库中的一个函数&#xff0c;用于比较两个时间戳&#xff08;Timestamps&#xff09;。这个函数广泛应用于视频处理、流媒体播放和多媒体同步等场景&#xff0c;特别是在需要精确控制…

2024 Jiangsu Collegiate Programming Contest C. Radio Direction Finding 题解 交互 二分

Radio Direction Finding 题目描述 This is an interactive problem. Radio direction finding, also known as radio orienteering or radio fox hunting, is a sport that combines radio technology with outdoor navigation. Participants use specialized receivers to…

Java面试题:对比不同的垃圾收集器(如Serial、Parallel、CMS、G1)及其适用场景

Java虚拟机&#xff08;JVM&#xff09;提供了多种垃圾收集器&#xff0c;每种垃圾收集器在性能和适用场景上各有不同。以下是对几种常见垃圾收集器&#xff08;Serial、Parallel、CMS、G1&#xff09;的对比及其适用场景的详细介绍&#xff1a; 1. Serial 垃圾收集器 Serial…

品牌价值超1592亿,九牧是如何炼成“六边形战士”?

作者 | 吉羽 来源 | 洞见新研社 经历了多年高速发展的中国市场开始慢慢减速&#xff0c;消费者正变得越来越“挑剔”&#xff0c;在信息爆炸的今天&#xff0c;企业面临“需求”与“流量”的双重考验。 市场凭什么记住你&#xff1f;选择你&#xff1f; 答案只有一个&#x…

关于飞浆文字识别技术的运用

飞桨PaddlePaddle-源于产业实践的开源深度学习平台&#xff0c;有关文章可以在此进行查询 飞桨&#xff08;PaddlePaddle&#xff09;是一个由百度开源的深度学习平台&#xff0c;它提供了丰富的机器学习算法库&#xff0c;支持多种深度学习模型的构建、训练和部署。飞桨平台具…

【漏洞复现】万户-ezOFFICE download_ftp.jsp 任意文件下载漏洞

免责声明&#xff1a; 本文内容旨在提供有关特定漏洞或安全漏洞的信息&#xff0c;以帮助用户更好地了解可能存在的风险。公布此类信息的目的在于促进网络安全意识和技术进步&#xff0c;并非出于任何恶意目的。阅读者应该明白&#xff0c;在利用本文提到的漏洞信息或进行相关测…

[项目名称]项目介绍、代码解释及推荐理由

项目介绍 ----  [项目介绍文字描述&#xff0c;如果需要&#xff0c;可引入代码进行说明]  代码解释 ----  [详细解释代码&#xff0c;针对关键部分进行分析]  项目地址 ----  请查看[gitcode链接]中的项目&#xff1a;https://gitcode.com/[你的项目地址]  推荐理…

Java面试题:详细描述Java内存模型中的各个内存区域,以及它们的作用

Java内存模型&#xff08;Java Memory Model&#xff0c;JMM&#xff09;定义了Java程序中各种变量&#xff08;尤其是共享变量&#xff09;的访问规则和可见性&#xff0c;规定了不同线程之间如何通过内存进行交互。Java内存模型中的各个内存区域如下&#xff1a; 1. 堆&…

基于51单片机计步器—无线蓝牙APP上传

基于51单片机计步器设计 &#xff08;程序&#xff0b;原理图&#xff0b;设计报告&#xff09; 功能介绍 具体功能&#xff1a; 本设计由STC89C52单片机最小系统ADXL345加速度传感器lcd1602液晶电路蓝牙模块电路呼吸灯电路电源电路组成。 1.通过ADXL345检测步数&#xff0…

调试实战 | 记一次有教益的 vs2022 内存分配失败崩溃分析(续)

前言 前一阵子遇到了 vs2022 卡死的问题&#xff0c;在上一篇文章中重点分析了崩溃的原因 —— 当 vs2022 尝试分配 923MB 的内存时&#xff0c;物理内存页文件大小不足以满足这次分配请求&#xff0c;于是抛出异常。 本篇文章将重点挖掘一下 vs2022 在崩溃之前已经分配的内容…

HTML静态网页成品作业(HTML+CSS+JS)——动漫斗罗大陆介绍网页(3个页面)

&#x1f389;不定期分享源码&#xff0c;关注不丢失哦 文章目录 一、作品介绍二、作品演示三、代码目录四、网站代码HTML部分代码 五、源码获取 一、作品介绍 &#x1f3f7;️本套采用HTMLCSS&#xff0c;使用Javacsript代码实现图片轮播和tab切换&#xff0c;共有3个页面。 …

24年安克创新社招入职自适应能力cata测评真题分享北森测评高频题库

第一部分&#xff1a;安克创新自适应能力cata测评 感谢您关注安克创新社会招聘&#xff0c;期待与您一起弘扬中国智造之美。 为对您做出全面的评估&#xff0c;现诚邀您参加我们的在线测评。 测评名称&#xff1a;社招-安克创新自适应能力cata测评 第二部分&#xff1a;安克…

福建聚鼎:装饰画现在做起来难吗

在当代社会&#xff0c;艺术创作已经成为很多人表达自我、追求美学生活的方式之一。装饰画作为家居装饰的重要元素&#xff0c;也受到了越来越多人的喜爱。但做一个优质的装饰画真的容易吗? 从技术层面讲&#xff0c;随着科技的发展&#xff0c;制作装饰画的手段和材料都比以往…

【因果推断python】50_去偏/正交机器学习2

目录 Frisch-Waugh-Lovell on Steroids CATE Estimation with Double-ML Frisch-Waugh-Lovell on Steroids 双重/偏差 ML 其思想非常简单&#xff1a;在构建结果和治疗残差时使用 ML 模型&#xff1a; 是估计&#xff0c;是估计 我们的想法是&#xff0c;ML 模型具有超强的…

Autodesk Revit产品痛点分析

1.Revit已有20多年的历史&#xff0c;大多数软件公司认为大多数代码最多只有10年的生命周期。 2.Revit核心部分仍局限于单个CPU核心上,严重制约性能提升。 3.Revit只在数据库的大小和小细节上的改动。 4.Revit陈旧的绘图技术和性能难以提升。 5.Revit的致命弱点是模型增长的…

Red Hat Ansible Automation Platform架构

目录 示例架构&#xff1a;一、Ansible Automation Platform 实现流程详解1. 自动化控制器 (Automation Controller)2. 自动化网格 (Automation Mesh)3. 私有自动化中心 (Private Automation Hub)4. Event-Driven Ansible 控制器5. 数据存储 (PostgreSQL 数据库) 二、实现流程1…

C/C++打假:条件分支语句switch..case效率比if..else高?

很久很久以前&#xff0c;有人教导我说条件分支大于4条时&#xff0c;switch..case效率会比if..else高&#xff0c;条件分支为10条时&#xff0c;switch..case效率会比if..else快一倍不止。随着条件分支越多&#xff0c;效率差异越大。今日得闲&#xff0c;我做了个测试来验证这…