本文主要修改的文件为screens.rpy，次要修改文件为gui.rpy

参考资料

  1. 大佬教程
    添加描述
  2. 文档链接
    最近发言
    存档编号
    最新存档

    视频教程

查看源代码

打开screens.rpy文件，你可以在564行看到如下代码

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
## 读取和保存屏幕 #####################################################################
##
## 这些屏幕负责让用户保存游戏并能够再次读取。由于它们几乎完全一样，因此这两个屏
## 幕都是以第三个屏幕 file_slots 来实现的。
##
## https://doc.renpy.cn/zh-CN/screen_special.html#save https://doc.renpy.cn/zh-
## CN/screen_special.html#load
## 存档界面
screen save():

    tag menu

    use file_slots(_("保存"))

## 读档界面
screen load():

    tag menu

    use file_slots(_("读取游戏"))

## 调用的界面
screen file_slots(title):
## 当前页数，非必须
    default page_name_value = FilePageNameInputValue(pattern=_("第 {} 页"), auto=_("自动存档"), quick=_("快速存档"))
    ## 调用game_menu界面，非必须
    use game_menu(title):

        fixed:

            ## 此代码确保输入控件在任意按钮执行前可以获取 enter 事件。
            order_reverse True

            ## 页面名称，可以通过单击按钮进行编辑。
            button:
                style "page_label"

                key_events True
                xalign 0.5
                action page_name_value.Toggle()
                ## 可通过点击第几页实现页面跳转，非必须
                input:
                    style "page_label_text"
                    value page_name_value

            ## 存档位网格。
            grid gui.file_slot_cols gui.file_slot_rows:
                style_prefix "slot"

                xalign 0.5
                yalign 0.5

                spacing gui.slot_spacing

                for i in range(gui.file_slot_cols * gui.file_slot_rows):

                    $ slot = i + 1
                    ## 存档按钮
                    button:
                        action FileAction(slot)## 执行正确的行为，如果在存档界面则为存档，如果在读档界面则为读档

                        has vbox## vbox的另一种写法，省略了缩进

                        add FileScreenshot(slot) xalign 0.5## 添加屏幕快照
                        ## 存档时间，empty为空存档的名称
                        text FileTime(slot, format=_("{#file_time}%Y-%m-%d %H:%M"), empty=_("空存档位")):
                            style "slot_time_text"
                        ## 返回存档文件保存时的save_name，如果文件不存在则返回empty。
                        text FileSaveName(slot):
                            style "slot_name_text"
                        ## 键盘delete键删除存档
                        key "save_delete" action FileDelete(slot)

            ## 用于访问其他页面的按钮。
            vbox:
                style_prefix "page"

                xalign 0.5
                yalign 1.0

                hbox:
                    xalign 0.5

                    spacing gui.page_spacing

                    textbutton _("<") action FilePagePrevious() ## 上一页
                    key "save_page_prev" action FilePagePrevious() ## 键盘上一页翻页
                    ## 自动存档页
                    if config.has_autosave:
                        textbutton _("{#auto_page}A") action FilePage("auto")
                    ## 快速存档页
                    if config.has_quicksave:
                        textbutton _("{#quick_page}Q") action FilePage("quick")
                    ## 普通存档页页数
                    ## range(1, 10) 给出 1 到 9 之间的数字。
                    for page in range(1, 10):
                        textbutton "[page]" action FilePage(page)

                    textbutton _(">") action FilePageNext() ## 下一页
                    key "save_page_next" action FilePageNext() ## 键盘下一页翻页
                ## 上传下载存档，非必须
                if config.has_sync:
                    if CurrentScreenName() == "save":
                        textbutton _("上传同步"):
                            action UploadSync()
                            xalign 0.5
                    else:
                        textbutton _("下载同步"):
                            action DownloadSync()
                            xalign 0.5

## 存档读档界面所需样式
style page_label is gui_label
style page_label_text is gui_label_text
style page_button is gui_button
style page_button_text is gui_button_text

style slot_button is gui_button
style slot_button_text is gui_button_text
style slot_time_text is slot_button_text
style slot_name_text is slot_button_text

style page_label:
    xpadding 75
    ypadding 5

style page_label_text:
    textalign 0.5
    layout "subtitle"
    hover_color gui.hover_color

style page_button:
    properties gui.button_properties("page_button")

style page_button_text:
    properties gui.text_properties("page_button")

style slot_button:
    properties gui.button_properties("slot_button")

style slot_button_text:
    properties gui.text_properties("slot_button")


由于存档界面和读档界面并无太大差别，所以在Ren’py中，存档界面和读档界面都是调用第三个界面——file_slots来实现的，各部分的详细作用请查看上述注释

初步自定义

现在我们删去不必要的部分，添加些背景图像，并为存档添加描述，参考代码如下

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
## 读取和保存屏幕 #####################################################################
##
## 这些屏幕负责让用户保存游戏并能够再次读取。由于它们几乎完全一样，因此这两个屏
## 幕都是以第三个屏幕 file_slots 来实现的。
##
##引入必要模块

init python:
    import re

#存档界面
screen save():

    tag menu
    #存档界面背景图
    add "save_load_bg"
    #存档界面logo
    add "gui/button/save.png" zoom 1.5 yoffset 50

    fixed:
        ## 此语句确保输入控件在任意按钮执行前可以获取“enter”事件。
        order_reverse True

        ## 存档位网格。
        grid gui.file_slot_cols gui.file_slot_rows:
            style_prefix "slot" #该语句不可省略
            spacing 10
            align (0.7, 0.5)
            xoffset -10
            yoffset 25
            for i in range(gui.file_slot_cols * gui.file_slot_rows):

                $ slot = i + 1
                
                button:
                    
                    action FileAction(slot)
                    #存档按钮背景图
                    background "gui/button/slot_idle_background.png"
                    #存档按钮悬停图
                    hover_background "gui/button/slot_hover_background.png"
                    #添加屏幕快照缩略图
                    add FileScreenshot(slot) xysize(231,130) xoffset -3 yoffset 62
                    
                    vbox:
                        #时间
                        text FileTime(slot, format=_("{#file_time}%Y-%m-%d %H:%M"), empty=_("空存档")):
                            style "slot_time_text"
                            size 30
                        
                        frame:
                            background None
                            xysize(210,110)
                            xoffset 230
                            yoffset 20
                            #存档描述
                            text FileSaveName(slot):
                                size 25
                    
                    #添加存档描述，正则表达式，该语句只可用于存档界面
                    #(大佬给出的代码为固定的快速存档，会导致普通存档无法正常存档，将其修改为FileAction(slot)，执行正确的操作)
                    if len(_last_say_what) >15:
                        action [SetVariable("save_name", re.sub('(\{.*?\})|(\\\w)|\s', '', _last_say_what[:15])+"..."),FileAction(slot) ]
                    elif len(_last_say_what) > 0:
                        action [SetVariable("save_name", re.sub('(\{.*?\})|(\\\w)|\s', '', _last_say_what)),FileAction(slot) ]
                    else:
                        action FileAction(slot)

        ## 用于访问其他页面的按钮。
        hbox:
            style_prefix "page"

            xalign 0.8
            yalign 0.1
            spacing 20
            if config.has_autosave:
                textbutton _("{#auto_page}A") action FilePage("auto")

            if config.has_quicksave:
                textbutton _("{#quick_page}Q") action FilePage("quick")
            imagebutton:
                idle "gui/button/page1.png"
                hover "gui/button/page_hover1.png"
                selected_idle "gui/button/page_hover1.png"
                action FilePage(1)
            imagebutton:
                idle "gui/button/page2.png"
                hover "gui/button/page_hover2.png"
                selected_idle "gui/button/page_hover2.png"
                action FilePage(2)
            imagebutton:
                idle "gui/button/page3.png"
                hover "gui/button/page_hover3.png"
                selected_idle "gui/button/page_hover3.png"
                action FilePage(3)
            imagebutton:
                idle "gui/button/page4.png"
                hover "gui/button/page_hover4.png"
                selected_idle "gui/button/page_hover4.png"
                action FilePage(4)
            imagebutton:
                idle "gui/button/page5.png"
                hover "gui/button/page_hover5.png"
                selected_idle "gui/button/page_hover5.png"
                action FilePage(5)
            imagebutton:
                idle "gui/button/page6.png"
                hover "gui/button/page_hover6.png"
                selected_idle "gui/button/page_hover6.png"
                action FilePage(6)
            imagebutton:
                idle "gui/button/page7.png"
                hover "gui/button/page_hover7.png"
                selected_idle "gui/button/page_hover7.png"
                action FilePage(7)
            imagebutton:
                idle "gui/button/page8.png"
                hover "gui/button/page_hover8.png"
                selected_idle "gui/button/page_hover8.png"
                action FilePage(8)
            imagebutton:
                idle "gui/button/page9.png"
                hover "gui/button/page_hover9.png"
                selected_idle "gui/button/page_hover9.png"
                action FilePage(9)

    textbutton "返回":
        align (0.05, 0.95)
        text_color "#000"
        text_size 50
        action Return()

#读档界面
screen load():

    tag menu
    #读档界面背景图
    add "save_load_bg"
    #读档界面logo
    add "gui/button/load.png" zoom 1.5 yoffset 50

    fixed:
        ## 此语句确保输入控件在任意按钮执行前可以获取“enter”事件。
        order_reverse True

    
        ## 存档位网格。
        grid gui.file_slot_cols gui.file_slot_rows:
            style_prefix "slot" #该语句不可省略
            spacing 10
            align (0.7, 0.5)
            xoffset -10
            yoffset 25
            for i in range(gui.file_slot_cols * gui.file_slot_rows):

                $ slot = i + 1
                
                button:
                    
                    action FileAction(slot)
                    #存档按钮背景图
                    background "gui/button/slot_idle_background.png"
                    #存档按钮悬停图
                    hover_background "gui/button/slot_hover_background.png"
                    #添加屏幕快照缩略图
                    add FileScreenshot(slot) xysize(231,130) xoffset -3 yoffset 62
                    
                    vbox:
                        #时间
                        text FileTime(slot, format=_("{#file_time}%Y-%m-%d %H:%M"), empty=_("空存档")):
                            style "slot_time_text"
                            size 30
                        
                        frame:
                            background None
                            xysize(210,110)
                            xoffset 230
                            yoffset 20
                            #存档描述
                            text FileSaveName(slot):
                                size 25
                    #从标题界面进入读档界面无法获取_last_say_what,游戏会报错，因此将其删除


        ## 用于访问其他页面的按钮。
        hbox:
            style_prefix "page"

            xalign 0.8
            yalign 0.1
            spacing 20
            if config.has_autosave:
                textbutton _("{#auto_page}A") action FilePage("auto")

            if config.has_quicksave:
                textbutton _("{#quick_page}Q") action FilePage("quick")
            imagebutton:
                idle "gui/button/page1.png"
                hover "gui/button/page_hover1.png"
                selected_idle "gui/button/page_hover1.png"
                action FilePage(1)
            imagebutton:
                idle "gui/button/page2.png"
                hover "gui/button/page_hover2.png"
                selected_idle "gui/button/page_hover2.png"
                action FilePage(2)
            imagebutton:
                idle "gui/button/page3.png"
                hover "gui/button/page_hover3.png"
                selected_idle "gui/button/page_hover3.png"
                action FilePage(3)
            imagebutton:
                idle "gui/button/page4.png"
                hover "gui/button/page_hover4.png"
                selected_idle "gui/button/page_hover4.png"
                action FilePage(4)
            imagebutton:
                idle "gui/button/page5.png"
                hover "gui/button/page_hover5.png"
                selected_idle "gui/button/page_hover5.png"
                action FilePage(5)
            imagebutton:
                idle "gui/button/page6.png"
                hover "gui/button/page_hover6.png"
                selected_idle "gui/button/page_hover6.png"
                action FilePage(6)
            imagebutton:
                idle "gui/button/page7.png"
                hover "gui/button/page_hover7.png"
                selected_idle "gui/button/page_hover7.png"
                action FilePage(7)
            imagebutton:
                idle "gui/button/page8.png"
                hover "gui/button/page_hover8.png"
                selected_idle "gui/button/page_hover8.png"
                action FilePage(8)
            imagebutton:
                idle "gui/button/page9.png"
                hover "gui/button/page_hover9.png"
                selected_idle "gui/button/page_hover9.png"
                action FilePage(9)


    textbutton "返回":
        align (0.05, 0.95)
        text_color "#000"
        text_size 50
        action Return()




style page_label is gui_label
style page_label_text is gui_label_text
style page_button is gui_button
style page_button_text is gui_button_text

style slot_button is gui_button
style slot_button_text is gui_button_text
style slot_time_text is slot_button_text
style slot_name_text is slot_button_text

style page_label:
    xpadding 75
    ypadding 5

style page_label_text:
    textalign 0.5
    layout "subtitle"
    hover_color gui.hover_color

style page_button:
    properties gui.button_properties("page_button")

style page_button_text:
    properties gui.text_properties("page_button")

style slot_button:
    properties gui.button_properties("slot_button")

style slot_button_text:
    properties gui.text_properties("slot_button")

由于我是将存档界面和读档界面分开编写的，所以这部分代码仅供参考，如果你想沿用源代码，请自行修改

优化

其实到上一步我们的自定义就已经差不多完成了，但我们还可以在完善一下

存档编号

添加如下代码

1
2
3
4
#存档编号
text "NO."+FileSlotName(slot, gui.file_slot_cols * gui.file_slot_rows):
    align (1.0, 0.0)
    size 30

最新存档标识

添加如下代码

1
2
3
#最新存档标识(只记录普通存档页)
if FileNewest(slot):
    add "gui/button/newest.png" align (0.75, 0.0)

可添加一个transform组件，使最新存档标识连续闪烁

删除存档按钮

源代码中使用键盘delete键删除存档并不具备标识度，我们将其改为更明显的图像按钮，代码如下

1
2
3
4
5
6
7
#删除存档
imagebutton:
    xysize(120,30)
    align((1.0, 1.0))
    idle "gui/button/delate.png"
    hover"gui/button/delate_hover.png"
    action FileDelete(slot)

GUI

别忘了修改gui.rpy文件中220行左右如下代码

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
## 存档按钮 ########################################################################
##
## 存档按钮是一种特殊的按钮。它包含一个缩略图和描述该存档内容的文本。存档使用
## gui/button 中的图像文件，就像其他类型的按钮一样。

## 存档位按钮。
define gui.slot_button_width = 475
define gui.slot_button_height = 227
define gui.slot_button_borders = Borders(15, 15, 15, 15)
define gui.slot_button_text_size = 21
define gui.slot_button_text_xalign = 0.5
define gui.slot_button_text_idle_color = gui.idle_small_color
define gui.slot_button_text_selected_idle_color = gui.selected_color
define gui.slot_button_text_selected_hover_color = gui.hover_color

## 存档所用缩略图的宽度和高度。
define config.thumbnail_width = 384
define config.thumbnail_height = 216

## 存档网格中的列数和行数。
define gui.file_slot_cols = 3
define gui.file_slot_rows = 3


## 定位和间距 #######################################################################
##
## 这些变量控制各种用户界面元素的位置和间距。

## 导航按钮左侧相对于屏幕左侧的位置。
define gui.navigation_xpos = 60

## 快进指示器的垂直位置。
define gui.skip_ypos = 15

## 通知界面的垂直位置。
define gui.notify_ypos = 68

## 菜单选项之间的间距。
define gui.choice_spacing = 33

## 标题菜单和游戏菜单的导航部分中的按钮。
define gui.navigation_spacing = 6

## 控制设置项目之间的间隔量。
define gui.pref_spacing = 15

## 控制设置按钮之间的间距。
define gui.pref_button_spacing = 0

## 存档页面按钮之间的间距。
define gui.page_spacing = 0

## 存档按钮之间的间距。
define gui.slot_spacing = 15

## 标题菜单文本的位置。
define gui.main_menu_text_xalign = 1.0