Initial TrueGrowth source import
This commit is contained in:
144
docs/user-manual/content/basics/canvas-navigation.mdx
Normal file
144
docs/user-manual/content/basics/canvas-navigation.mdx
Normal file
@@ -0,0 +1,144 @@
|
||||
---
|
||||
title: 画布操作
|
||||
category: getting-started
|
||||
order: 1
|
||||
---
|
||||
|
||||
# 画布操作
|
||||
|
||||
Opentu 提供无限画布，你可以自由拖动、缩放，拥有无限的创作空间。
|
||||
|
||||
<Screenshot id="canvas-tools" />
|
||||
<p class="screenshot-caption">工具栏中的手形工具和选择工具</p>
|
||||
|
||||
## 移动画布
|
||||
|
||||
### 方法一：手形工具
|
||||
|
||||
1. 按 `H` 键切换到手形工具
|
||||
2. 在画布上拖动
|
||||
|
||||
### 方法二：空格键 + 拖动
|
||||
|
||||
按住空格键，然后拖动鼠标。
|
||||
|
||||
### 方法三：鼠标中键
|
||||
|
||||
按住鼠标中键（滚轮按下）拖动。
|
||||
|
||||
## 缩放画布
|
||||
|
||||
### 方法一：鼠标滚轮
|
||||
|
||||
滚动鼠标滚轮即可缩放：
|
||||
- 向上滚动 - 放大
|
||||
- 向下滚动 - 缩小
|
||||
|
||||
### 方法二：快捷键
|
||||
|
||||
- `Ctrl/Cmd + +` 或 `Ctrl/Cmd + =` - 放大
|
||||
- `Ctrl/Cmd + -` - 缩小
|
||||
- `Ctrl/Cmd + 0` - 重置为 100%
|
||||
|
||||
### 方法三：视图导航
|
||||
|
||||
点击右下角的缩放控件：
|
||||
- 点击 **+** 放大
|
||||
- 点击 **-** 缩小
|
||||
- 点击百分比数字，可以选择预设缩放比例
|
||||
|
||||
## 视图导航
|
||||
|
||||
<Screenshot id="view-navigation" />
|
||||
<p class="screenshot-caption">视图导航控件：① 缩小 ② 自适应 ③ 放大</p>
|
||||
|
||||
右下角的视图导航提供了多种视图控制功能：
|
||||
|
||||
### 缩放控制
|
||||
|
||||
显示当前缩放比例，点击可选择：
|
||||
- 50%、75%、100%、150%、200%
|
||||
- **自适应** - 让所有内容适应屏幕
|
||||
|
||||
### 自适应视图
|
||||
|
||||
点击 **自适应** 或按 `Ctrl/Cmd + 0`，会自动调整缩放和位置，让所有内容都显示在屏幕内。
|
||||
|
||||
### 小地图
|
||||
|
||||
显示画布的整体缩略图，方便在大型画布中定位。
|
||||
|
||||
## 选择元素
|
||||
|
||||
### 选择单个元素
|
||||
|
||||
1. 按 `V` 键切换到选择工具
|
||||
2. 点击要选择的元素
|
||||
|
||||
### 选择多个元素
|
||||
|
||||
**方法一**：框选
|
||||
|
||||
拖动鼠标画一个选择框，框内的元素都会被选中。
|
||||
|
||||
**方法二**：Ctrl/Cmd + 点击
|
||||
|
||||
按住 `Ctrl/Cmd` 键，逐个点击要选择的元素。
|
||||
|
||||
### 全选
|
||||
|
||||
按 `Ctrl/Cmd + A` 选择画布上所有元素。
|
||||
|
||||
### 取消选择
|
||||
|
||||
点击画布空白处，或按 `Esc` 键。
|
||||
|
||||
## 撤销和重做
|
||||
|
||||
做错了？没关系：
|
||||
|
||||
- **撤销** - `Ctrl/Cmd + Z`
|
||||
- **重做** - `Ctrl/Cmd + Shift + Z`
|
||||
|
||||
:::tip
|
||||
撤销/重做的历史记录会保存，可以多次撤销。
|
||||
:::
|
||||
|
||||
## 复制和粘贴
|
||||
|
||||
### 复制元素
|
||||
|
||||
选中元素后：
|
||||
- `Ctrl/Cmd + C` - 复制
|
||||
- `Ctrl/Cmd + V` - 粘贴
|
||||
|
||||
### 复制到同一位置
|
||||
|
||||
- `Ctrl/Cmd + D` - 原地复制一份
|
||||
|
||||
### 拖拽复制
|
||||
|
||||
按住 `Alt` 键拖动元素，会复制一份新的。
|
||||
|
||||
## 删除元素
|
||||
|
||||
选中元素后：
|
||||
- 按 `Delete` 键
|
||||
- 或按 `Backspace` 键
|
||||
|
||||
## 快捷键汇总
|
||||
|
||||
| 快捷键 | 功能 |
|
||||
|--------|------|
|
||||
| `H` | 手形工具（移动画布） |
|
||||
| `V` | 选择工具 |
|
||||
| `空格 + 拖动` | 临时移动画布 |
|
||||
| `Ctrl/Cmd + Z` | 撤销 |
|
||||
| `Ctrl/Cmd + Shift + Z` | 重做 |
|
||||
| `Ctrl/Cmd + A` | 全选 |
|
||||
| `Ctrl/Cmd + C` | 复制 |
|
||||
| `Ctrl/Cmd + V` | 粘贴 |
|
||||
| `Ctrl/Cmd + D` | 原地复制 |
|
||||
| `Delete` | 删除 |
|
||||
| 滚轮 | 缩放 |
|
||||
| `Ctrl/Cmd + 0` | 重置视图 |
|
||||
179
docs/user-manual/content/basics/insert-content.mdx
Normal file
179
docs/user-manual/content/basics/insert-content.mdx
Normal file
@@ -0,0 +1,179 @@
|
||||
---
|
||||
title: 插入内容到画布
|
||||
category: getting-started
|
||||
order: 2
|
||||
---
|
||||
|
||||
# 插入内容到画布
|
||||
|
||||
学习如何将各种内容添加到画布中，包括图片、文字、形状等。
|
||||
|
||||
<Screenshot id="insert-tools" />
|
||||
<p class="screenshot-caption">工具栏中的插入工具</p>
|
||||
|
||||
## 插入图片
|
||||
|
||||
### 方法一：快捷键上传
|
||||
|
||||
按 `Ctrl/Cmd + U`，打开文件选择器选择图片。
|
||||
|
||||
### 方法二：工具栏按钮
|
||||
|
||||
点击工具栏的 **图片** 按钮，选择本地图片文件。
|
||||
|
||||
### 方法三：拖拽上传
|
||||
|
||||
直接将图片文件从电脑拖拽到画布上。
|
||||
|
||||
### 方法四：粘贴图片
|
||||
|
||||
复制图片后（从网页、截图工具等），在画布上按 `Ctrl/Cmd + V` 粘贴。
|
||||
|
||||
### 方法五：从素材库选择
|
||||
|
||||
<Screenshot id="insert-from-library" />
|
||||
<p class="screenshot-caption">点击素材库按钮打开素材库</p>
|
||||
|
||||
1. 打开素材库
|
||||
2. 点击想要的图片
|
||||
3. 图片自动添加到画布
|
||||
|
||||
## 插入 AI 生成的内容
|
||||
|
||||
### 图片生成后自动插入
|
||||
|
||||
使用 AI 生成图片后，生成的图片会自动插入到画布上：
|
||||
|
||||
1. 如果之前有选中的元素 → 插入到选中元素下方
|
||||
2. 如果没有选中元素 → 插入到画布中间或最下方
|
||||
|
||||
### 从任务队列插入
|
||||
|
||||
1. 打开任务队列面板
|
||||
2. 找到已完成的任务
|
||||
3. 点击 **插入到画布** 按钮
|
||||
|
||||
### 从素材库插入
|
||||
|
||||
所有 AI 生成的图片都会保存到素材库，可以随时插入。
|
||||
|
||||
## 插入文本
|
||||
|
||||
### 方法一：文本工具
|
||||
|
||||
1. 按 `T` 键或点击文本工具
|
||||
2. 在画布上点击
|
||||
3. 开始输入文字
|
||||
|
||||
### 方法二：直接粘贴
|
||||
|
||||
从其他地方复制文字，在画布上按 `Ctrl/Cmd + V`，文字会自动创建文本框。
|
||||
|
||||
### 在形状中添加文字
|
||||
|
||||
双击任何形状，即可在其中添加文字。
|
||||
|
||||
## 插入形状
|
||||
|
||||
### 使用形状工具
|
||||
|
||||
1. 点击工具栏的 **形状** 按钮
|
||||
2. 选择形状类型（矩形、圆形等）
|
||||
3. 在画布上点击或拖拽创建
|
||||
|
||||
### 快捷键创建
|
||||
|
||||
| 快捷键 | 形状 |
|
||||
|--------|------|
|
||||
| `R` | 矩形 |
|
||||
| `O` | 椭圆 |
|
||||
| `A` | 箭头 |
|
||||
|
||||
## 插入思维导图
|
||||
|
||||
### 方法一：快捷键
|
||||
|
||||
按 `M` 键，然后在画布上点击创建。
|
||||
|
||||
### 方法二：AI 生成
|
||||
|
||||
在输入框描述你的主题，AI 会自动生成思维导图结构。
|
||||
|
||||
### 方法三：Markdown 转换
|
||||
|
||||
使用工具箱中的 **Markdown 转思维导图** 工具。
|
||||
|
||||
## 插入流程图
|
||||
|
||||
### 方法一：AI 生成
|
||||
|
||||
在输入框描述流程，AI 自动生成流程图。
|
||||
|
||||
### 方法二：Mermaid 转换
|
||||
|
||||
使用工具箱中的 **Mermaid 转流程图** 工具。
|
||||
|
||||
### 方法三：手动绘制
|
||||
|
||||
使用形状工具和箭头工具手动绘制。
|
||||
|
||||
## 插入位置
|
||||
|
||||
新插入的内容会根据以下规则确定位置：
|
||||
|
||||
1. **有选中元素时** - 插入到选中元素附近（下方或右侧）
|
||||
2. **无选中元素时** - 插入到画布可视区域中心
|
||||
3. **画布有内容时** - 插入到现有内容的下方
|
||||
|
||||
:::tip
|
||||
如果想精确控制插入位置，先用选择工具点击目标位置附近的元素。
|
||||
:::
|
||||
|
||||
## 调整插入后的内容
|
||||
|
||||
内容插入后，可以：
|
||||
|
||||
### 移动
|
||||
|
||||
选中后直接拖动，或用方向键微调。
|
||||
|
||||
### 调整大小
|
||||
|
||||
拖动选中框的角点或边点。
|
||||
|
||||
### 旋转
|
||||
|
||||
拖动选中框上方的旋转手柄。
|
||||
|
||||
### 删除
|
||||
|
||||
选中后按 `Delete` 或 `Backspace` 键。
|
||||
|
||||
## 批量操作
|
||||
|
||||
### 选择多个元素
|
||||
|
||||
- **框选** - 拖动鼠标框选多个元素
|
||||
- **Ctrl/Cmd + 点击** - 追加选择
|
||||
|
||||
### 批量移动
|
||||
|
||||
选中多个元素后一起拖动。
|
||||
|
||||
### 对齐
|
||||
|
||||
选中多个元素后，使用对齐功能整齐排列。
|
||||
|
||||
## 小贴士
|
||||
|
||||
:::tip
|
||||
使用 `Ctrl/Cmd + V` 粘贴是最快的插入方式，支持图片和文字。
|
||||
:::
|
||||
|
||||
:::tip
|
||||
AI 生成的内容会自动插入到合适的位置，不需要手动操作。
|
||||
:::
|
||||
|
||||
:::note
|
||||
支持的图片格式：PNG、JPG、GIF、WebP、SVG
|
||||
:::
|
||||
Reference in New Issue
Block a user