做了个 IntelliJ 主题,让我再也不想用 JetBrains 的 IDE 了

2023-05-04 15:44:56 +08:00
 anson0370

大家好,前不久分享了下我们的 HardHacker 的主题,有些朋友表示想要 JetBrains 的版本。讲道理我也是写了十几年 Java 的,那还有什么好说的,整💪。

目前已经整了一个算是可用的版本了,大家可以在 Marketplace 里搜索 HardHacker 找到。

这里也丢个图:

只能说真的是无知者无畏,下次谁再让我给 IntelliJ 做主题,我谢谢他🙏。以下都是吐槽,也算是我踩到的坑,分享出来给也想要做 IntelliJ 主题的勇士参考一下,不感兴趣的朋友就可以直接略过了。


出师不利,官方教程跑不通

首先我们打开官方文档,找到 Theme 的部分。IntelliJ 的 Theme 也是 plugin 的一种,JetBrains 专门为 Theme 做了一个简化的工程和创建流程。看起来很简单,next 、next 、run ,喜提 ClassNotFoundException 。经过亿点点研究之后,我发现是 IDEA 在 run Theme plugin 的时候 classpath 里少了个 IDEA 自己的 jar ,但是没找到办法自定义 run Theme plugin 的时候的 classpath 。

于是又经过亿点点搜索之后,我找到了这个:

相关 issue 在这:https://youtrack.jetbrains.com/issue/IDEA-302414 。好嘛,7 months ago 。不过 JB 家 bug 常年不修也是传统了🤷🏻‍♂️,只要有 workaround 那也行。


Schema 困惑之旅

把我的 theme 切换成 gradle 工程之后,总算可以跑起来了。

众所周知,IntelliJ 的样式分成 theme 和 schema 两部分,theme 控制 UI ,而 schema 则控制 editor 的内容。(这里就要给 vscode 磕一个了,它就不分,开发 theme 的体验非常舒爽)

由于我之前在 Github 上找到一个 JB 官方的 schema converter:JetBrains/colorSchemeTool (github.com) 。用它可以把 vscode 的 theme 转换成 IntelliJ 的 schema ,我决定从它的转换结果开始。然后困惑之旅就开始了。

不知道 key 值是什么

IntelliJ 的 schema 是个 XML 文件,大概长这样:

<scheme name="Hard Hacker" parent_scheme="Darcula" version="142">
  <colors>
    <option name="SELECTION_BACKGROUND" value="3f3951"/>
	</colors>
	<attributes>
    <option name="HYPERLINK_ATTRIBUTES">
      <value>
        <option name="FOREGROUND" value="e192ef"/>
        <option name="EFFECT_TYPE" value="1"/>
        <option name="EFFECT_COLOR" value="e192ef"/>
      </value>
    </option>
  </attributes>
</scheme>

看起来挺清晰的,但问题是这个 option 的 name 是完全没有文档的。官方的意思是你看着我们内置的主题文件自己猜吧:intellij-community/highContrastScheme.xml at idea/231.8109.175 · JetBrains/intellij-community · GitHub

这些 name 命名毫无规律,比如:

你想从中找到规律?主打的就是一个没有规律。✌️🤬

那么怎么才能准确找到你想改的 option 呢?特别是上面提到的那个 JB 官方转换工具的转换结果还缺斤少两的情况下?就此事我和 ChatGPT 探讨了一下,它给了我一个建议:你直接在 IDE 的 settings 里改,然后导出,再查找。你别说还真管用……我只需要找到那个配置,然后把颜色改成比如 334554 ,123456 ,然后导出来打开,cmd + f 即可……

默认值逻辑乱七八糟

IntelliJ 的 schema 里,不同 scope 之间是有继承关系的。比如 Java 的 keyword 会继承 default 的 keyword 。这很方便,但同样的,这部分也没规律。简单来说就是有时候你直接不管,它自动就继承了,而有时候你又必须显式声明,否则它就会有一个默认的💩一样的配色:

<option name="XPATH.KEYWORD" baseAttributes="DEFAULT_KEYWORD"/>

魔法数字

注意看我刚才贴的 schema 文件的内容第一行:

<scheme name="Hard Hacker" parent_scheme="Darcula" version="142">

version 是 142 ,但别问我为什么是 142 ,我只知道我改成 143 不行,但我改成 143 再改回 142 似乎可以刷新某种 cache 🧙‍♂️!因为你会发现当你在 devkit 的 IDEA 中改了 schema 并保存后,有一定概率你再改 schema 文件它不生效!此时就可以用这个 143/142 大法。

然后这个 parent_scheme 是 Darcula ( IntelliJ 自己有个 Darcula 主题,并不是那个 Dracula themes ),你改成别的比如 Dark 也是没用的。还有这 Darcula 拼错了吧喂?

不能 hotreload

这就不得不再提一下 vscode 了,保存实时生效,简直太方便了🧎🏻‍♂️。但 IntelliJ 这个你要么重新手动 import 一下,要么直接 rerun plugin ,然后等它重新启动一个 devkit 的 IDEA 。

搞了几次之后我就学乖了,我在 notion 里列了一个 TODO list ,一次改一批然后列进去。重启一次之后对着这个 TODO list 再一个一个检查……

不支持透明度

都 2023 年了。唯一支持透明度的是 editor 里的滚动条。


困惑加倍,快乐归零

说完 schema ,我们来看看 theme 部分。基本上 schema 部分的槽点,theme 部分都占了。比如找不到 key (官方给了一个 LaF 工具,但也只能看到 key 值,并不知道具体对应哪里,得不断修改来尝试);比如不能 hotreload 等等。此外因为 2023 的 New UI 还在 beta 阶段,所以有些 UI 样式改不了,所以如果你安装了主题之后发现有些地方不协调,那很可能就是因为……改不了。

但最让我抓狂的是 code suggestion 的弹出框,就是这个东西:

为了调这个东西,花了我大半天时间。因为……这东西别的都归 theme 管,唯独背景色归 schema 管!我 TM 带着无比的困惑在 LaF 和别人的主题文件里找它的背景色找了两个小时!两个小时!🤬🤬🤬


经过两天的折腾,我算是知道为什么 IntelliJ 的主题这么少了,就这开发体验没点共产主义吃苦耐劳的优良品质都坚持不下去。

写到这里的时候我突然想起来自己以前在 youtrack 上 star 过的一些 issues ,我就去翻了一下。好家伙 9 years ago 的 issue 还开着呢,7 months 简直不值一提。

说实话就 schema 里那些 attribute names 的混乱情况,让我很难相信 IntelliJ 里面的代码不是一坨💩⛰️……

年年更新大版本,就不能解决一下这些历史遗留问题吗?突出一个能跑就行。这么想想好像拿 Fleet 来彻底解决一下是个合理的思路,虽然 JB 说的挺好听的 Fleet 和 IntelliJ 不存在竞争关系,但这不是明摆着前浪后浪的事?

想想自己从 09 年开始用 IntelliJ IDEA ,到今天 IDEA 也显出老态了。Anyway ,欢迎大家试用主题。

12710 次点击
所在节点    程序员
94 条回复
hvsy
2023-05-04 17:33:39 +08:00
jetbrains 的插件开发文档确实缺失的厉害,想弄点啥都难,很多时候得去看别人的插件和源码才能找到解决方案.
还有 IDEA 很早有类似 hotreload 的主题开发预览了.可以参考一下这个文章
https://blog.jetbrains.com/platform/2021/10/themes-in-intellij-based-ides/
xiaohundun
2023-05-04 17:33:43 +08:00
我也不想用,那可以推荐个开发 Spring 栈比较好的 ide 么🤩
anson0370
2023-05-04 17:39:19 +08:00
@Mandyer
@declandragon
@LongerAng
可能是因为我做的时候起始版本直接 231 起步,因为 2023 开始才有 New UI ,我主要适配了 New UI 。

@ijaysdev 你这个 2023.1 也搜不到我得研究下……我去试试
TyCoding
2023-05-04 17:41:18 +08:00
没有搜索到,IDEA2023 版本
roundgis
2023-05-04 17:44:58 +08:00
又不是不能用....
TyCoding
2023-05-04 17:45:35 +08:00
Not compatible with the version of your running IDE (IntelliJ IDEA 2022.3.2)
jabari
2023-05-04 17:46:10 +08:00
配图什么字体呀? 感觉不错~~
anson0370
2023-05-04 17:50:19 +08:00
@TyCoding 抱歉,目前我是对着 New UI 适配的,所以 since 版本直接选的 231 ,也就是 2023.1 。有空的时候我把版本降了看看兼容性再调一下。
anson0370
2023-05-04 17:53:55 +08:00
@ijaysdev 抱歉,无法重现。楼上也有几位朋友说 2023 版本的搜不到,我有点懵。
![screenshot]( )
anson0370
2023-05-04 17:54:53 +08:00
@jabari 截图中的字体是 IBM Plex Mono
anson0370
2023-05-04 17:56:14 +08:00
@Vitta 那个主题是很漂亮,可惜它在 VSCode 中的实现是靠 hack VSCode 的文件来做到的,很难迁移到别的工具上。
anson0370
2023-05-04 18:00:42 +08:00
@Danswerme 我就直接问它怎么才能方便的知道编辑器中某个文字对应的主题属性名是什么?😂
Saito
2023-05-04 18:02:04 +08:00
@Vitta SynthWave 这个主题太瞎眼了,像我们这种中老年程序员还是得选个护眼的主题。
kingzeus
2023-05-04 18:10:50 +08:00
很漂亮的主题,已经在用了。感觉颜色亮度有点高,看久了眼睛比较累

JB 的插件确实比较坑,我的插件搞了一半就不想继续了。
thisrabbit
2023-05-04 18:26:10 +08:00
JB 家 bug 修的确实慢的离谱😂我之前想提个在 markdown 里格式化 table 时不能正确区分 markdown 的列符号 | 和转义的 cell 内容 \|,结果发现这 bug 老早就有人提了,不过最近几个版本好像终于修了。
ksedz
2023-05-04 18:31:29 +08:00
> 众所周知,IntelliJ 的样式分成 theme 和 schema 两部分,theme 控制 UI ,而 schema 则控制 editor 的内容。(这里就要给 vscode 磕一个了,它就不分,开发 theme 的体验非常舒爽)

VSCode 不区分么,上次想做个自己的高亮主题,支持一些冷门语言,发现无法同时实现词法语法分析和自定义主题。
EvilDevilJin
2023-05-04 18:37:15 +08:00
OP 有意向做个 VS Code 的 light theme 吗,dark theme 太多优秀的好作品了。
但是 light theme 很少有足够美观精致好用的。
anson0370
2023-05-04 18:38:40 +08:00
@ksedz VSCode 不区分 UI 和 editor 内部的样式,统一一个 theme 文件就搞定了。但你说的要同时做掉语法分析不属于 VSCode theme 的范畴。
Vitta
2023-05-04 18:40:09 +08:00
@Saito #33 我也觉得瞎眼,但是用别的用了一阵子又想他了 🐶
anson0370
2023-05-04 18:41:41 +08:00
@EvilDevilJin 有在考虑,主要配色需要重新选一下,目前的色盘放在亮色背景下对比度约等于没有,需要重新调一下色盘起码保证符合 WCAG AA 标准。

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/937267

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX