今天繼續打磨本地桌面腦圖編輯器 枝見 Zhijian。
枝見是一個基於 C# + Avalonia 的 Markdown-first 腦圖編輯器。它不是一個複雜專案管理系統,而是圍繞寫大綱、梳理功能設計、整理文章結構這些高頻場景,將大綱、Markdown 和腦圖三種視角綁定到同一棵樹上。
專案倉庫:https://github.com/dotnet9/Zhijian。
本輪截圖和 GIF 已按目前介面重新製作,並使用程式啟動時預設載入的使用手冊,重點展示檔案列表、小圖、縮放、畫布拖拽和層級調整。

開啟就是使用手冊
新版本啟動後會預設載入隨程式輸出的 使用手冊.md。這份文件本身就是一棵多層級腦圖,首頁可以直接看到檔案列表、大綱和腦圖的聯動效果;使用者需要從零開始時,仍然可以透過「新增」建立只有中心主題的空白腦圖。
腦圖二級節點也不再是單調灰色。新增或匯入後,二級節點會使用更醒目的自動強調色;備註文字使用灰色前景和略大的字型,與標題區分,但不再額外加背景塊,視覺負擔更低。
檔案選單補齊成產品工作流程
標題列「檔案」選單現在不只是匯入匯出入口,而是完整檔案工作流程。macOS 下選單快速鍵會顯示並回應 ⌘,Windows/Linux 繼續使用 Ctrl,避免 Mac 使用者看到一組不符合系統習慣的快速鍵。
- 新增:建立一個空白腦圖。
- 新增視窗:開啟新的編輯器程序。
- 開啟:透過一個檔案對話方塊選擇 Markdown、OPML、XMind 等支援格式,並將這個檔案放進左側檔案列表。
- 開啟資料夾:掃描資料夾下支援的腦圖檔案,並在左側檔案列表裡切換。
- 開啟最近檔案:記錄最近操作過的檔案。
- 儲存、另存新檔、開啟檔案位置、關閉:補齊日常編輯需要的閉環。

標題列選單繼續按真實工作流程整理
選單現在不再只放「檔案」和「關於」。標題列已經整理為檔案、編輯、主題、語言、說明、關於幾組入口,選單項目帶圖示,常用操作顯示快速鍵。

「編輯」選單放復原、重做、新增同層、新增子層、提升、降級、上移、下移、刪除,以及「複製為 Markdown」。複製後會寫入系統剪貼簿,並使用桌面全域訊息提示。

主題不再使用標題列 ToggleSwitch,而是單獨放到「主題」選單裡,後續擴充更多主題會更自然。語言選單使用 Lang.Avalonia.Json,目前提供中文簡體、中文繁體、英語和日語資源。

「說明」選單提供問題回饋、提交需求、提交 PR 和 GitHub 倉庫入口;「關於」選單繼續提供網站、更新日誌、感謝和關於視窗。
首次啟動新手引導這次重新梳理過:檔案步驟直接反白標題列檔案選單,不再籠統罩住左側面板;後續步驟再依序指向大綱編輯區、Markdown 切換、腦圖畫布、小圖預覽、縮放和狀態列導覽。引導裡提供「跳過」按鈕,剛開啟軟體的人可以隨時結束引導。
是否顯示引導、預設語言、最近檔案數量、歷史步數,以及 recent-files.json、new-user-tour.seen 這些執行狀態檔名,都集中放在 src/Zhijian/App.config。執行時期由 ApplicationSettings 讀取 .NET 編譯後的 Zhijian.dll.config,設定損毀時回退到預設值,不影響啟動。

開啟單一檔案後,左側「檔案」Tab 會列出這個檔案,方便後續切換;開啟資料夾後則列出目錄裡的 Markdown、OPML、XMind 文件。選擇檔案後會自動切回「大綱」,展示目前腦圖結構。

關閉或切換檔案前如果存在未儲存修改,會彈出儲存提示。最近檔案記錄儲存在程式目錄,避免每次重新定位常用文件。
大綱和腦圖都要順手
大綱檢視和腦圖檢視共用同一個 MindMapNode 樹,所以在任意一側編輯標題、備註、父子關係,另一側都會同步重新整理。
常用結構操作補到了兩個檢視的選單裡:
- 新增子節點、新增同層節點。
- 提升為父節點、降級為子節點。
- 上移、下移。
- 備註、刪除。

鍵盤建立節點的路徑也重新走了一遍:Enter 新增同層,Tab 或 Shift+Tab 調整層級,焦點會落回新節點輸入框。

大綱圓點選單和拖拽共用同一個入口,短按開啟選單,移動超過閾值後才進入拖拽,這樣選單和拖拽不會互相搶事件。

備註輸入也做了細節處理:只有節點已有備註,或者使用者明確選擇「備註」時才顯示備註輸入框;空白備註失焦後會自動收合。腦圖節點裡備註與標題已經按同一文字對齊方式繪製,短文字節點也能重新點回去繼續輸入。

腦圖節點獲得焦點後會顯示懸浮工具列,可以直接新增備註或刪除節點。

腦圖側也支援拖拽調整父子層級,拖到節點中部成為子節點,拖到上下邊緣調整同層順序。

小圖、縮放和畫布拖拽
腦圖面積變大後,使用者最需要的是「我現在看的是整張圖的哪一塊」。小圖現在基於真實節點座標和目前視口繪製,不是固定示意圖;點擊小圖可以定位到對應區域。

縮放、中心主題定位、畫布拖拽也都在實際視窗裡重新驗證過。

中間分隔條的拖拽調整寬度也已經改為明確的 GridSplitter 行為並透過截圖驗證,只是這類動圖對閱讀幫助不大,文件裡不再把它作為重點展示。
關於、更新日誌和感謝
標題列「關於」選單包含:
- 開啟網站:https://codewf.com
- 更新日誌:獨立桌面視窗展示隨程式複製的更新日誌檔案,並使用
CodeWF.Markdown.Lite.Themes渲染。 - 關於:展示軟體名稱、簡介、版本號、更新時間、作者、聯絡方式、倉庫地址和 NuGet 套件地址。
- 感謝:列出本專案使用和受益的開源專案,連結可直接跳轉。

枝見感謝這些優秀的開源平台和專案:
新應用怎麼複用 CodeWF.MindView
如果你想在自己的 Avalonia 應用裡複用腦圖能力,優先引用 CodeWF.MindView,不要直接複製整個枝見應用。
CodeWF.MindView 目前包含:
MindMapNode:共用節點模型,包含標題、備註、顏色、座標和子節點。MindMapEditor:腦圖主編輯控制項,內建基礎節點建立、刪除、升降級、同層移動、拖拽移動和自動佈局。MindMapMiniMap:基於真實節點座標的小圖控制項。MindMapDocumentCodec:Markdown、OPML、XMind 編解碼。IMindMapEditorController:可選宿主介面,需要接入復原歷史、未儲存狀態或業務限制時再實作。IMindMapFileService:檔案開啟、儲存、最近檔案、資料夾載入和未儲存提示等應用級檔案服務協定。
新應用可以引用控制項庫和主題庫:
<ItemGroup>
<ProjectReference Include="..\CodeWF.MindView\CodeWF.MindView.csproj" />
<ProjectReference Include="..\CodeWF.MindView.Themes\CodeWF.MindView.Themes.csproj" />
</ItemGroup>
在 App.axaml 註冊主題:
<Application
xmlns="https://github.com/avaloniaui"
xmlns:mindThemes="using:CodeWF.MindView.Themes">
<Application.Styles>
<mindThemes:MindViewThemes />
</Application.Styles>
</Application>
頁面裡直接放腦圖控制項。一般接入只需要繫結節點集合和目前選取:
<UserControl
xmlns="https://github.com/avaloniaui"
xmlns:mind="https://codewf.com">
<mind:MindMapEditor
Roots="{Binding Roots}"
SelectedNode="{Binding SelectedNode, Mode=TwoWay}" />
</UserControl>
宿主 ViewModel 提供 ObservableCollection<MindMapNode> 就能跑起來。控制項庫負責顯示、編輯、拖拽預覽、小圖和基礎節點操作;應用如果要管理自己的文件狀態、復原歷史、檔案選單和業務規則,再實作 IMindMapEditorController 並繫結 Controller。
如果你的應用也需要類似枝見的大綱檢視、檔案選單、標題列和 Markdown 面板,可以參考 src/Zhijian。其中 OutlineEditor 和桌面視窗屬於應用層程式碼;CodeWF.MindView 則保持 Avalonia-only,方便其他專案複用。
倉庫與發佈
- 倉庫地址:https://github.com/dotnet9/Zhijian
- 發佈地址:https://github.com/dotnet9/Zhijian/releases/tag/V12.0.3
本輪驗證
這輪不只是改完程式碼看一眼編譯。我重新產生了文件截圖/GIF,並用預設載入的使用手冊覆蓋這些操作:
- 啟動預設載入使用手冊,並確認單獨開啟的檔案會出現在左側檔案列表。
- 開啟檔案選單和關於選單,確認標題列選單可點擊且右側沒有突兀箭頭。
- 開啟編輯、主題、語言、說明選單,確認選單、圖示、快速鍵和分類都正常。
- 切換深色/淺色主題,確認文字和選單在不同主題下可讀。
- 切換英語語言,確認標題列選單、Tab 和狀態列文字能更新。
- 使用複製為 Markdown,確認剪貼簿命令執行並出現桌面全域訊息。
- 重設首次啟動標記,確認新手引導能按真實視窗顯示。
- 點擊引導「跳過」,確認能立即關閉引導並寫入已看過狀態。
- 開啟資料夾,確認「檔案 / 大綱」Tab 能切換並載入檔案。
- 在大綱和腦圖中開啟節點選單,確認常用結構操作齊全。
- 編輯短文字節點和備註,確認可以重新獲得焦點且標題/備註對齊。
- 使用 macOS
⌘ + L、⌘ + 滑鼠滾輪,確認中心主題定位和縮放符合 Mac 快速鍵習慣。 - 開啟小圖、縮放腦圖、拖拽畫布。
- 透過 ViewModel 模擬新增、新增同層、新增子層、刪除、提升、降級、備註和 Markdown 同步。
- 拖動左右分隔條,確認大綱和腦圖寬度能真實調整。
最終建置命令:
dotnet build Zhijian.slnx
建置結果為 0 警告、0 錯誤。
對我來說,枝見最重要的不是堆功能,而是每個高頻操作都順手:開啟就是空白文件、選單項目能直接命中真實需求、節點建立後焦點在正確位置、備註不搶視覺、縮放和小圖能幫使用者重新找到方向。這些細節做好了,使用者才願意一直用它整理結構。