|
《传奇引擎脚本开发——996可视化编辑器实战》教案
一、课程基本信息
- 课程名称:传奇引擎脚本开发——996可视化编辑器实战
- 授课对象:已掌握基础脚本语法(变量、条件判断)的传奇引擎开发者(初级)
- 课时:90分钟
- 教学目标:
- 熟悉996可视化编辑器的界面与核心功能(组件类型、编辑工具);
- 掌握可视化编辑器的快捷操作(旋转、尺寸调整、九宫格、对齐功能);
- 理解复选框组件的参数与使用逻辑(参数配置、状态检测);
- 能通过可视化编辑器快速调整界面组件,规避安全风险。
二、教学重难点
- 重点:
- 可视化编辑器的核心功能(组件类型、编辑工具);
- 九宫格调整、对齐功能的快捷操作;
- 复选框的参数配置与状态检测。
- 难点:
- 九宫格固定边框像素解决图片失真问题;
- 对齐功能的多组件协同操作;
- 复选框的安全性设置(防止变量被刷)。
三、教学准备
- 软件:传奇引擎编辑器(M2引擎)、996可视化编辑器(内置工具);
- 示例文件:
- 基础界面脚本模板(含文本、图片、按钮);
- 复选框功能演示脚本(含参数配置);
- 教学PPT:可视化编辑器界面图解、功能操作示意图、复选框参数说明。
四、教学过程
1. 导入(10分钟)
- 回顾旧知:提问上节课内容(检测指令的应用场景),确认学生对脚本逻辑与界面关联的理解。
- 引入新课:通过实际需求引出可视化编辑器的重要性:
- 场景1:修改游戏界面标题文字(无需手动编写代码,拖拽文本组件即可);
- 场景2:调整按钮位置(垂直/水平分布功能快速对齐);
- 场景3:优化图片显示(九宫格固定边框解决拉伸失真);
- 场景4:添加复选框功能(勾选状态检测与数据提交)。
2. 新授(50分钟)
2.1 可视化编辑器界面与核心组件(10分钟)
- 界面介绍:
- 启动方式:进入工具服后按
Ctrl+F10 打开;
- 默认元素:背景图、关闭按钮、容器(用于放置组件);
- 组件类型:文本、副文本、图片(支持切换)、基础容器、列表容器、输入框、复选框、序列帧、EQ IP show(展示穿戴装备)、item box/show(物品框)等。
- 组件功能示例:
- 图片:可替换为任意图片(如勾、箭头),支持旋转(调整角度)、尺寸修改(WASD快捷调整);
- item show:直接展示背包或身上物品(需关联物品ID);
- EQ IP show:展示当前穿戴装备(无需手动编写物品展示逻辑);
- 复选框:支持勾选状态切换(需配置参数实现数据提交)。
2.2 可视化编辑器的快捷操作(20分钟)
- 旋转与尺寸调整:
- 旋转:选中组件后,通过旋转角度参数(如90°、180°)调整方向(示例:箭头从右→下→左);
- 尺寸:直接修改尺寸数值(如30×30),或按WASD快捷拉伸(W上移、S下移、D右移);
- 注意:拉伸可能导致图片失真(边框像素被拉长),需通过九宫格功能固定边框像素(示例:将边框固定为11像素,避免拉伸后模糊)。
- 对齐功能:
- 垂直分布:选中多个组件(如6个文本),点击“垂直分布”自动等距排列;
- 水平分布:选中多个按钮,点击“水平分布”使其在同一水平线上;
- 顶部/左侧对齐:调整组件位置,保持同一Y轴或X轴对齐(示例:5个按钮顶部对齐后,再水平分布)。
2.3 复选框组件的使用(20分钟)
- 参数配置(通过帮助文档查询
复选框 新脚本详细说明 ):
checkbox ID :复选框唯一ID(用于提交数据,需与变量绑定);
NMNIMG :未勾选时的图片路径;
PNG :勾选时的图片路径;
默认选择状态 :0(未勾选)或1(已勾选);
自动提交时间 :一般无需设置(默认手动提交)。
- 状态检测与数据提交:
- 安全性优化:
- 防止变量被刷:在M2引擎设置中勾选“仅允许返回常量”(路径:选项→客户端控制→传统客户端控制→游戏命令功能设置);
- 替代方案:用按钮+图片切换实现类似功能(更安全,避免直接暴露变量)。
3. 巩固练习(15分钟)
- 任务1:使用可视化编辑器调整基础界面:
- 添加文本“欢迎来到996引擎”,调整字体大小(WASD拉伸);
- 添加图片(箭头),旋转90°并固定边框(九宫格设置边框像素10);
- 添加按钮“领取奖励”,水平分布3个按钮并顶部对齐。
- 任务2:配置复选框功能:
- 添加复选框组件,设置
checkbox ID=N1 ,未勾选图片为6,勾选图片为7;
- 编写脚本检测
N1 状态(打印“勾选”或“未勾选”);
- 测试勾选/未勾选时变量值变化,验证数据提交逻辑。
4. 总结(5分钟)
- 核心功能回顾:
- 可视化编辑器的组件类型(文本、图片、复选框等);
- 快捷操作(旋转、尺寸调整、九宫格、对齐功能);
- 复选框的参数配置与安全检测。
- 注意事项:
- 图片拉伸时优先使用九宫格固定边框,避免失真;
- 复选框需结合安全设置(仅允许返回常量),防止变量被刷;
- 界面调整后需测试多分辨率适配(如手机端与PC端显示差异)。
五、作业布置
- 基础题:使用可视化编辑器创建一个包含文本、图片、按钮的界面,调整图片旋转角度并固定边框;
- 进阶题:配置复选框组件,实现“勾选后显示提示信息”功能(需检测
N1 状态并发送消息);
- 拓展题:对比可视化编辑器与手动编写界面的优缺点(如效率、可维护性)。
六、教学反思(课后填写)
- 学生对九宫格调整边框的操作是否熟练?是否需要补充具体步骤演示?
- 复选框的安全性设置是否理解?学生能否独立完成引擎参数配置?
- 对齐功能的快捷操作是否掌握?需加强多组件协同调整的实战演练。
|
|