FlowPad
Create and edit local flowcharts inside VS Code. Plan a task, explore a question or explain a process, with Chinese and English interfaces.
在 VS Code 中绘制离线流程图,用于任务规划、问题分析与流程说明,支持中文和 English。
Publisher: Boshen · Extension ID: Boshen4VSCode.flowpad. If you previously installed the internal boshen-local.flowpad package, disable or uninstall it before switching to this extension; the two IDs are separate. Your .flowpad files need no conversion.
Get started
- Click the FlowPad outline icon in the Activity Bar to open a blank canvas. Use New blank canvas in the sidebar to create another.
- Drag a node from the palette, or choose a type and press Enter to place it in the center.
- Double-click a node to edit text. Drag between node ports to connect them; double-click a connection to edit its label.
- Apply text edits, then press Ctrl+S / Cmd+S. On first save, explicitly use a .flowpad filename, such as my-plan.flowpad; VS Code may suggest .json for the untitled document.
You can also open an existing .flowpad file. If another editor opens it, use Reopen Editor With… → FlowPad. To inspect the JSON, click Open in Text Editor.
Features
- Seven node types: Goal / Start, Step, Question, Repeat, Information, Result and Note.
- Directed connections, editable labels and orthogonal routing between node ports.
- Group selection and movement; deleting a node also removes its connections in one undo step.
- Native VS Code save and undo/redo, split editors and external file-change synchronization.
- Wheel zoom, Space / middle-button pan, fit content and keyboard tools.
- VS Code theme colors, light/dark high contrast and narrow split-view layouts.
- Language follows VS Code by default. Choose 中文, English or Follow VS Code in the canvas language menu. User text is never translated.
Keyboard shortcuts
With the canvas focused:
| Action |
Shortcut |
| Select next node / connection |
N / E; Shift reverses |
| Edit selected text / label |
Enter or F2 |
| Select all nodes |
Ctrl+A / Cmd+A |
| Delete selection |
Delete / Backspace |
| Cancel action or clear selection |
Esc |
| Fit content |
F |
| Zoom / actual size |
+, − / 0 |
| Pan |
Arrow keys; Shift moves farther |
Inside the text editor, Ctrl+Enter applies the draft and Esc cancels. Save and undo/redo use VS Code shortcuts. Apply a text draft before saving or closing its editor.
Local files and privacy
FlowPad stores diagrams in .flowpad JSON files. No account, API key, runtime download or cloud service is needed. The extension has no telemetry or runtime network requests. Marketplace installation and update traffic is managed by VS Code.
Language preference is stored in the current VS Code profile. Temporary camera state belongs to each view. Opening a document does not rewrite it. Invalid JSON shows a diagnostic and blocks graph changes until repaired; if available, the last valid graph remains visible.
Requirements and current limits
- Desktop VS Code 1.90 or newer; a universal extension without native modules. Release verification has been performed on Windows VS Code 1.137.0. macOS/Linux and the oldest supported host still need release validation.
- No browser-only VS Code / vscode.dev support.
- Graph clipboard operations, node resizing, automatic layout, image export and reconnecting an existing edge are not available in this version.
- Routing avoids the two endpoint nodes; it does not avoid every other node.
- External document changes preserve an open text draft for copying but block stale submission. Cancel and reopen the text editor to continue.
- Unapplied text drafts do not survive Webview disposal. Extreme graphs may exceed the view even at the minimum 25% zoom.
- Native IME, full screen-reader navigation and multi-monitor DPI still require manual release validation.
中文快速上手
- 点击 VS Code 左侧活动栏的 FlowPad 镂空图标,无需先建文件。侧栏“新建空白画布”可创建更多画布。
- 将节点拖到画布,双击编辑文字;从节点端口拖到另一个端口创建连线,双击编辑标签。
- 应用文字草稿后按 Ctrl+S;首次保存请明确填写 .flowpad 后缀,例如 我的计划.flowpad。
- 顶部语言菜单可切换中文、English 或跟随 VS Code,设置会被记住。切换保留当前草稿和视图。
支持七类节点、框选与分组移动、级联删除、原生撤销/重做、分屏同步、磁盘外部修改重载以及深浅色/高对比主题。滚轮缩放,空格或中键拖动平移,F 适应内容,N/E 选择节点/连线,F2 编辑。
所有图数据保存在本地文件中,插件没有遥测或运行时网络请求。文字草稿应先应用再保存;外部文档变化后,旧草稿保留供复制,请取消后重新打开编辑。当前不支持图形复制粘贴、节点缩放、自动布局、图片导出或已有连线重接。
Support and license
After Marketplace publication, use the listing's Q & A tab for support and commercial-authorization inquiries. Include your VS Code and FlowPad versions, operating system, reproduction steps and a minimal diagram with private content removed.
发布后可通过商店页面 Q & A 反馈问题或咨询商业授权。请附版本、系统、复现步骤和脱敏的最小样例。
© Boshen 2026. Commercial use requires authorization from the author. 商业用途需要获得作者授权。See the included LICENSE.txt; no additional license rights are granted by this description.