多层组合装饰(界面装饰-菜单界面)
相关插件(菜单)
相关插件:
◆Drill_MenuBackground 主菜单 - 多层菜单背景
◆Drill_MenuParticle 主菜单 - 多层菜单粒子
◆Drill_MenuCircle 主菜单 - 多层菜单魔法圈
◆Drill_MenuGif 主菜单 - 多层菜单GIF
◆Drill_MenuTiledGif 主菜单 - 多层菜单平铺GIF
◆Drill_MenuVideo 主菜单 - 多层菜单视频
特殊插件:
◆Drill_MenuBackButton 主菜单 - 返回按钮
◆Drill_MenuDecorationPluginCommandList 主菜单 - 多层装饰的指令容器
上述插件可以配置多层贴图,并装饰一个具体的菜单界面。
菜单界面的装饰如下图。红色为菜单魔法圈,紫色为菜单粒子,黄色为菜单背景(扫描线背景和箭头背景)。背后的网格也是菜单背景。![]() |
相关插件(标题)
相关插件:
◆Drill_TitleBackground 标题 - 多层标题背景
◆Drill_TitleParticle 标题 - 多层标题粒子
◆Drill_TitleCircle 标题 - 多层标题魔法圈
◆Drill_TitleGif 标题 - 多层标题GIF
◆Drill_TitleTiledGif 标题 - 多层标题平铺GIF
◆Drill_TitleVideo 标题 - 多层标题视频
上述插件可以配置多层贴图,并装饰一个具体的标题界面。
标题界面的装饰如下图。包含标题粒子、标题背景、标题魔法圈,以及圆圈形状的标题GIF。网址按钮是另一个单独的插件,标题GIF只是装饰按钮用。![]() |
示例位置(菜单)
菜单装饰插件的示例位置,在 主菜单管理层 ,如下图。

示例位置(标题)
标题装饰插件的示例位置,在 标题管理层 ,如下图。

名词索引
以下你可以按住ctrl键点击下面的词,可以直接定位到想了解的名词:
| 界面设计 | 菜单/标题层级 底图说明 预加载静态装饰设计变换动画设计 |
| 特殊属性 | 延迟指令与周期指令 多条指令打包用法菜单的启用/禁用 标题的启用/禁用静态遮罩 数据更新与旧存档(标题界面) |
| 特殊插件 | 返回按钮 指令容器 |
界面设计(菜单/标题)
结构说明
菜单界面的结构如下:
一个没有任何功能部件的空菜单界面,也可以被上述的菜单插件装饰:
菜单/标题层级
1)层级介绍
菜单界面/标题界面分为两层,菜单前面层 和 菜单后面层。

标题只是菜单的一个分支,属于菜单界面。
底图:游戏默认的底图,就是进入菜单前的地图。你也可以设置层全黑。
菜单功能部件:菜单的窗口等所有内容信息的层,如果你使用的菜单插件没有修改底图,那么菜单插件所有的内容都属于这个层,不会越界。(比如全自定义主菜单自带的一个魔法圈,是属于菜单功能部件的。)
图片层级: 如果你配置了许多背景、魔法圈在 菜单前面层,图片层级就用来给这些背景、魔法圈分配显示的先后顺序。
(图片层级也称”堆叠级”,可以去看”0.基本定义 > 界面.docx”的层级与堆叠级章节)
菜单界面中,还存在一个特殊的层级:天窗层。可以去了解下装饰说明文档:“17.主菜单 > 多层组合装饰(界面装饰-天窗层).docx” |
2)底图说明
底图是菜单层级的底层功能,用于显示 地图界面 的模糊图像。
这个图像的作用是让你感觉自己像在地图界面。
而实际上你已经在菜单界面,你无法在菜单界面操作地图界面的任何内容和指令。
(示例 主菜单管理层 的空面板介绍)

如果你不想看到底图,你可以把它涂黑,通过插件修改:
◆Drill_MenuBackground 主菜单 - 多层菜单背景

另外,装饰贴图基于底图才能装饰。
有些菜单插件拥有 自定义菜单自身的背景 功能,他们或多或少地会修改对底图的设置,这时候装饰插件就可能不支持装饰这个菜单面板了。
静态装饰设计
1)插件参数配置
菜单的装饰插件,打开参数配置即可配置。
配置时,需要绑定所属菜单。
如果是自定义菜单,需要填写关键字。
详细关键字的绑定方法,去看看:17.主菜单 > 菜单关键字.docx 。

背景1、2、3之间相互独立,只在图片层级相同时,才会影响装饰的先后顺序,
但你可以直接修改 图片层级 来控制先后顺序。
插件参数可以直接复制,如果你的配置挤在一起要分开,
可以复制,然后粘贴到其他的地方。

| 注意,即使关键字正确,装饰插件也有可能不生效,与目标菜单面板本身设置有关。一些自定义的菜单界面插件,会对底图进行改写,换成自己控制的新底图,这样装饰插件就失效了。 |
2)标签说明
由于你需要配置大量背景内容到相应的插件中,你不能一次性看见全部内容,这里用标签来进行区分。标签不作用在插件中,只是在配置的时候方便查看。

如果标签名长了,你可以拖拽下面两个竖线,把值拉开查看。

变换动画设计
菜单界面无法执行事件指令,
因此只能依靠 菜单的延迟指令与周期指令 来制作简单的动画。
并且,菜单面板随时能进入,需要考虑 容器初始化 功能,
会用到插件:【主菜单 - 多层装饰的指令容器】 。
预加载
菜单界面、标题界面的装饰插件可以设置预加载。
预加载常用于游戏中多次、反复使用的贴图。
单个资源贴图,配置“是否预加载”。
多个资源贴图,配置“预加载类型”。


注意,并不是所有装饰贴图都要开启预加载。
因为预加载会一直占着内存,直到游戏关闭才释放内存。
具体去看看: “1.系统 > 关于预加载.docx”。
特殊属性
菜单界面中,装饰插件有一些特殊的属性,其他界面不一定有。(通用的属性在文档“17.主菜单 > 多层组合装饰(界面装饰).docx”中已有介绍) |
菜单的延迟指令与周期指令
1)关系表
修改单属性、延迟指令、周期指令,在不同界面的关系如下表。
| 插件 | 修改单属性 | 延迟指令 | 周期指令 |
| 地图插件 | 支持(常用) | 支持 | 支持 |
| 战斗插件 | 支持 | 支持(常用)(最好放公共事件) | 支持 |
| 菜单插件 | 不支持 | 支持(最好放容器初始化) | 支持(最好放容器初始化) |
| 标题插件 | 不支持 | 不支持 | 不支持 |
| 天窗层插件 | 支持(常用) | 支持 | 支持 |
2)使用细节(菜单)
》菜单界面的指令不支持事件指令,不能实时修改。
》常规用法中,菜单插件和标题插件可以实现:摆上静态装饰贴图;配置简单的自变化效果;通过显示隐藏指令来设计多种样式等。
》除了常规用法,菜单插件还支持 延迟指令和周期指令。
》战斗界面与菜单界面相似,需要在进入面板前用延迟指令预设好,才能做动画。
| 标题插件由于底层特殊性(不依赖于任何一个存档),所以很难提供 延迟指令和周期指令 的功能。 |
3)使用细节(指令)
| 修改单属性、延迟指令、周期指令 的变换时长参数,设置“时间[1]”和“时间[0]”没有区别,因为变换切换至少要1帧的时间。因此设计动画时,要考虑加等待指令;设计周期时长时,要把这1帧也考虑进去。 |
| 修改单属性 对应 还原所有单属性;切换混合模式 对应 还原混合模式;切换图片层级 对应 还原混合模式。没有全部还原的指令,你要根据设计的动画情况来加 还原 指令,不要漏了。 |
4)多条指令打包用法
战斗界面与菜单界面相似,需要在进入面板前用延迟指令预设好,才能做动画。
而这些指令非常多,可以放在 公共事件或指令容器 中再执行。

只不过,菜单界面没有 实时修改 功能,进入菜单后,什么都不能做。
菜单界面很少用公共事件,常用指令容器,见章节:【主菜单 - 多层装饰的指令容器】。
指令容器的灵活性非常高,可以制作复杂动画,该文档就不赘述了。详细去看看文档:“17.主菜单 > 多层组合装饰插件的指令容器.docx”。 |
菜单的启用/禁用
菜单的 启用/禁用 和 显示/隐藏 是两个不同开关,
只要其中一个为禁用或隐藏,那么贴图就不会显示。


显示/隐藏 的设置,只能通过 延迟指令/周期指令 控制。

注意,由于显示控制的开关比较多,容易出现问题:红色背景网格不显示 。
标题的启用/禁用
常规来说,标题界面也要和菜单一样,区分 启用/禁用 和 显示/隐藏。
但标题插件由于底层特殊性(不依赖于任何一个存档),
很难提供 延迟指令和周期指令 的功能,
所以标题界面只有 显示/隐藏 的功能。

静态遮罩
菜单界面和标题界面 能够配置静态遮罩。
静态遮罩通过配置单张黑白图片设置,能够使得图片具有一定的相减效果:
(白色为显示部分,黑色为隐藏部分,灰色为对应透明度的半透明状态)


背景和遮罩组合后,可以变成切割后的背景,并且背景移动时,遮罩不会发生变化。
具体可以去主菜单管理层看看 空面板 的示例。
数据更新与旧存档(标题界面)
标题界面的相关装饰配置,可以自定义存储到指定的全局文件中。
如下图,配置的文件路径,对应到全局存储的文件id。


具体去看看“21.管理器 > 关于全局存储.docx”。
也可以去了解一下“21.管理器 > 数据更新与旧存档.docx”。
| 注意,这里提及的是 插件配置与旧存档 的关系。如果你直接更新了插件,旧存档赶紧删了。更新插件相当于数据底层变动,而数据底层变动对旧存档影响是无法预估无法控制的。 |
特殊插件
【主菜单 - 返回按钮】
返回按钮是只属于菜单插件的特殊功能插件。
◆Drill_MenuBackButton 主菜单 - 返回按钮
1)GIF贴图属性
按钮可以分成:GIF贴图 + 按钮属性 + 鼠标功能 。
其中GIF贴图具备 3d效果、自变化效果、修改单属性、延迟指令、周期指令 等功能。

2)按钮属性
返回按钮分为:激活/封印、高亮/按下。(你可以通过插件指令 激活/封印 返回按钮 )
其状态可以分为:普通、高亮、按下。



普通状态可以是一张图,也可以是多张图组合成的gif。
高亮与按下状态则是一张配置图片,能设置“贴图叠加”、“贴图切换”设置。

相似按钮的功能,可以看看文档:”11.地图UI > 关于地图按钮集.docx”。 |
3)按钮与菜单
所有菜单界面默认都会在固定位置显示返回按钮,
如果你不想要返回按钮,可以单独添加一个按钮配置到面板,并设置不显示。

你也可以将按钮设置到其它的位置。

【主菜单 - 多层装饰的指令容器】
菜单的延迟指令、周期指令可以放指令容器中,来自插件:
◆Drill_MenuDecorationPluginCommandList 主菜单 - 多层装饰的指令容器
1)指令容器
指令容器可存放 菜单装饰的插件指令,并支持多行编辑,每行代表一条插件指令。
常用于快速存放、修改大量插件指令。

游戏中调用下面的插件指令即可执行指令容器。

指令容器的灵活性非常高,可以制作复杂动画,该文档就不赘述了。详细去看看文档:“17.主菜单 > 多层组合装饰插件的指令容器.docx”。 |
2)容器初始化
容器初始化功能会在游戏进入的一瞬间执行,配置如下图。

该功能用于在 标题界面 的面板,(比如信息面板B、画廊等)
面板只能通过这个方式,添加自定义的 延迟指令和周期指令 来做预设的动画。
从零开始设计(DIY)
设计一个菜单面板的背景装饰
1. 设置一个目标
考虑到快速上手,这里作者我直接建立一个新工程,在新工程中配置插件。
实现对菜单面板的 背景自定义。

2. 结构规划/流程梳理
该流程用到了下面的插件。
◆Drill_MenuBackground 主菜单 - 多层菜单背景
只要这个插件,就能配置基本的自定义背景了。
3. 准备空白工程并测试
首先,新建一个工程。
复制插件文件到工程。

复制插件资源文件夹。
复制后测试游戏,可以看到,所有菜单面板都被装上了默认的背景。

因为菜单背景会自动检查面板,如果面板没有配置的背景,则自动使用 默认背景 配置。

4. 配置菜单背景
配置菜单背景前,可以先了解下配置技巧:配置方法 。
选择一个背景,设置菜单为: 道具界面,
配一个 黑白网格 图片资源,再加上 限量商店 的遮罩资源。

把底图设置开了。(默认底图是false,表示全黑)

进入游戏,打开道具界面。
可以看到,背景+遮罩 = 相减的图层。
另外,底图展现的是 经过模糊的地图截图 。

单个的背景配置就这些,你还可以添加多层其他的背景。
5. 菜单组合装饰
你可以通过调整参数、替换资源图片实现你自定义的菜单背景。
粒子、魔法圈、GIF、平铺GIF 都是用同样的方式配置。
相关参数知识点:
- 菜单的图片层级可以去看看章节:菜单/标题层级 。

- “所属菜单” > “自定义关键字” 的配置可以去看看文档:”17.主菜单 > 菜单关键字.docx”

6. 示例中可参考对象
所有菜单装饰相关插件可以直接装饰一个空面板,并且可以通过插件指令开关背景。
可以去看看示例中 主菜单管理层 的 “空面板” 和 “菜单背景” 事件。


菜单装饰插件只能进行美化,并不能提供主要功能。
所以设计面板和装饰插件时,应该以面板的功能为主,美化为辅。
你可以去看看文档”18.面板 > 关于全自定义信息面板.docx” 的面板从零开始的教程。

| 制作出一块自定义面板后,你就自然熟悉了背景、粒子等装饰插件与面板的具体关系了。 |
设计略微倾斜的菜单背景
1. 设置一个目标
2026年2月2日,作者我在更新菜单背景插件,这个插件终于支持“平铺的旋转角度”的属性,所以原来的设计可以替换成更简单的设计了。

“17.主菜单 > 多层组合装饰(界面装饰-地图界面).docx”有相似的设计,可以去看看章节:设计略微倾斜的地图背景。 |
2. 结构规划/流程梳理
用到了下面的插件:
◆Drill_MenuBackground 主菜单 - 多层菜单背景
背景插件中有”平铺的旋转角度”设置:

3. 准备资源
新建画布,固定画布大小为600x600。
然后画正方形方格,每个方格都为150x150大小。

将方格铺满,一共16个。

然后选择中间的一个方格,进行7像素的描边,然后5像素羽化。
将羽化后的光晕变色,去掉方框以外的图像,
然后调整光晕的透明度,复制给所有的方格。
最后,方格线需要有亮光,选择方格线区域,拉个圆形渐变就完成了。

另外提一下,原旧版的斜角度平铺网格,也是先画好方格。然后在此基础上,使用 勾股定理 3:4:5 的尺寸,旋转角度为 53.13度实现。(三角形的角度分别为36.86°,53.13°,90°)![]() |
4. 配置背景
将画好的图片放在Menu_layer文件夹下。

配置背景如下图。

在游戏中测试,可以看到下面的效果。

5. 细节调整
旋转角度正数为顺时针,负数为逆时针。
旋转角度可以设为任意度数,但0度、360度、-360度、720度的效果是一样的。
下图为角度15的效果。

下图为角度-15的效果。

设计沿着矩形循环移动的返回按钮
1. 设置一个目标
2026年4月6日,作者我在更新菜单装饰插件。
虽然菜单界面不能执行事件,但是延迟指令和周期指令,可以在菜单界面并行执行。
通过这两种指令,能实现很多菜单动画。
于是就开坑了。

后面会设计更加复杂的变换动画,这里先从简单的开始介绍。
2. 结构规划/流程梳理
设想如下图。
返回按钮沿着矩形周期移动。
目前,装饰插件只用到了返回按钮插件和插件的周期指令。
Drill_MenuBackButton 主菜单 - 返回按钮
但要进入一个面板才能生效,所以就要再加 空面板插件。
Drill_SceneEmpty 面板 - 全自定义空面板
| 该设计没有用到 指令容器,但如果要设计更加复杂的变换动画,大量的插件指令放入指令容器来执行,修改起来非常方便。 |
3. 配置插件并添加事件
菜单背景、菜单粒子、菜单返回按钮,都有默认设置。
如果没有关键字关联到指定的面板,则面板会默认加上上述三者的默认装饰。

因此,这里需要添加配置,并加上关联 界面关键字 的返回按钮。

加自定义返回按钮的时候,可能会出现没关联上的问题,
这里先让返回按钮出现在一个特殊的位置,与默认设置不一样。
确保关键字真的对应上了。

添加了返回按钮后,建立一个事件,打开空面板测试效果。

4. 添加周期指令
确认返回按钮有效后,
根据结构规划的四个位置,分别对应了四个点:
(200,200),(600,200),(600,400),(200,400)
添加周期指令,分别执行四次 移动到 。
如下图所示,需要配置 位置、变换时间、周期时长、周期内开始时间。
为了让按钮依次移动:
每次开始的时间 = 上一次开始的时间 + 变换时间

然后,周期时长 要包含整个循环的时间,将四个90加起来就可以了。
这里多的2帧用于兼容进入菜单后,确保第一条周期指令能生效。

有时候进菜单会卡很久,可能会把第一次移动卡没,所以这里开始时间晚2帧。
延迟指令不会卡没,周期指令因为循环执行可能会卡没。
| 修改单属性、延迟指令、周期指令 的变换时长参数,设置“时间[1]”和“时间[0]”没有区别,因为变换切换至少要1帧的时间。因此设计动画时,要考虑加等待指令;设计周期时长时,要把这1帧也考虑进去。 |
最后在游戏中测试,可以看到正常执行了。

| 菜单的延迟指令和周期指令,每次进入菜单后都会重新执行。如果你想取消动画,需要执行“清空菜单的延迟指令列表”。 |
5. 延迟指令与动画改进
前面介绍了“四次移动到”构成的一个循环动画。
你还可以设计更多的自定义动画,比如示例中“放大+透明消失”的动画。

这个动画涉及了 缩放X、缩放Y、透明度 三个属性。
由于不涉及坐标属性,动画效果看起来不那么突出,这里就又加了延迟指令。

玩家每次进入空面板时,延迟指令都会执行一次移动。

| 菜单的延迟指令和周期指令,添加后就永久存在,要记得使用“清空菜单的延迟指令列表”来取消动画哦。 |
常见问题(FAQ)
红色背景网格不显示
| 问题名称 | 红色背景网格不显示 |
| 问题图示 | ![]() |
| 问题描述 | 示例中作者我自己发现的,切换后,红色背景网格不显示。 |
| 出现时机 | > 更新插件后出现。 |
| 原理解析 | 前面章节:菜单的启用/禁用 ,介绍了 菜单装饰插件,区分 启用/禁用,显示/隐藏 。只要其中一个为禁用或隐藏,那么贴图就不会显示。 其中,启用/禁用 可以用插件指令直接修改。显示/隐藏 必须用 延迟指令/周期指令 修改。但是,除了这两处,还有很多地方都会造成不显示,这里专门归纳一下。 |
| 解决方案 | 这个问题需要逐步排查:》插件配置是否设置了 启用。》插件配置是否设置了 显示。》所属菜单的 关键字 是否对应上了。(“17.主菜单 > 菜单关键字.docx”)》贴图的透明度是否 > 0 。》贴图的缩放是否 > 0 。》贴图的位置是否在游戏范围内。》贴图的 菜单层级、图片层级 是否太低,被其他背景盖住了。》是不是忘了配置 资源图片 。》是不是配置了 静态遮罩 ,全部遮住了。》插件是否为ON。 |



其中,启用/禁用 可以用插件指令直接修改。显示/隐藏 必须用 延迟指令/周期指令 修改。但是,除了这两处,还有很多地方都会造成不显示,这里专门归纳一下。