IDE主要模块概述
IDE是集成开发环境（Integrated Development Environment ）的英文缩写，LayaAir3-IDE是指LayaAir3引擎的集成开发环境。
本章节面向新手开发者，对 IDE 的主要功能做初步介绍。下文截图基于 LayaAirIDE 3.4。
1、IDE帐号登录
Section titled “1、IDE帐号登录”LayaAir3.x 在 IDE 内集成了资源商店、社区、IDE 核心配置云存储等高度依赖网络的功能，因此必须登录帐号后才可使用 IDE。
帐号登录方式有三种：微信扫码登录、帐号登录、手机验证码登录。登录界面如图1-1、图1-2、图1-3所示。
（图1-1）
（图1-2）
（图1-3）
2、IDE首页
Section titled “2、IDE首页”登录后进入 IDE 首页，主要用于项目管理：查看与搜索项目列表、导入项目、创建项目入口，以及进入设置。侧边栏下方还会展示 LayaIdea、引擎社区等入口。项目列表中可查看每个项目的引擎版本、创建日期与最近编辑时间。
2.1 项目列表
Section titled “2.1 项目列表”登录后的默认模块是项目列表，展示已导入或创建的项目。点击某个项目即可打开，进入编辑器模式。效果如图2-1所示。
（图2-1）
默认项目排列顺序按编辑时间由近到远。列表展示项目名称、本地路径、引擎版本、创建日期与编辑时间。项目较多时，可在顶部搜索框输入关键字（如项目名称）进行筛选。效果如图2-2所示。
（图2-2）
在项目列表每一行的右侧有「⋮」菜单按钮，可进行项目相关操作（例如设置项目信息、打开项目目录、从列表中移除等）。项目列表与菜单入口如图2-3所示。
（图2-3）
2.2 导入项目
Section titled “2.2 导入项目”点击「导入项目」，可将其它电脑中创建的 3.x 项目，或已从列表移除的项目，重新导入到项目列表中。操作如图2-4所示。
（图2-4）
3、创建项目
Section titled “3、创建项目”若要创建新项目，可在首页点击「创建项目」，如图3-1所示。
（图3-1）
3.1 选择模板
Section titled “3.1 选择模板”创建新项目界面中，左侧为模板分类，常见包括：核心模板、示例模板、学习模板，以及已购源码、本地模板等。中间为模板列表(如出现下载图标，需先下载后才可以导入使用)，右侧为当前模板说明与项目设置，如图3-2所示。
（图3-2）
- 核心模板：2D 与 3D 空项目模板（以及部分专用空项目，如 LayaIdea AIGC 空项目），适合已入门的开发者创建干净的工程环境。
- 示例模板：功能相对简单、独立的模块示例，便于针对性理解某一功能。
- 学习模板：功能相对完整、丰富，适合作为入门学习与项目借鉴。
3.2 项目名称
Section titled “3.2 项目名称”在右侧「项目名称」中填写新项目名称，如图3-3所示。
（图3-3）
3.3 项目位置
Section titled “3.3 项目位置”在「项目位置」中选择本地目录，并可勾选「在此位置创建子目录」，如图3-4所示。
（图3-4）
3.4 完成创建
Section titled “3.4 完成创建”完成以上选项后，点击「创建项目」，如图3-5所示，即可完成项目创建并进入 IDE 编辑界面。
（图3-5）
4、帐号设置
Section titled “4、帐号设置”点击首页左上角头像/帐号区域，可进行帐号相关操作（如退出登录等）。帐号区域如图4-1所示。
（图4-1）
5、编辑器初始界面
Section titled “5、编辑器初始界面”打开项目后进入编辑器。初始界面主要包括：层级管理面板、项目资源面板、UI 小部件面板、场景视窗、预览运行、动画状态机、项目设置、构建发布、控制台、时间轴动画面板、属性设置面板等。顶部菜单中还包含 AI 服务、面板等入口。
5.1 层级管理面板
Section titled “5.1 层级管理面板”层级管理面板主要用于管理场景中的 2D 节点与 3D 节点。若为纯 2D 项目，也可仅包含 2D 节点。面板如图5-1所示。
（图5-1）
层级关系表示父子节点关系，子节点会受父节点影响；例如父节点改变位置或旋转角度，子节点也会同步变化。
3D 节点的根节点是 Scene3D，2D 节点的根节点是 Scene2D。2D 与 3D 节点之间不可混合为父子层级，但可在同一场景中并存。
5.2 项目资源面板
Section titled “5.2 项目资源面板”项目资源面板包含项目中的资源与代码等内容。资源通常位于 assets 目录，代码通常位于 src 目录。面板如图5-2所示。
（图5-2）
5.3 UI布局小部件面板
Section titled “5.3 UI布局小部件面板”小部件面板用于向场景中拖入节点与组件，常见分类包括 2D（如 Sprite、Area2D、Animation、Text 等）以及 UI组件（如 GWidget、GImage、GButton 等）。面板如图5-3所示。
（图5-3）
5.4 场景视窗
Section titled “5.4 场景视窗”场景视窗用于编辑 2D 与 3D 场景，是可视化编辑虚拟世界的窗口。面板如图5-4所示。
（图5-4）
5.5 预览运行
Section titled “5.5 预览运行”「预览运行」标签页用于查看当前场景/项目的运行效果。面板如图5-5所示。
（图5-5）
5.6 动画状态机面板
Section titled “5.6 动画状态机面板”动画状态机用于控制动画逻辑，面板包括动画图层与状态机相关功能。打开「动画状态机」标签页即可进入，如图5-6所示。
（图5-6）
5.7 项目设置面板
Section titled “5.7 项目设置面板”项目设置面板包含运行配置（分辨率、2D/3D 相关选项等）、引擎模块、UI 系统、物理系统、WebGPU、启动页、脚本编译、预览服务等。面板如图5-7所示。
（图5-7）
5.8 控制台面板
Section titled “5.8 控制台面板”控制台面板用于打印日志信息，支持复制、清空日志，并可按信息/警告/错误筛选。面板如图5-8所示。
（图5-8）
5.9 时间轴动画面板
Section titled “5.9 时间轴动画面板”时间轴动画面板用于 2D 与 3D 动画编辑。选中节点后，可按提示创建状态机动画或片段动画等，如图5-9所示。
（图5-9）
6、属性设置面板
Section titled “6、属性设置面板”属性面板用于设置对象或文件属性，例如层级中的 2D/3D 对象属性、资源文件属性与预览，以及组件的添加。
对象属性设置如图6-1所示。
（图6-1）
资源属性设置如图6-2所示。
（图6-2）
代码预览如图6-3所示。
（图6-3）
添加组件（自定义属性）如图6-4所示。
（图6-4）
点击「增加组件」后，可按分类（渲染、动画、灯光、物理、多媒体、导航寻路、自定义组件脚本等）选择要添加的组件。
7、其它编辑面板
Section titled “7、其它编辑面板”除初始界面所显示的面板外，还可通过预制体文件打开预制体面板标签，通过蓝图文件打开蓝图编辑面板。
7.1 预制体面板标签
Section titled “7.1 预制体面板标签”场景文件打开的标签共用同一套界面。点击预制体文件后，会形成独立的预制体面板标签，效果如图7-1所示。
（图7-1）
预制体面板标签没有独有面板，主要差异是：层级管理面板的根节点与场景文件的根节点不同。
7.2 蓝图编辑面板
Section titled “7.2 蓝图编辑面板”蓝图编辑面板可在不写代码的情况下快捷编写自定义材质，降低使用门槛。
打开 Shader 蓝图文件或 Shader 蓝图函数文件，即可进入蓝图编辑面板，如图7-2所示。
（图7-2）
8、项目预览
Section titled “8、项目预览”项目预览用于查看项目在不同环境中的运行效果。
顶部工具栏提供多种预览/运行入口（如 IDE 内运行、浏览器/Web、移动端设备预览、桌面端预览等，具体图标以当前版本为准），如图8-1所示。
（图8-1）
也可以切换到「预览运行」标签页查看运行画面，如图8-2所示。
（图8-2）
8.1 屏幕显示设置
Section titled “8.1 屏幕显示设置”预览运行后，预览窗口顶部左侧为屏幕相关设置，包括：屏幕分辨率、横竖屏、屏幕缩放、重置屏幕缩放，如图8-3所示。
（图8-3）
8.2 调试设置
Section titled “8.2 调试设置”预览运行后，预览窗口顶部右侧为调试相关设置，包括：声音开关、统计信息显示开关、开发者工具开关、暂停与继续、单步下一帧、运行重启，如图8-4所示。
（图8-4）
9、项目发布
Section titled “9、项目发布”项目发布是将开发版本发布为网页版本、小游戏版本、Native APP 版本等。
在编辑器中打开「构建发布」标签页，即可配置并执行发布。左侧可选择 Web、Android、iOS、Windows、Linux、鸿蒙 NEXT，以及抖音/微信/支付宝/淘宝/华为/OPPO/vivo 等多个小游戏与其它平台，如图9-1所示。
（图9-1）