请选择 进入手机版 | 继续访问电脑版
查看: 2731|回复: 8

[资源] mc studio界面编辑器说明文档

[复制链接]

606

主题

6611

回帖

3106

积分

Lv.8 凋零克星

不想考体育

UID
12
小麦
554
金锭
9312
下界之星
0

三周年纪念勋章二周年纪念勋章一周年纪念勋章秋天的童话设计师开发者认证勋章玩家团队勋章妙镐生花第一季百万勋章内测精英勋章问答斯基的方向盘我是Alex!

发表于 2020-1-2 15:57:43 | 显示全部楼层 |阅读模式 IP:广东
1.        基本介绍
界面编辑器用于可视化的编辑《我的世界》游戏内的界面。
进入编辑器后,如果当前显示的为地图编辑器,那么点击左上角图标,会显示编辑器列表,选择其中的“界面编辑器”,如下图:

界面编辑器的界面构成如下:

下面简单介绍各个界面的作用:
工程文件:显示当前界面工程文件(文件后缀为.mcgui)。点击“+”可新增界面工程文件。在保存时,每个mcgui文件都会对应的另存一个同名Json文件,Json文件就是游戏中要用到的界面文件。
界面结构:当前选中工程的界面控件树状结构,在这里可以对控件进行选中、隐藏/显示等操作,右键控件,可进行添加子控件、删除、复制等操作。
控件类型:选中“界面结构”中某个控件,再单击“控件类型”区域的控件,可以添加一个子控件。其中画布比较特殊,画布用于挂各种非画布控件,不能作为其他控件的子控件。
控件属性:选中控件时,这里会显示该控件可编辑的属性。
编辑区域:编辑区域会实时显示界面编辑效果,也可选中、移动、缩放控件。
资源管理:点击右上角的导入按钮,可导入图片资源 (可多选批量导入)。
对齐操作:在界面结构中,按住Ctrl键后多选控件,然后点击对齐按钮,可对齐选中的控件。
2.        界面编辑
2.1        添加控件
有两种方式在界面中添加控件:一种方式是直接点击菜单栏中的控件图标,会在当前选中的控件下添加一个该类型的子控件;另一种方式是在控件结构中的控件上右键,依次选择添加对象->控件。添加控件后,编辑区域会实时显示添加的控件。
2.2        控件基础属性
在控件列表或者编辑区域中选择控件后,被选中的控件会显示一个红框,其父控件会显示一个蓝框。

在右侧属性面板中会显示被选中控件的属性,控件有一些通用的属性,如下:
锚点:每个控件有9个定位点,包括四个角、四边的中点、中心点,锚点可以设定子控件的哪个定位点和父控件的哪个定位点重合,下图中左侧对应父控件、右侧对应子控件。

下图为子控件中心和父控件上边中点重合的情况。

下图为子控件右下角和父控件左上角重合的情况。


名称:控件的名字,只能是字母和数字的组合。
隐藏控件:勾选后会隐藏控件。在控件列表中,点击控件左侧的眼睛也能够实现类似效果。

层级:层级用于控制控件的上下关系。层级高的显示在上面。
位移:位移用于控制该控件相对于锚点位置的偏移。位移的形式为%+Px。%表示父控件尺寸的百分比,Px表示像素。如果X配置为10%+10Px,父控件的宽度为100像素,那么子控件的横向(X)的偏移就为10%×100+10=20Px。
需要子控件的偏移和父控件的尺寸相关时,就需要用%配置。%和Px的按钮可点击,点击后会在两种形式中切换。

尺寸:尺寸为控件的宽(X)和高(Y)。也是%+Px的形式,其意义同位移。相比于位移的配置,尺寸还可设置跟随关系。下图中,点亮了“↓”后,表示X跟随Y,如果Y的尺寸是100Px,X是20%+5Px,那么宽度为20%×100+5=25。点亮“↑”时,表示Y跟随X,计算方式同理。需要宽和高关联时,就需要用到%配置。

举一个复杂一点的例子。父控件的宽为100,子控件的宽设置为50%+5Px,子控件的高设置为跟随宽,数值为80%。那么子控件的高度为80%×(50%×100Px+5Px)=44Px。
一般来说,控件的偏移和尺寸均用Px配置即可,比较复杂的情况才需要用到%。
2.3        控件类型
画布:画布是一个完整的界面,画布下可以挂除了画布以外的子控件。一个界面工程文件中可以有多个画布。新建的界面工程文件会自带一个名字为main的画布。
面板:面板本身并没有可视元素,把归属一个模块的控件挂在一个面板下,能够让界面结构更加清晰,调整起来也更加方便。
图片:图片控件用于显示图片。图片会在不变形的情况下尽量撑满控件的尺寸。
按钮:按钮是重要的交互控件。可设置按钮上的文本、文本颜色、文本字号、文本偏移。按钮的贴图分为普通、按下、悬浮三种情况。“普通”即为正常状态下的贴图,“按下”为按钮被按下时的贴图,“悬浮”为在PC中,鼠标移动到按钮上时的按钮贴图。
设置贴图的方式:在资源管理窗口中,左键按住贴图拖动到贴图框中,待鼠标变为带“+”号的样式时,松开鼠标,即可完成贴图设置。

文本:文本控件用于显示文本,可设置字号和颜色。
滚动列表:滚动的内容可在“内容”配置项中选择。“内容”的下拉列表中,会出现其他画布中的控件供选择。下图中,templateContent1、templateContent2是画布名称,buttonMail、panelMailBody、gridMailList等是控件名称。

并不是所有控件都能够作为滚动列表的内容,目前仅限于面板、按钮、网格三种类型可作为滚动列表的内容。如果想在滚动面板里显示文本控件,可将文本控件放在面板下,然后将面板作为滚动列表内容。不过并不支持将滚动列表挂在面板下,再将面板作为另外一个滚动列表的内容。
网格:网格用于需要规律排布的界面,如背包界面。其中内容的配置方式类似滚动列表中的内容。网格规模用于配置网格的行列数。网格会自动将内容均匀的显示在各个格子内。

集合名在代码中绑定UI控件时会用到,具体可参考《UI说明文档》。
3.        《我的世界》界面适配方法
手机的分辨率是多种多样的,想尽量的适配更多的分辨率,就需要了解《我的世界》中界面适配的方法。适配界面时涉及的尺寸如下:

其中画布一般和屏幕大小相同,少数情况会小于屏幕,由系统和玩家设置决定。
前面我们已经知道,控件的尺寸为百分比加一个固定像素值的形式。系统在计算控件实际的显示尺寸时,会对所有固定像素乘以一个比例a。举例如下:

那么比例a是怎么确定的呢?系统会按如下步骤计算这个比例:
1)        计算画布的宽除以376、画布的高除以250的值。上面的例子中,这两个值为1000/376=2.66,750/250=3。
2)        计算a的最大值。在1)中计算的两个比例分别取整,然后再取最小值,作为a的最大值。在上面的例子两个比例取整后分别为2和3,最小值就是2。
3)        计算a的最终值。根据某些的规则得到一个比2)中小的值,作为a最终的值。这个规则开发者无需关心。一般来说最终值和2)里计算的最大值是一样的。
在上面的例子中,a的值为2,那么控件显示的宽为80Px+50Px×a=180Px,高为150Px+100Px×a=350Px。
通俗一点来说,游戏里有一个376Px×250Px的适配区域(下图中紫色实线部分),游戏把这个适配区域按整数倍膨胀,直到再膨胀就会超出画布为止。然后将这个整数比例乘以控件尺寸中的固定像素,再加上比例部分计算得到的像素,作为最终的控件显示尺寸。

因此,如果我们想UI在各种分辨率的屏幕下都不会超出屏幕边界,可以把决定显示范围的父控件(比如顶层的面板控件)的尺寸设为固定尺寸,且数值在376×250以下。需要注意的是,贴图并不需要受限于这个尺寸,可以适当扩大贴图尺寸,以在大分辨率的屏幕里获得更好的效果。

本帖子中包含更多资源

您需要 登录 才可以下载或查看,没有帐号?立即注册

x

14

主题

49

回帖

147

积分

Lv.4 怪物猎人

UID
29504
小麦
113
金锭
852
下界之星
0
发表于 2020-1-3 11:53:54 | 显示全部楼层 IP:河北
第一时间来测试一下,UI编辑器非常适合新手,极其容易上手!
而且扩展性也很强,个人认为比其它编辑器都要好用很多!
界面也很简洁明了,不用**太多时间学习和研究,赞!

9

主题

329

回帖

97

积分

Lv.3 矿物能手

任何我的世界中国版问题都能私信问我噢~

UID
12522
小麦
2
金锭
519
下界之星
0

玩家团队勋章

发表于 2020-1-3 13:52:51 | 显示全部楼层 IP:浙江
收到消息来测试一下嘿嘿嘿

2

主题

37

回帖

13

积分

Lv.1 新手木匠

UID
6482549
小麦
0
金锭
233
下界之星
0
发表于 2020-1-4 14:54:04 来自手机 | 显示全部楼层 IP:浙江
1,控件列表为空时,如何添加新控件
2,为什么示例界面模板,看不到任何界面,此帖中描述的邮件界面也看不到

4

主题

1093

回帖

345

积分

Lv.2 石器学徒

UID
3409745
小麦
4
金锭
1241
下界之星
0
发表于 2020-1-4 23:45:20 | 显示全部楼层 IP:广东
晴天流鼻涕 发表于 2020-1-4 14:54
1,控件列表为空时,如何添加新控件
2,为什么示例界面模板,看不到任何界面,此帖中描述的邮件界面也看不 ...

1.先新建一个画布,然后就可以添加其他控件了;
2.先选择左下角mailUI(界面文件),再在控件列表中选择main(画布),就能看到界面了。

2

主题

37

回帖

13

积分

Lv.1 新手木匠

UID
6482549
小麦
0
金锭
233
下界之星
0
发表于 2020-1-10 02:30:59 来自手机 | 显示全部楼层 IP:浙江
试过了,我的电脑不行,用云电脑可以
   是不是不支持AMD家的cpu或者显卡?
如果没这方面的问题我就重装系统试试了

4

主题

1093

回帖

345

积分

Lv.2 石器学徒

UID
3409745
小麦
4
金锭
1241
下界之星
0
发表于 2020-1-16 09:44:39 | 显示全部楼层 IP:广东
晴天流鼻涕 发表于 2020-1-10 02:30
试过了,我的电脑不行,用云电脑可以
   是不是不支持AMD家的cpu或者显卡?
如果没这方面的问题我就重装系 ...

你的电脑配置可以发给我们吗,另外如果可以录个你的电脑打开和操作UI编辑器的视频的话就更好了
我们可以用相应配置的电脑试试能否复现问题

2

主题

37

回帖

13

积分

Lv.1 新手木匠

UID
6482549
小麦
0
金锭
233
下界之星
0
发表于 2020-1-16 23:55:32 | 显示全部楼层 IP:河南
雾都漫游者 发表于 2020-1-16 09:44
你的电脑配置可以发给我们吗,另外如果可以录个你的电脑打开和操作UI编辑器的视频的话就更好了
我们可以 ...

视频和配置截图在附件中

本帖子中包含更多资源

您需要 登录 才可以下载或查看,没有帐号?立即注册

x

4

主题

1093

回帖

345

积分

Lv.2 石器学徒

UID
3409745
小麦
4
金锭
1241
下界之星
0
发表于 2020-1-20 19:23:15 | 显示全部楼层 IP:广东
晴天流鼻涕 发表于 2020-1-16 23:55
视频和配置截图在附件中

谢谢反馈,我们在看是否能够重现这个问题
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

返回顶部