窗口与布局

定义

窗口： 指游戏核心结构中，定义的一个具有 背景皮肤、文本域 的 贴图 。

（窗口本质就是贴图，但是平常说的贴图，都不包括窗口。）

含选项的窗口：指在窗口的基础上，再含有选项、键盘鼠标控制切换选项功能的窗口。

名词索引

以下你可以按住ctrl键点击下面的词，可以直接定位到想了解的名词：

基本结构	界面 背景 底图 窗口 贴图 整体布局
分辨率	默认分辨率 修改分辨率
窗口	窗口常见参数 窗口布局 互斥性
文本域	文本域 文本域中的选项
含选项的窗口	列数 每条选项高度 最大选项显示数

思维导图

窗口与布局的思维导图如下：（你可以控制word右下角的缩放比例，看清小字）

基本结构

快速区分

由于插件中描述的比较口语化，这四个名词指代的并不具体，理解大意即可。

界面: 界面是指用户 当前看到 的游戏窗口内的所有图像画面。在脚本中称为Scene。每个界面只能单独运行，运行时其他界面处于暂停状态。

（详细可以见：”0.基本定义 > 界面.docx”）

背景(底图): 这里的背景泛指 装饰底图 的菜单插件，有时也表示底图本身。

贴图: 贴图就是一张图片。在脚本中称为Sprite。

贴图通常被作为 按钮、背景贴图、前视图、头像、框 等使用。

窗口: 是一个具有 背景皮肤、文本域 的 贴图。在脚本中称为Window。

窗口的 文本域 的长宽决定了显示的文本量、滚动条、选项宽度等。

在旧版文档中，文本域被叫做”有规划的矩形”，实际上意思一样。

窗口与界面

一个菜单界面可以分成如下结构：

菜单界面：是一种已定制好的界面，包含底图和功能部件。

底图：可以被主菜单相关装饰插件进行装饰，通过 界面关键字 来装饰。

功能部件：功能部件即界面中固定设置好的窗口、贴图等内容。

原始的主菜单的部件结构如下图。（由 3个窗口 组成）由于游戏编辑器中没有定制菜单的渠道，所有可定制的菜单，都是通过插件一个个配置的。

你可以通过全自定义主菜单面板插件，把菜单选项窗口和角色窗口变成更灵活的按钮组配置，具体可以看后面章节。

游戏分辨率

默认分辨率：游戏默认的窗口大小是816*624像素，你可以对进行缩放或者全屏。

注意，简单的缩放并不增加分辨率，如果把窗口拉伸，拉伸至全屏，图像会变模糊，因为图片的内容还是原来的816*624。

修改分辨率：打开yep核心引擎插件，设置屏幕宽度为916，然后设置战斗背景重置。

于是可以看到下面的窗口被拓宽了100像素的距离。

由图可知，如果你修改了游戏的分辨率，那么原来规划的816*624的所有窗口布局，包括画面镜头ui的位置，全部要进行修正。

你需要将整体布局的图片更换成916*624大小，以及修改按钮组等所有面板的x位置。

窗口

常见参数

面板插件把大部分能调控的窗口相关参数都调出来了，通常窗口都有以下配置属性：

	配置参数（旧）	配置参数（最新）
平移	平移-窗口 X平移-窗口 Y	窗口 X窗口 Y
属性	窗口高度窗口宽度窗口字体大小	窗口高度窗口宽度窗口字体大小
移动动画	窗口起点 X窗口起点 Y窗口移动时长	移动动画：移动类型移动时长移动延迟起点：坐标类型相对坐标 X相对坐标 Y绝对坐标 X绝对坐标 Y
布局	是否使用窗口布局资源-窗口平移-窗口布局 X平移-窗口布局 Y	布局：布局类型资源-贴图贴图位置修正 X贴图位置修正 X
含选项的窗口属性	窗口列数	窗口列数每条选项高度指针与边框：是否启用菜单指针是否锁定菜单指针样式锁定的菜单指针样式是否启用闪烁白矩形是否启用菜单边框是否锁定菜单边框样式锁定的菜单边框样式是否启用滚动条是否锁定滚动条样式锁定的滚动条样式
其他属性	（其它属性）	（其它属性）

由于插件在不断更新，后续窗口可能会够更多的配置参数。

不过，窗口主要的位置、高、宽、布局等属性，已经够用了，其它参数都是锦上添花。

（如果继续深究，配置参数那真的是数不胜数。如果你对这些更深入的细节有需求，可以去学学脚本，尝试自己修改窗口的window和window_base类的属性吧。）

布局

通常的布局，是指物体摆放位置、排列方式之类的。

作者我在插件中最初定义时，”布局”这个词的概念没有定义好，现在也不方便全部推翻重新定义，所以现在仍然保留原定义。理解即可。

整体布局：是指界面中可以配置的一个在所有窗口最前面的贴图，可以挡住窗口。

窗口布局：是指窗口的皮肤设置或者单张背景贴图。

固定大小的窗口布局

配置中，你可以直接设置布局类型，控制相应的贴图布局。

旧配置中也可以实现图中的三种布局类型，设置方法如下：

旧配置为：使用贴图布局（true），不使用贴图布局（false）。

使用，表示窗口布局为一张图片；

不使用，表示窗口布局为默认的系统布局。

不使用窗口布局：（表示用默认对话框的那种布局）

如果你设置使用布局，但是设置图片为空的话，那么将只显示透明文字：

可变大小的窗口布局

目前可变大小的窗口，具体内容可以去看看“14.鼠标 > 关于鼠标悬浮窗口.docx”。

鼠标悬浮窗口会根据内容自适应高宽，

你可以根据设计情况，选择需要的布局模式。

布局与文本域

文本域：即绘制文字、图片的区域，选项也只能绘制在文本域中，不能越界。

文本域与窗口的高宽有一环白色的内边距，通常为18像素左右。

（引擎核心插件可以调整内边距）

在旧版文档中，文本域被叫做”有规划的矩形”，实际上意思一样。

含选项窗口的文本域：在含选项的窗口中，上侧和下侧中心会提供切换选项小箭头。左侧和右侧会提供滚动条功能，所以内边距不要设置太小了。不然会挤在一起。

文本域中的选项：文本域中，选项之间是直接紧密相贴的。

如果窗口中有”每条选项高度”属性，那么文本域分配选项剩余的高度时，会留出空白。

如果窗口中为”最大选项显示行”属性，那么选项会根据文本域高度，自动分配选项高度。

单张贴图背景：由于使用布局时，文本域是不可见的，所以在配置贴图背景时，很容易产生偏差。你可以先设置默认皮肤，确定文本域和窗口的位置，再对贴图背景进行修正。

窗口互斥性

互斥性：窗口之间相互交织时，会出现遮挡的情况。即使窗口完全透明，也会造成遮挡。

出现互斥的情况，与窗口本身的先后顺序与绘制关系相关。所以你需要尽量保持窗口之间有足够的空间，并且移动动画也要避免交织。

另外，单张贴图背景 之间不会被遮挡，所以贴图背景可以相对画大一些。

窗口隐藏

设置 窗口、文字 的y轴1000以上，让玩家在窗口中看不见就可以了。

注意，该方法对 含选项的窗口 不适用，因为有选项的窗口对于当前选项是有左右控制的，虽然看不见，但是操作是有键盘动作的。

（在部分菜单中，有通过改变 流程 的方式来隐藏选项窗口的功能，那个可以消除键盘动作的关联。）

含选项的窗口

含选项的窗口

前面已经介绍了含选项窗口的部分内容，这里重新整理一下。

含选项的窗口：指在窗口的基础上，再含有选项、键盘鼠标控制切换选项功能的窗口。

文本域中的选项：文本域中，选项之间是直接紧密相贴的。

如果窗口中有”每条选项高度”属性，那么文本域分配选项剩余的高度时，会留出空白。

如果窗口中为”最大选项显示行”属性，那么选项会根据文本域高度，自动分配选项高度。

列数：窗口选项可以支持多列，但是多列时，是 固定 以宽度为准按比例分配的。

最大选项显示数：注意，这个不是可以配置的参数。因为选项的高度与文本域的高度，直接决定了最大选项显示的数量。

比如文本域高度为100，选项高度为30，那么最多能显示 100/30 = 3.33，3个选项。

如果窗口中有3个以上的选项，那么在上下滚动翻页时，则会瞬间刷新选项内容。

（按钮组滚动时也是一样的效果）

选项与按钮组

选项窗口可以通过按钮组核心插件，把窗口变为按钮组。

两者的结构不一样，但是本质上非常相似。

具体可以去看看 ”1.系统 > 关于按钮组核心.docx”。

按钮组直线排列：

按钮组环形排列：

规划窗口

开始规划自己的窗口

以全自定义装备窗口为例，我们这里先把全部窗口的默认布局打开：

你如果一开始就使用贴图布局，就无法知道自己设置的规划矩形的宽高会是什么样。

装备窗口有5个窗口，其中选项窗口、武器槽、武器列表三个窗口由于高度原因，是挤在一起的。（上面的ui可能看不出来，看看下面这个）合理超出一点高度无伤大雅。

下面的黄色框为宽高，红色点为x，y坐标。

从图中可以看出来，这些窗口都是被紧密排在一起的，几乎没有多余的空间可以分配。不过，你可以把最下方的注释窗口隐藏（设置y1000），以及装备插件的选项窗口设置隐藏，空间就有了。

规划时，建议用ps确定红色的点位置以及黄色矩形的宽高。

窗口都有自己的滚动条，如果高度不够，会出现滚动条。

当然，如果你的贴图布局与滚动条在一起看起来格格不入的话，就不要压缩高度了。

窗口的内容如果超出了宽度，那么内容会直接被遮挡。

这里注意内容不要太长就可以了，当然宽度也不要太窄了。

另外，窗口的列数，一般控制选项的窗口可以设置列数。

选项窗口的三个按钮，就是一个横向的3列选项。下面的武器槽窗口是一列。

列数不要设置太多，否则会发生错位情况。

有些选项会根据宽度压缩，但是有些就不会，不会压缩的需要慢慢试才能知道。

当你规划完以上布局之后，你就可以换上自己的贴图了。

窗口布局xy值用与修正图片的偏移位置，你在规划完布局之后，再贴图，根据贴图的位置调整偏移量。

窗口的起点xy值是用于窗口渐变出现用的，xy都设置为0将会在原地慢慢显现。

如果你要窗口在原地，而且立刻显现，设置xy都为0，并把移动时长改成1。

如果你想设计完全属于自己的菜单面板，

可以去看看文档 ”18.面板 > 关于全自定义主菜单界面『含配置表和示例』.docx”。

开始规划战斗角色窗口

与规划窗口一样，一开始把干扰项先置0。（平移-面板 xy坐标0,0）

角色窗口中的角色面板组，是分4人和4人以上两种情况的。

其中自适应是把x或者y方向的坐标设置成与玩家数量相关的居中措施。

如果你使用了水平模式，就开启水平自适应，不要使用垂直自适应。

下面的是水平自适应的样子：** （红点表示适应点）**

将平移-面板x设置为合适的修正值（比如-90，要根据你的图片资源定）

设置 平移-面板y ，把窗口都移下来就可以了（480）。

垂直与水平同理，垂直模式下设置垂直自适应：

将平移-面板y设置为合适的修正值（-45），

然后平移-面板x ，设置窗口的横向偏移量就可以了。

如果你关闭自适应的话，间距和W间距关系，参照前一章”排布方式”来控制。

其中，配置的优先权如下：

x轴： 固定位置 > 自适应 > 间距/w间距

y轴： 固定位置 > 自适应 > 间距/w间距

注意，x轴设置了自适应，y轴是可以设置w间距的。

下面的是5人自适应x轴，w间距设置了40的情况。

贡献者

暂无相关贡献者

页面历史

暂无最近变更历史