使用指南
Cocos 组件 / UI / Canvas节点
Cocos 组件 / UI / Canvas 节点手册，包含 4 个节点的用途、引脚、使用场景和注意事项。
16
学习目标
访问 Cocos Creator 组件的属性、方法和事件，把引擎能力转成可视化工作流。
覆盖范围
- 节点数量：4
- 分类路径：Cocos 组件 / UI / Canvas
典型使用场景
- 控制 UI、音频、动画、物理、灯光、粒子和渲染组件
- 读取组件状态后驱动游戏逻辑
- 批量设置组件属性完成游戏运行时效果
通用注意事项
- 目标组件引脚必须连接正确的组件实例。
- 设置类节点通常需要接入执行流，才会真正修改游戏运行时状态。
- 部分组件能力受 Cocos Creator 版本限制，页面会标出版本字段。
节点索引
| 节点 | 节点 ID | 输入/输出 | 执行方式 |
|---|---|---|---|
| 获取对齐屏幕 | canvasGetAlignCanvasWithScreen | 1 / 1 | 立即继续 |
| 获取相机组件 | canvasGetCameraComponent | 1 / 1 | 立即继续 |
| 设置对齐屏幕 | canvasSetAlignCanvasWithScreen | 3 / 2 | 立即继续 |
| 设置相机组件 | canvasSetCameraComponent | 3 / 2 | 立即继续 |
获取对齐屏幕
获取对齐屏幕状态：返回 Canvas 是否自动适配屏幕尺寸。 值为 true 时 UI 在不同分辨率的屏幕上都自动撑满，false 时保持固定尺寸。 典型用途：手机横竖屏切换时保持 UI 适配。
节点信息
| 字段 | 值 |
|---|---|
| 节点 ID | canvasGetAlignCanvasWithScreen |
| 分类 | Cocos 组件 |
| 二级分类 | UI |
| 分组 | Canvas |
| 是否需要等待结果 | 否 |
| 是否需要先选择目标 | 否 |
输入引脚
| 引脚 ID | 名称 | 连接方式 | 值类型 | 用途 | 默认或选择 | 连接要求 |
|---|---|---|---|---|---|---|
canvas | 画布 | 数据 | cc.Component / Canvas | 目标画布 要获取对齐屏幕状态的 Canvas 组件 | - | 必填 |
输出引脚
| 引脚 ID | 名称 | 连接方式 | 值类型 | 用途 | 默认或选择 | 连接要求 |
|---|---|---|---|---|---|---|
alignCanvasWithScreen | 对齐屏幕 | 数据 | boolean | 对齐屏幕状态 true=自动适配屏幕，false=固定尺寸 | - | 可选 |
使用场景
- 控制 UI、音频、动画、物理、灯光、粒子和渲染组件
- 读取组件状态后驱动游戏逻辑
- 批量设置组件属性完成游戏运行时效果
注意事项
- 适合的工作流类型：component、library、method、function、class。
- 目标组件引脚必须连接正确的组件实例。
- 设置类节点通常需要接入执行流，才会真正修改游戏运行时状态。
获取相机组件
获取渲染相机：返回 Canvas 用于渲染 UI 的 Camera 组件。 每个 Canvas 需要一个 Camera 才能正常显示 UI 界面。 典型用途：切换 UI 相机实现分屏渲染效果。
节点信息
| 字段 | 值 |
|---|---|
| 节点 ID | canvasGetCameraComponent |
| 分类 | Cocos 组件 |
| 二级分类 | UI |
| 分组 | Canvas |
| 是否需要等待结果 | 否 |
| 是否需要先选择目标 | 否 |
输入引脚
| 引脚 ID | 名称 | 连接方式 | 值类型 | 用途 | 默认或选择 | 连接要求 |
|---|---|---|---|---|---|---|
canvas | 画布 | 数据 | cc.Component / Canvas | 目标画布 要获取相机组件的 Canvas 组件 | - | 必填 |
输出引脚
| 引脚 ID | 名称 | 连接方式 | 值类型 | 用途 | 默认或选择 | 连接要求 |
|---|---|---|---|---|---|---|
camera | 相机 | 数据 | cc.Component / Camera | 相机组件 Canvas 关联的渲染 Camera（可能为 null） | - | 可选 |
使用场景
- 控制 UI、音频、动画、物理、灯光、粒子和渲染组件
- 读取组件状态后驱动游戏逻辑
- 批量设置组件属性完成游戏运行时效果
注意事项
- 适合的工作流类型：component、library、method、function、class。
- 目标组件引脚必须连接正确的组件实例。
- 设置类节点通常需要接入执行流，才会真正修改游戏运行时状态。
设置对齐屏幕
设置对齐屏幕状态：控制 Canvas 是否自动适配屏幕尺寸。 设为 true 让 UI 自动适配不同分辨率，false 则保持固定尺寸。
节点信息
| 字段 | 值 |
|---|---|
| 节点 ID | canvasSetAlignCanvasWithScreen |
| 分类 | Cocos 组件 |
| 二级分类 | UI |
| 分组 | Canvas |
| 是否需要等待结果 | 否 |
| 是否需要先选择目标 | 否 |
输入引脚
| 引脚 ID | 名称 | 连接方式 | 值类型 | 用途 | 默认或选择 | 连接要求 |
|---|---|---|---|---|---|---|
exe | - | 执行流 | 执行流 | 执行输入 | - | 可选 |
canvas | 画布 | 数据 | cc.Component / Canvas | 目标画布 要设置对齐屏幕状态的 Canvas 组件 | - | 必填 |
alignCanvasWithScreen | 对齐屏幕 | 数据 | boolean | 对齐屏幕 是否与屏幕对齐 | 开关 默认值：true | 必填 |
输出引脚
| 引脚 ID | 名称 | 连接方式 | 值类型 | 用途 | 默认或选择 | 连接要求 |
|---|---|---|---|---|---|---|
out | - | 执行流 | 执行流 | 执行完成 | - | 可选 |
canvas | 画布 | 数据 | cc.Component / Canvas | 目标画布 要操作的 Canvas 组件 | - | 可选 |
使用场景
- 控制 UI、音频、动画、物理、灯光、粒子和渲染组件
- 读取组件状态后驱动游戏逻辑
- 批量设置组件属性完成游戏运行时效果
注意事项
- 适合的工作流类型：component、library、method、function、class。
- 目标组件引脚必须连接正确的组件实例。
- 设置类节点通常需要接入执行流，才会真正修改游戏运行时状态。
设置相机组件
设置渲染相机：设置 Canvas 用于渲染 UI 的 Camera 组件。 传入 null 可清空相机引用，Canvas 将使用场景默认相机渲染 UI。
节点信息
| 字段 | 值 |
|---|---|
| 节点 ID | canvasSetCameraComponent |
| 分类 | Cocos 组件 |
| 二级分类 | UI |
| 分组 | Canvas |
| 是否需要等待结果 | 否 |
| 是否需要先选择目标 | 否 |
输入引脚
| 引脚 ID | 名称 | 连接方式 | 值类型 | 用途 | 默认或选择 | 连接要求 |
|---|---|---|---|---|---|---|
exe | - | 执行流 | 执行流 | 执行输入 | - | 可选 |
canvas | 画布 | 数据 | cc.Component / Canvas | 目标画布 要设置相机组件的 Canvas 组件 | - | 必填 |
camera | 相机 | 数据 | cc.Component / Camera | 相机组件 要关联的 Camera 组件（可选，传入 null 清空） | - | 可选 |
输出引脚
| 引脚 ID | 名称 | 连接方式 | 值类型 | 用途 | 默认或选择 | 连接要求 |
|---|---|---|---|---|---|---|
out | - | 执行流 | 执行流 | 执行完成 | - | 可选 |
canvas | 画布 | 数据 | cc.Component / Canvas | 目标画布 要操作的 Canvas 组件 | - | 可选 |
使用场景
- 控制 UI、音频、动画、物理、灯光、粒子和渲染组件
- 读取组件状态后驱动游戏逻辑
- 批量设置组件属性完成游戏运行时效果
注意事项
- 适合的工作流类型：component、library、method、function、class。
- 目标组件引脚必须连接正确的组件实例。
- 设置类节点通常需要接入执行流，才会真正修改游戏运行时状态。