DSH 動森主題 Animal Island UI:把編碼工作臺換成低對比紙面

前言

長時間在 DSH 裏寫代碼、看 diff,界面配色越鮮豔越容易累。Animal Island UI 是社區主題插件,屬於分類「趣味換裝」,由 Shirolin 維護,面向 DSH Web 端和 Windows 桌面端,把界面重心放在低對比的奶油紙面與木色邊界上,同時保留一點手賬和海島元素。下面介紹它提供什麼、怎麼裝、需要注意什麼。

這是什麼

Animal Island UI 是 DSH 的主題插件,基於 DSH 公開的 ThemeRuntime Token 與 Slot 接縫實現,版本 0.3.36,許可證 MIT。它不修改 DSH 的佈局、快捷鍵和交互習慣,只覆蓋樣式層。倉庫自述爲「A high-fidelity Animal Island inspired DSH Web skin」,視覺參考開源組件庫 animal-island-ui。

需要先說明的是:這是開源社區插件,與 DeepSeek 官方及任天堂沒有任何隸屬、授權或背書關係,也不包含受版權保護的遊戲專有資產。

核心功能

晝夜兩套畫布

日間用雙層波點草坪、底部波浪和低透明度漂浮葉片,主內容區鋪半透明奶油白紙面。夜間是獨立調校的深青夜空加星點畫布,側欄偏冷色,內容紙面仍爲暖棕,代碼塊使用深棕底色。

手賬部件與交互細節

  • 側欄頂部的 24px 新會話入口擴展成 216×60 的渡島船票樣式,帶奶油紙面、薄荷票根和打孔撕口。
  • 頂部路徑改爲木質綬帶,側欄選中項是豎向木紋牌,底部輸入框加了對話氣泡尾標和紙紋。
  • 主按鈕帶實體底邊和按壓位移;鍵盤焦點環改爲 2px 內嵌薄荷環,避免在滾動容器邊緣被裁切。

應用內外觀設置

在「設置 → 插件 → 動森外觀」裏可以調整:

  • 三檔預設:紙白 / 均衡 / 海島。
  • 畫布濃度滑桿,範圍 0.15–0.60,帶實時分層預覽。
  • 可單獨開關插畫裝飾、紙紋顆粒。
  • 淺色 Diff 語法配色可選暖色或 DSH 原生。
  • 界面字體可選 Nunito 拉丁字體或系統默認字體。

偏好保存在當前客戶端的 localStorage 中。

實現邊界

覆蓋 118 項 ThemeRuntime Token 與 4 個公開 Slot,不使用 DOM 輪詢、MutationObserver 或構建期隨機哈希類名。字體(Nunito WOFF2)和原創 SVG 插畫在構建期直接內嵌進 bundle,運行時不發起外部網絡請求。

安裝與啓用

README 建議同一 profile 下只啓用一個主題插件。三種安裝方式如下。

方式一,插件市場安裝。在 DSH 內打開「設置 → 插件」,搜索 Animal Island UI 或「動森」,安裝後重啓應用生效。

方式二,通過 NPM 安裝到 Profile。進入 DSH profile 目錄直接安裝:

cd <DSH_Profile_目錄>
pnpm add dsh-theme-animal-island-ui

安裝後需要完整重啓 DSH 服務並刷新頁面。

方式三,離線 .tgz 安裝包。從 GitHub Releases 下載對應版本的 .tgz 和 SHA256SUMS:

cd <DSH_Profile_目錄>
pnpm add file:<下載目錄>/dsh-theme-animal-island-ui-<version>.tgz

Windows 桌面端使用獨立的 desktop profile,依賴客戶端內置的 Electron Node 運行時執行安裝。如果已克隆倉庫,可以用腳本一鍵打包並同步到本機的 web 與 desktop 兩個 profile:

pnpm install
pnpm run install:local

典型用法

安裝啓用後,打開「設置 → 插件 → 動森外觀」即可調整預設和開關。README 還提供了面向外部腳本的子路徑導出,可以直接複用色板和對比度計算:

import { ANIMAL_ISLAND_PALETTES } from 'dsh-theme-animal-island-ui/palette'
import { buildTokenOverrides, contrastRatio } from 'dsh-theme-animal-island-ui/tokens'

適用場景與注意

適合希望降低編碼界面視覺刺激、又想保留一點個人風格的 DSH 用戶。如果只想確認效果,可以看作者的宣傳頁與實機演示。

兩點需要注意:

  1. 插件以當前 DSH 進程的權限運行,安裝前應查看源碼和許可證(MIT)後再決定是否啓用。
  2. DSH 升級後如果接縫變更,主題可以自動回退到原生界面,但升級後最好確認一下外觀設置是否保持預期。

另外,倉庫路徑需從 DSH 客戶端的插件安裝入口進入,不建議憑名稱自行拼接 dsh plugin add 命令。

結尾

Animal Island UI 做的事不復雜:不改功能,只把界面改成適合長時間閱讀的紙面風格,並放在 DSH 公開的樣式接縫上。社區目錄頁在 skillhub.cn,源碼和文檔在 GitHub。

羽毛球分组比赛记分
小程序二维码

欢迎使用《羽毛球分组比赛记分》微信小程序

小夜