熟悉的vim的同學(xué)大多都用過的一個配色Gruvbox，整體給人感覺沉穩(wěn)、清晰，對眼睛也十分友好，沒有過于暗或者亮的地方，也不花里胡哨。正重要的是，微微泛黃，在晚上看起來也很舒服。
除了vim之外，我其實(shí)有一半的時間都在jetbrains的IDE里干活，比如IntelliJ IDEA 和 DataGrip，在2019.1版本之后，jetbrains也全家桶支持自定義主題了，但是一直到今天其實(shí)都沒有找到用起來舒服的 配色，有幾款喜歡的也都是這里或者那里不太舒服，所以決定自己打造一款基于gruvbox的主題配色。
最終效果圖大概是這個樣子，插件目前已經(jīng)審核通過，可以直接在jetbrains任何編輯器中下載使用。
除了Java配色之外，還花了些時間調(diào)整了下其他和Jvm方言和前端技術(shù)棧語言的配色，比如這些：
JSX & Javascript
DataGrip-SQL
CSS&HTML
制作過程
整個制作過程分為三部分
- 查看官方SDK文檔，了解插件開發(fā)基本知識
- 制作IDE UI的配色
- 制作代碼Scheme Colors
IDE插件項(xiàng)目創(chuàng)建
之前沒有接觸過IDE插件的開發(fā)，所以先花時間閱讀了下官方文檔。我個人其實(shí)就閱讀了三個部分：
創(chuàng)建項(xiàng)目其實(shí)很簡單，IDEA旗艦版本默認(rèn)是安裝DevKit的，所以可以直接基于DevKit創(chuàng)建和開發(fā)插件項(xiàng)目。
主題制作
主要說說主題制作部分，其他內(nèi)容都可以參考官方文檔學(xué)習(xí)。
主題分為兩部分：UI配色和代碼配色。
- UI配色：就是IDE的面板，按鈕，對話框，菜單，工具欄等等上的圖標(biāo)、背景、字體、邊框的配色。
UI配色文件在一個josn文件里進(jìn)行編輯和調(diào)整，可以點(diǎn)擊上面的按鈕隨時預(yù)覽和調(diào)整，也可以實(shí)施編輯和預(yù)覽。
- 代碼配色就很好理解了，最核心的內(nèi)容，各種語言的關(guān)鍵字，方法，變量等等的字體顏色，大小，顯示效果等等。
代碼的配色調(diào)整官方建議是使用setting面板里面Color Scheme編輯功能進(jìn)行設(shè)計(jì) ，最后使用導(dǎo)出功能添加到工程項(xiàng)目里即可。
設(shè)計(jì)思路
整套主題配色都是基于Gruvbox的，然后針對IDE和Java的特點(diǎn)進(jìn)行調(diào)整。我給自己設(shè)立幾個目標(biāo)和需要注意的點(diǎn)：
- 代碼整體配色和Gruvbox保持一致
- UI配色和代碼配色貼近，整體風(fēng)格統(tǒng)一
- 針對Java語法特點(diǎn)進(jìn)行調(diào)整，代碼整體觀感避免花花綠綠，配色使用盡量克制
- 避免出現(xiàn)和默認(rèn)主題顏色上的認(rèn)知沖突，比如默認(rèn)紅色為錯誤和未知內(nèi)容，所以所以Gruvbox的紅色關(guān)鍵字配色就不能使用
- 避免出現(xiàn)內(nèi)容和背景顏色貼近，導(dǎo)致閱讀困難或者引起視覺疲勞。這一點(diǎn)其實(shí)很重要，之前使用的很多三方主題都有類似的問題。
基于以上目標(biāo)，其實(shí)第一版的設(shè)計(jì)很快就完成了，但是細(xì)節(jié)上的顏色搭配其實(shí)調(diào)整了很久，尤其是為了滿足最后一點(diǎn)，沒少折騰。
關(guān)于代碼配色的設(shè)計(jì)，其實(shí)是一件很有意思的事情，整個過程下來，也是我更理解代碼配色對于編碼編寫和閱讀的重要性。
關(guān)于代碼配色的設(shè)計(jì)和制作其實(shí)整體還是蠻簡單的，直接拿著IDEA的默認(rèn)黑色主題Dracula進(jìn)行復(fù)制，然后在上面進(jìn)行修改就可以了。第一步是設(shè)置背景和其他Gruvbox的顏色，然后調(diào)整警告，錯誤，文本等等基礎(chǔ)內(nèi)容的顏色。第二步就是專門針對Java語言調(diào)整，這一步也是最重要的一步。整個過程當(dāng)然也不是從0開始的，借鑒了大量我之前使用的主題的設(shè)計(jì)思路，然后使用相近的Gruvbox配色進(jìn)行替換。
- 接口（加粗）和類進(jìn)行區(qū)分（在IDEA的默認(rèn)配色中兩者風(fēng)格是一致的）
- 除了錯誤和警告，避免使用任何形式的下劃線（很討厭下劃線，所以用在錯誤和警告上，這樣一看見就會引起負(fù)面情緒，讓我更想去刪掉或者修復(fù)掉對應(yīng)的內(nèi)容）
- 輔助語法提示顏色盡量和背景有明顯區(qū)分但是不突出，避免影響編寫代碼時的注意力。打個比方，打開一個類，第一眼看過去肯定是方法申明和語法邏輯，而不是醒目的范型提示。
顏色使用上的克制。在Java中，需要強(qiáng)調(diào)的內(nèi)容添加顏色，其余的全部保持默認(rèn)。比如，類、this的字段、關(guān)鍵字、字符串、常量、注解這些需要強(qiáng)調(diào)的給予對應(yīng)的顏色進(jìn)行區(qū)分。其余的比如方法調(diào)用、變量、局部變量、靜態(tài)方法、運(yùn)算符等等都保持默認(rèn)顏色。然后就是注釋和編輯器的提示，全部都弱化，避免和代碼主體混淆，但是仍然容易閱讀。
還有一些就是從其他地方借鑒的：比如靜態(tài)都是斜體（方法和常量）。對于靜態(tài)字段，在編寫時一眼能看出來和普通常量的區(qū)別也很有用，所以顏色上也略深于普通變量。
當(dāng)然，整個代碼配色的設(shè)計(jì)過程中還有大量的內(nèi)容，很多都是借鑒了其他我比較喜歡的主體的設(shè)計(jì)思路，最終完成了對于我個人比較滿意的一套配色。我相信，對于大部分Java開發(fā)的同學(xué)，這套配色應(yīng)該都是相對比較有好的，歡迎大家在IDEA的插件倉庫中下載使用，有任何使用問題也歡迎提Issues。
