RenPy中文空间

 找回密码
 立即注册

QQ登录

只需一步,快速开始

查看: 700|回复: 0

[旧版文档] 中级GUI自定义

 关闭 [复制链接]
发表于 2017-10-26 19:44:04 | 显示全部楼层 |阅读模式

马上注册,结交更多好友,享用更多功能,让你轻松玩转社区。

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

x
本帖最后由 BuErShen 于 2018-9-17 08:08 编辑

中级GUI自定义
注意
此处为旧版文档,不再更新。

查阅最新Ren’Py简体中文文档,请到下面网址(同步官方)
https://www.renpy.cn/doc/index.html




接下来,我们将介绍中级GUI自定义。在中级中,将可以改变游戏中的颜色,字体和图片。一般来讲,中级GUI自定义里大部分保持了屏幕的一致性,使得按钮和滑块等处于相对一致的位置上。当然,更改屏幕添加上新的功能的情况也是可以的。

以上这些更改大部分是基于对gui.rpy文件中的变量的更改。例如,增加对话字体的大小,如下面的代码行:

  1. define gui.font_size = 22
复制代码
要减小对话字体就可以改写为:
  1. define gui.font_size = 20
复制代码

要注意的是,默认的设置数值通常与文档中的存在差异。在游戏中选择的大小和颜色的默认值可以更改,在文件中,这些数值被用作为扩展的自定义用户图形界面。使用时,最好是在gui.rpy文件中搜索相关问题的定义和变量——比如,“gui.font_size”的定义。

以下的一些修改将会部分或者完全影响图片文件。但是,这些改变仅在图片文件本身升级的时候产生,因此,可以通过应用程序界面上选择“change GUI”来重新产生图片文件。(要注意的是,这样做会使你之前已经更改的图片文件被重写)。

你可能会想说直到游戏全部完成之后再进行自定义gui.rpy文件。旧的gui.rpy可以在新版本的Ren’Py上运行,但是,新的gui.rpy具有旧版本没有的功能和修复完善功能。早期的自定义化的用户图形界面在这方面的改进上不具有优势。

对话
有一些相对简单的自定义,比如,改变对话在显示器上的显示方式。首先就是对于文本框的改变。
  
gui/textbox.png
该文件包含文本窗口的背景图片,在用户对话屏幕上显示。这个在游戏中必须设为全宽,文字要显示在屏幕中间占60%,屏幕两边留有20%的边界。  
除此之外,还有很多的变量可以被自定义来改变对话dialogue。

  1. define gui.text_color = "#402000"  
复制代码
设置对话字体的颜色。

  1. define gui.text_font = "ArchitectsDaughter.ttf"  
复制代码
设置对话字体,菜单,输入和其他一些游戏中的文字的字体。字体设置的文件应该放在游戏目录中。

  1. define gui.text_size = 33  
复制代码
设置对话文本的大小,这部分的设置应该和选择的字体的空间大小分配情况相适应。

  1. define gui.name_text_size = 45  
复制代码
设置字符名称的大小。

默认情况下,字符名称标签使用标注颜色,在定义字符时,颜色很容易改变。
  1. define e = Character("Eileen", who_color="#104010")
复制代码

textbox.png
一个示例文本框图片。

easy_say_screen.jpg
使用上面的文本框图片和以上的一些设置自定义出的一段对话界面。

选择菜单
菜单语句中的“屏幕选择”是用来选择要显示的播放器。在“屏幕选择”中已经有一些相对简单的专制化后的控件。首先是两个图片文件:
  
gui/button/choice_idle_background.png
该图片用来作为选项未滑到时的按钮背景。

gui/button/choice_hover_background.png
该图片用来作为选项滑过时的按钮背景。  

默认情况下,文字被放置在图片中心75%的位置。以下是控制选项按钮的文字颜色的两个变量属性。

define gui.choice_button_text_idle_color = '#888888'  
该颜色用于选项按钮未滑过时文字的颜色。

define gui.choice_text_hover_color = '#0066cc'  
该颜色用于选项按钮滑过时文字的颜色。

对于图片大小不改变的情况下,以上设置已经可以满足简单的自定义化工作。对于更复杂的自定义化,可以看下面的按钮部分。

choice_idle_background.png
一张 gui/button/idle_background.png 示例图片。

choice_hover_background.png
一张 gui/button/choice_hover_background.png 示例图片。

easy_choice_screen.jpg
“选项屏幕”的一个示例,使用上面示例图片和属性变量运行后的效果。

图片叠加
这里同样使用一对可叠加的图片,用于使按钮的背景变暗或者变亮以及使其他的一些用户接口组件更加符合用户的使用体验。这些图片放置在overlay目录中:

gui/overlay/main_menu.png

用于主菜单屏幕的图片叠加

gui/overlay/game_menu.png

像游戏菜单中的叠加屏幕一样,包括:加载,保存,偏好设置,关于,帮助等等。屏幕根据问题进行叠加选择,在主菜单中也可以使用。

gui/overlay/confirm.png

用于确认屏幕上加深背景。  

以下是一对示例的叠加图片和它们用于游戏中的情况:

main_menu.png
一张 gui/overlay/main_menu.png 示例图片

game_menu.png
一张 gui/overlay/game_menu.png 示例图片

overlay_main_menu.jpg
经过叠加改变之后的主菜单

overlay_game_menu.jpg
经过叠加改变之后的游戏菜单

颜色、字体以及字体大小
GUI中有许多变量可以用来改变文本的颜色,字体和大小。
  
这些变量普遍被设置为十六进制的颜色代码,形如“#rrggbb”(或者,“#rrggbbaa”表示透明度分量)类似于浏览器的颜色代码。比如,“#663399”表示淡紫色。网上有许多的工具可以用来创建HTML颜色代码,这就是其中   “一个”.
  
除了上面提到的 gui.text_color , gui.choice_idle_color, 还有 gui.choice_hover_color, 下面还有一些相关的变量:
  
define gui.accent_color = '#000060'  
着重色在GUI的很多地方都用到,包括一些标题和标签。

define gui.idle_color = '#606060'  
该颜色被用于大部分的按钮没有滑过或者被选中时的状态。

define gui.idle_small_color = '#404040'  
该颜色被用于一些小文本上(比如保存一个slot文件的日期和名称,和菜单的快捷按钮) 当鼠标不靠近时候的颜色状态。这种颜色通常比idle_color更深或者更浅一点来弥补小字体的问题。

define gui.hover_color = '#3284d6'
用于用户图形界面上某控件被滑过的颜色变化,控件包括按钮上的文本和触屏活动区域的滑块和滚动条。

define gui.selected_color = '#555555'
用于按钮被选中时的文本颜色变化(该属性优先级高于hover和idle colors)。

define gui.insensitive_color = '#8888887f'
对用户输入不敏感的按钮文本所使用的颜色(例如,没有回滚情况的回滚按钮)。

define gui.interface_text_color = '#404040'
在游戏界面中静态文本所使用的颜色,比如屏幕上的“帮助”和“关于”文本。

define gui.muted_color = '#6080d0'
define gui.hover_muted_color = '#8080f0'
柔和的颜色用于那些不表示数值或者是显示区域的栏目,滚动条,滑块。(用于图片的重新生成,当图片在程序界面上重新生成的时候才发生作用)。
除了 gui.text_font 下面的变量属性用于文本信息。这些字体变量被放在game目录中。

define gui.interface_text_font = "ArchitectsDaughter.ttf"
该字体用于用户接口界面上的文本元素,如,主菜单和游戏菜单,按钮等等。

define gui.glyph_font = "DejaVuSans.ttf"
该字体用于一些特殊符号,比如,“跳过”指示的符号。DejaVuSans 是这些符号的一个默认值,在每一个Ren'Py游戏中该值被自动包含。
除了 gui.text_sizegui.name_text_size ,下列变量控制文本大小。

define gui.interface_text_size = 36
游戏用户界面中静态文本的大小以及按钮文本的默认大小。

define gui.label_text_size = 45
在游戏用户界面中标签部分的大小。

define gui.notify_text_size = 24
通知类文本的大小。

define gui.title_text_size = 75
游戏标题的大小。

text.jpg
文本字体,颜色,大小改变之后的游戏自定义界面。

边框
用户图形界面的控件有很多,像按钮和栏等,它们可以使用一些边界对象来配置可拉伸缩小的背景。在介绍之前,我们将介绍如何对按钮和栏目进行自定义自定义工作。

Borders 在 Frame() 中显示,一个Frame放置一张图片,并将图片分割为九等份,四个角,四条边和一个中心。四个角始终保持大小不变,左右两边被垂直拉伸,上下两边被水平拉伸,中心在水平和垂直上都进行拉伸。

边框控件给定的大小按照左,上,右,下的顺序。示例如下:

borders.png

边界的顺序如下代码:
  1. Borders(40, 40, 40, 40)
复制代码

当“child”改变大小时,背景会发生如下变化。
borders1.png

边界控件也可以进行边界填充,包括会使“child”和边界重叠的负值填充。比如:
  1. Borders(40, 40, 40, 40, -20, -20, -20, -20)
复制代码

允许“child”和边界重叠的情况。注意,由于发生重叠,所以边界占据空间变小导致最后结果变小。
borders2.png

边界也可以进行平铺而不是伸缩。这是由变量调用导致的。
borders3.png

为了突出显示发生的变化,我们使用的例子图片并不是很美观。在实践中,该系统可以产生令人满意的结果。这就是在用户界面组件中用Frame()显示作为框架窗口的背景的一个应用。

这些框架窗口可以使用两种方式自定义自定义。首先是通过改变背景图像文件:

gui/frame.png

用于框架窗口的背景图片。  

第二种方式是对以下变量进行自定义设置:

define gui.frame_borders = Borders(15, 15, 15, 15)
用于更改框架窗口的边界值。

define gui.confirm_frame_borders = Borders(60, 60, 60, 60)
用于确认屏幕上一帧帧的边界值。

define gui.frame_tile = True
为 True (真)值时,确认模态窗的四边和中心是平铺的。为False (假)时,是缩放的。

frame.png
一张 gui/frame.png 示例图片

frame_confirm.jpg
更改以上变量之后确认模态框的结果展示。

按钮(Buttons)
Ren'Py引擎的用户界面包括不同大小尺寸,不同作用的按钮。不同类型的按钮有:

button

最基本的按钮,用于用户接口中的导航指示作用。

choice_button

在游戏过程中,菜单中的选择按钮。

quick_button

在游戏过程中,可以快捷进入到游戏菜单的按钮。

navigation_button

游戏菜单和主菜单中用于屏幕(弹出窗)之间的导航和游戏的开始。

page_button

用于在加载和保存页面之间的转换按钮。

slot_button

这类按钮表示文件分区,包括缩略图和保存时间以及可选的保存名字段。下面会进行更详细的描述。

radio_button

在偏好设置上用于多项选择按钮。

check_button

在偏好设置上用于可切换选择按钮。

test_button

用于偏好设置上音频测试的按钮,高度应与水平滑块等高。

help_button

玩家用于选择何种帮助的按钮。

confirm_button

确认弹窗中用于选择yes或者no的按钮。

nvl_button

用于选择NVL模式的按钮。  

下面图片存在时,用于自定义按钮背景。

gui/button/idle_background.png

当按钮未聚焦(鼠标没有滑过那个区域时)显示的背景图片。

gui/button/hover_background.png

当按钮聚焦(鼠标滑过那个区域时)显示的背景图片。

gui/button/selected_idle_background.png

当按钮被选中但是没有聚焦时,显示的背景图片。该项是可选的,图片存在时优先于idle_background.png。

gui/button/selected_hover_background.png

当按钮被选中但是没有聚焦时,显示的背景图片。该项是可选的,图片存在时优先于hover_background.png。
  
通过加上这种类型的前缀可以得出更多按钮的背景图片,比如,gui/button/check_idle_background.png 作为未聚焦时选择按钮的背景图片。
  
这边使用四个图片文件来区分radio按钮和check按钮有无聚焦的前景图片。
  
gui/button/check_foreground.png, gui/button/radio_foreground.png
当“radio”和“check”按钮未被选中时使用。

gui/button/check_selected_foreground.png, gui/button/radio_selected_foreground.png

当“radio”和“check”按钮被选中时使用。  

以下是对按钮更多的属性的设置:

define gui.button_width = None
define gui.button_height = 64
按钮的宽高,单位为像素。如果没有设置,默认情况为适应按钮中的文本大小。

define gui.button_borders = Borders(10, 10, 10, 10)
按钮四周的边界,顺序为:左(left),上(top),右(right),下(bottom)。

define gui.button_tile = True
如果为真(True),表示按钮四周和中心将会是平铺的情况,反之将会进行缩放。

define gui.button_text_font = gui.interface_font
define gui.button_text_size = gui.interface_text_size
按钮中文本的字体和大小。

define gui.button_text_idle_color = gui.idle_color
define gui.button_text_hover_color = gui.hover_color
define gui.button_text_selected_color = gui.accent_color
define gui.button_text_insensitive_color = gui.insensitive_color
不同状态下按钮中文本的颜色。

define gui.button_text_xalign = 0.0
按钮中文本的水平对齐方式。 0.0 是左对齐(left-aligned),    0.5 是居中(centered),  1.0 是右对齐(right-aligned)。

以上变量可以配置出一个自定义的特定功能的按钮。
比如 gui.choice_button_text_idle_color 配置空闲选择的按钮颜色。

在我们的样例游戏中,我们可以根据以上变量做以下的自定义:

define gui.navigation_button_width = 290
增加导航按钮的宽度。

define gui.radio_button_borders = Borders(40, 10, 10, 10)
define gui.check_button_borders = Borders(40, 10, 10, 10)
增加“radio”和“check”按钮的边界,为左边的选中标志留出空间。

以下是“播放屏幕”上的一个自定义示例:

idle_background.png
一张 gui/button/idle_background.png 示例图片。

hover_background.png
一张 gui/button/hover_background.png 示例图片。

check_foreground.png
用于 gui/button/check_foreground.png 和gui/button/radio_foreground.png.

check_selected_foreground.png
用于gui/button/check_selected_foreground.png 和gui/button/radio_selected_foreground.png

button_preferences.jpg
应用本节自定义示例后“偏好设置”的效果。

存档槽
“加载”和“保存”使用的存档槽,这些按钮槽储存了“存档”时的缩略图以及储存时间信息。下面的变量参数在存档槽按钮的自定义过程非常有用。

define gui.slot_button_width = 414
define gui.slot_button_height = 309
存档槽按钮的宽高设置。

define gui.slot_button_borders = Borders(15, 15, 15, 15)
对每一个存档槽的边框设置。

define config.thumbnail_width = 384
define config.thumbnail_height = 216
存档时,存档槽里缩略图的宽度与高度。
注意,这些参数存在配置的命名空间中,而不是gui的命名空间。当文件保存和加载时属性起效。

define gui.file_slot_cols = 3
define gui.file_slot_rows = 2
网格设计中,存档槽的行数和列数。

下面是存档槽的背景图片:

gui/button/slot_idle_background.png

用于鼠标未滑过(未聚焦)时的存档槽背景图。

gui/button/slot_hover_background.png

用于鼠标滑过(聚焦)时的存档槽背景。

使用这些后,我们得到:

slot_idle_background.png
一张 gui/button/slot_idle_background.png 示例图片

slot_hover_background.png
一张 gui/button/slot/slot_hover_background.png 示例图片

slot_save.jpg
使用本小节的变量参数后,自定义“保存屏幕”效果。

滑块
滑块是bar类型中的一种,在偏好设置中,使玩家可以选择较多选项的控件。默认情况下,用户图形界面仅使用水平滚动条,但是在游戏界面中,也可以使用垂直滚动条。

滑块使用以下图片进行自定义设置:

gui/slider/horizontal_idle_bar.png
, gui/slider/horizontal_hover_bar.png , gui/slider/vertical_idle_bar.png , gui/slider/vertical_hover_bar.png
用于空闲和悬停状态时的垂直和空闲bar的背景图像。

gui/slider/horizontal_idle_thumb.png
, gui/slider/horizontal_hover_thumb.png , gui/slider/vertical_idle_thumb.png , gui/slider/vertical_hover_thumb.png
用于触摸屏部分即bar的可移动部分的图片。
  
下面是可以设置的一些变量参数:

define gui.slider_size = 64
水平滚动条的高和垂直滚动条的宽。

define gui.slider_tile = True
为真(True)时,frame() 包含的滑块是平铺的,反之,是缩放的。

define gui.slider_borders = Borders(6, 6, 6, 6)
define gui.vslider_borders = Borders(6, 6, 6, 6)
该边框与包含条形图片的Frame控件配合使用。

下面是我们自定义水平滚动条的一个例子:

horizontal_idle_bar.png
一张 gui/slider/horizontal_idle_bar.png 示例图片

horizontal_hover_bar.png
一张 gui/slider/horizontal_hover_bar.png 示例图片

horizontal_idle_thumb.png
一张 gui/slider/horizontal_idle_thumb.png 示例图片

horizontal_hover_thumb.png
一张 gui/slider/horizontal_hover_thumb.png 示例图片

slider_preferences.jpg
使用本小节介绍的变量参数后,自定义化的“偏好设置”界面效果。

滚动条
滚动条用于滚动视窗。 在GUI中,滚动条使用最明显的地方是历史记录界面,另外垂直滚动条也可以在其他界面上使用。
  
滑块是由下面图像定制的:

gui/scrollbar/horizontal_idle_bar.png , gui/scrollbar/horizontal_hover_bar.png , gui/scrollbar/vertical_idle_bar.png , gui/scrollbar/vertical_hover_bar.png
上述是在空闲和悬停状态下用于垂直和空闲数值条的图像。

gui/scrollbar/horizontal_idle_thumb.png
, gui/scrollbar/horizontal_hover_thumb.png , gui/scrollbar/vertical_idle_thumb.png , gui/scrollbar/vertical_hover_thumb.png
上述是用于翻阅的图像,即滚动条可移动的部分。  

同时还使用了下面变量:

define gui.scrollbar_size = 24
自定义水平滚动条的高度和垂直滚动条的宽度。
  
define gui.scrollbar_tile = True
如果值为true,则包含滚动条的框架是平铺的。 如果是False,则是缩放的。

define gui.scrollbar_borders = Borders(10, 6, 10, 6)
define gui.vscrollbar_borders = Borders(6, 10, 6, 10)
与包含条形图像的框架一起使用的边框。

define gui.unscrollable = "hide"
这里说明了数值条是不可滑动的时候,该怎么办。 当不需要保持数值条显示时,可以用“hide”来隐藏它。

下面是我们如何自定义垂直滚动条的示例。

vertical_idle_bar.png
一张 gui/scrollbar/vertical_idle_bar.png 示例图片

vertical_hover_bar.png
一张 gui/scrollbar/vertical_hover_bar.png 示例图片

vertical_idle_thumb.png
一张 gui/scrollbar/vertical_idle_thumb.png 示例图片

vertical_hover_thumb.png
一张 gui/scrollbar/vertical_hover_thumb.png 示例图片

scrollbar_history.jpg
应用了本节中所给出的定制后所得到的“历史记录”界面

数值条
普通的旧数值条用于向玩家显示一个数字。 它们不可以在GUI中使用,但可以在创建者自定义的屏幕中使用。
  
可以通过编辑下面图像来定制数值条:

gui/bar/left.png, gui/bar/bottom.png

用于水平和垂直数值条的填充部分的图像。

gui/bar/right.pbg, gui/bar/top.png

用于水平和垂直数值条的填充部分的图像。

一下常用变量也可以用来控制数值条:

define gui.bar_size = 64
水平数值条的高度和垂直数值条的宽度。

define gui.bar_tile = False
如果值为true,则包含滚动条的框架是平铺的。 如果是False,则是缩放的。

define gui.bar_borders = Borders(10, 10, 10, 10)
define gui.vbar_borders = Borders(10, 10, 10, 10)
与包含条形图像的框架一起使用的边框。

下面是我们如何自定义水平数值条的示例。

left.png
一张 gui/bar/left.png 示例图片

right.png
一张 gui/bar/right.png 示例图片

bar.jpg
上面是我们定义的一个界面的示例效果。

跳过和通知  
跳过和通知屏幕都是用于显示消息的框。 两者都使用自定义背景图像:
  
gui/skip.png
跳过屏幕背景图

gui/notify.png

通知屏幕的背景图。

控制这些参数的变量是:
  
define gui.skip_frame_borders = Borders(24, 8, 75, 8)
定义“跳过”界面的框架边框。
  
define gui.notify_frame_borders = Borders(24, 8, 60, 8)
定义“通知”界面的框架边框。

define gui.skip_ypos = 15
“跳过提示”的垂直位置,以窗口顶部的像素为基准。

define gui.notify_ypos = 68
“通知消息”的垂直位置,以窗口顶部的像素为基准。

下面是自定义跳过和通知界面的示例。

skip.png
一张 gui/skip.png 示例图片

notify.png
一张 gui/notify.png 示例图片

skip_notify.jpg
实例中的跳过和通知界面。

对话、继续
除了上述简单的自定义之外,还有一些方法可以控制如何向玩家展示对话。

文本框

文本框(或窗口)是显示对话框的窗口。除了更改 gui/textbox.png 之外,也可以通过下面变量控制文本框的显示方式。
  
名称和名称框
人物的名称放在使用 gui/namebox.png 图片作为其背景的框内。 此外,还有一些变量可以控制名称的显示。 只有当说话人物有名字的时候,才会显示该名称框(一个空的名字,例如“ ”,是不会显示的)。

define gui.name_xpos = 360
define gui.name_ypos = 0
名称以及名称框的水平和垂直位置。 它们通常是位于文本框的左侧或顶部的附近。 将变量设置为0.5会将文本框中的名称置于中心位置(见下文)。 这些数字也可以是负数, 例如,将gui.name_ypos设置为-22会将使其文本框定位在顶部22个像素的地方。

define gui.name_xalign = 0.0
人物名称的水平对齐。 左对齐为0.0,中心为0.5,右对齐为1.0。 (大部分情况设为0.0或0.5)。这用于名称框相对于gui.name_xpos的位置,并且用于选择与xpos对齐的名称框的一边。

define gui.namebox_width = None
define gui.namebox_height = None
define gui.namebox_borders = Borders(5, 5, 5, 5)
define gui.namebox_tile = False
这些变量控制包含名称框的对话框的显示。

对话

define gui.dialogue_xpos = 402
define gui.dialogue_ypos = 75
当前对话框的水平和垂直位置。 这些通常是位于文本框的左侧或顶部的附近。变量设置为0.5将会对话框设在文本框的中间位置(见下文)。

define gui.dialogue_width = 1116
该变量给出了一行对话的最大宽度约束,以像素为单位。 当当前对话长度达到这个宽度时,它将被Ren'Py自动换行。

define gui.dialogue_text_xalign = 0.0
对话文本的水平对齐。 0.0表示为左对齐,0.5表示为中心,1.0表示为右对齐。

示例

要使"角色名称"居中的话,请使用:
  1. define gui.name_xpos = 0.5
  2. define gui.name_xalign = 0.5
复制代码

要使"对话文本"居中的话,请使用:
  1. define gui.dialogue_xpos = 0.5
  2. define gui.dialogue_xalign = 1.0
复制代码

在游戏示例中,我们使用下面代码j将“名称框”居中:
  1. define gui.namebox_width = 300
  2. define gui.name_ypos = -22
  3. define gui.namebox_borders = Borders(15, 7, 15, 7)
  4. define gui.namebox_tile = True
复制代码

namebox.png
一张 gui/namebox.png 示例图片

intermediate_dialogue.jpg
对上面参数进行自定义设置后的游戏示例效果。

历史  
有下面几个变量可以控制历史记录界面的显示方式。

define config.history_length = 250
历史记录条目的长度,以像素为单位。

define gui.history_height = 210
历史记录条目的高度,以像素为单位。 这里也可以设为None,以使历史记录条目高度的变化以性能为代价——当这里是None时,config.history_length 的值相应也需要有所降低。

define gui.history_name_xpos = 0.5
define gui.history_text_xpos = 0.5
名称标签和对话文本的水平位置。 这些可以设在历史记录条目左侧的附近,或0.5到中心位置。

define gui.history_name_ypos = 0
define gui.history_text_ypos = 60
名称标签和对话文本的垂直位置,可以设在历史记录条目顶部的附近。

define gui.history_name_width = 225
define gui.history_text_width = 1110
名称标签和对话文本的宽度,以像素为单位。

define gui.history_name_xalign = 0.5
define gui.history_text_xalign = 0.5
这里可以控制文本的对齐方式和与xpos对齐的文本边。 0.0是左对齐的,0.5是中心对齐的,1.0是右对齐的。

history.png
自定义上述参数设置后的“历史”界面。

NVL
Nvl界面显示了nvl模式的对话. 有多种自定义的方式。 第一种是定制NVL模式的背景图像:

gui/nvl.png

在NVL模式下使用的背景图像。 这里应该与游戏窗口的大小相同。还有一些变量用于自定义NVL模式文本的显示方式。

define gui.nvl_borders = Borders(0, 15, 0, 30)
NVL模式背景的边框。 由于背景并不是一个框,所以仅用于填充NVL模式以防止将其向上压在屏幕的两侧。

define gui.nvl_height = 173
单个NVL模式条目的高度。 将其设置为固定高度的话可以使NVL模式无需分页,同时显示固定数量的条目。 将此设置为NONE的话,则允许条目具有可变尺寸。

define gui.nvl_spacing = 15
当 gui.nvl_height 为 None 时,条目之间的空格数以及NVL模式菜单按钮之间的空格数。

define gui.nvl_name_xpos = 0.5
define gui.nvl_text_xpos = 0.5
define gui.nvl_thought_xpos = 0.5
相对于条目的左侧,角色名称、对话文本以及心理/叙述文本的位置。 这可以是多个像素,或设为0.5表示条目的中心。

define gui.nvl_name_xalign = 0.5
define gui.nvl_text_xalign = 0.5
define gui.nvl_thought_xalign = 0.5
文本的对齐。 这将控制文本的对齐方式和在xpos上的文本边框的位置。 左边为0.0,中心为0.5,右侧为1.0。

define gui.nvl_name_ypos = 0
define gui.nvl_text_ypos = 60
define gui.nvl_thought_ypos = 0
人物名称,对话文本和心理/叙述文本的位置。 应该设在顶部的附近位置。

define gui.nvl_name_width = 740
define gui.nvl_text_width = 740
define gui.nvl_thought_width = 740
每种文本的宽度,以像素为单位。

define gui.nvl_button_xpos = 0.5
define gui.nvl_button_xalign = 0.5
NVL模式菜单按钮的位置以及对齐方式。

Ren'Py默认情况下不使用NVL模式。 它必须使用NVL模式的人物调用,并在script.rpy中定义一些变量。
  1. define e = Character("Eileen", kind=nvl)
  2. define narrator = nvl_narrator
  3. define menu = nvl_menu
复制代码

下面是使用上述代码自定义的NVL界面示例。

nvl.png
一张gui/nvl.png 示例图片

nvl.jpg
对上面参数进行自定义设置后的游戏示例效果。

文本
大多数文本可以使用GUI变量进行定制。 使用的变量形式如下:

define gui.kind_text_font
如果存在,则用于定义文本的字体。

define gui.kind_text_size
如果存在,则用于定义文本的大小。

define gui.kind_text_color
如果存在,则用于定义文本的颜色。

其它 文字样式属性 cam 也可以以相同的方式进行设置。 例如,使用 gui.kind_text 设置outlines属性。
该类型的前缀也可以是缺省的,在这种情况下,系统会设置默认的文本外观。 否则,它可能是以上按钮之一,或下面之一:

interface

游戏外部界面中的默认文本

input

文本输入控件中的文本

input_prompt

文本输入的提示部分

label

装饰标签

prompt

对于询问玩家的问题给出提示

name

人物姓名

dialogue

对话

notify

通知文本

例如 :
  1. define gui.dialogue_text_outlines = [ (0, "#00000080", 2, 2) ]
复制代码
在对话文本右下方设置阴影

翻译和GUI变量

Gui的命名空间是特殊的,因为它在初始化阶段之后,以及任何编译的python块运行之前这段时间内保存。 这使得我们可以更改编译的python块中的任何GUI变量以兼容另一种语言。

例如,下面代码更改了默认的文本字体和大小。
  1. translate japanese python:
  2.         gui.text_font = "MTLc3m.ttf"
  3.         gui.text_size = 24
复制代码

翻译者需要注意的一个问题是,在gui.rpy的某些地方,一个变量会被赋值为另一个变量。

例如,默认的 gui.rpy 有:
  1. define gui.interface_text_font = "DejaVuSans.ttf"
复制代码

另一个:
  1. define gui.button_text_font = gui.interface_text_font
复制代码

由于这两个语句都在运行任何编译块之前运行,所以两个变量都需要更改。
  1. translate japanese python::
  2.         define gui.interface_text_font = "MTLc3m.ttf"
  3.         define gui.button_text_font = "MTLc3m.ttf"
复制代码
这样即使第二个声明是缺省值,DejaVuSans的格式仍然会被使用。

—————————————————————————— 尾线 ——————————————————————————

--------------------------
有任何意见与反馈
欢迎在 此处 交流

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

小黑屋|手机版|RenPy中文空间 ( 苏ICP备17067825号 | 苏公网安备 32092302000068号 )

GMT+8, 2018-12-19 07:02 , Processed in 0.046417 second(s), 23 queries , File On.

Powered by Discuz! X3.4

© 2001-2017 Comsenz Inc.

快速回复 返回顶部 返回列表