小小小编程 | Renpy游戏开发 | 通识篇：软件基础 | 基础：GUI定制

本节目录

1. 1.主界面
   1. (1)预设样式位置
   2. (2)自定义修改与添加
2. 2.游戏界面
   1. (1)对话框
   2. (2)选项界面
   3. (3)快捷菜单
3. 3.历史界面
4. 4.系统设置界面
5. 5.SL界面
6. 6.常用功能美化
   1. (1)鼠标指针主题
   2. (2)游戏图标

1.主界面

(1)预设样式位置

• 1)renpy预设的主界面图片包括主图./game/gui/main_menu.png及侧边栏图片./game/gui/main_menu.png。
  • 可直接对主图进行图片替换；侧边栏图片的调用在初始脚本screens.rpy约379行background "gui/overlay/main_menu.png"，可删除/注释这句代码。
• 2)renpy预设的主界面菜单按钮在初始脚本screens.rpy约354行，可对下面这部分代码进行注释。

    ## use 语句将其他的屏幕包含进此屏幕。标题屏幕的实际内容在导航屏幕中。
    use navigation

    if gui.show_name:

        vbox:
            style "main_menu_vbox"

            text "[config.name!t]":
                style "main_menu_title"

            text "[config.version]":
                style "main_menu_version"

• 3)替换删除的效果如下：
  • 

(2)自定义修改与添加

• 1)主界面图片的基本样式修改，可在初始脚本screens.rpy约343行screen main_menu():下对add gui.main_menu_background的样式进行进一步修改，如：

# 其它代码省略
screen main_menu():
    add gui.main_menu_background:
        # 图片缩放至原来的一半
        zoom 0.5

• 2)添加主界面按钮（开始游戏、读取进度、环境设置、其它内容）：应先准备好对应的图片素材放在合理位置，再在初始脚本screens.rpy约354行重新进行UI添加：
  • 

# 其余代码省略
screen main_menu():
# 该脚本原本自带的其它代码省略
		# UI内容纵向排列
    vbox:
        # 调整该UI中各个按钮的位置和距离
        spacing 20
        xalign 0.1
        yalign 0.85
        # 开始按钮
        imagebutton:
            idle "gui/button/start_game.png"
            hover "gui/button/start_game_hover.png"
            action Start()
        # 读取进度按钮
        imagebutton:
            idle "gui/button/get_in.png"
            hover "gui/button/get_in_hover.png"
            action ShowMenu("load")
        # 环境设置按钮
        imagebutton:
            idle "gui/button/set_up.png"
            hover "gui/button/set_up_hover.png"
            action ShowMenu("preferences")
        # 此处预留一cg回想占位符，暂不可点击，后续填充内容
        add "gui/button/extra_what.png":
            alpha 0.5

• 3)可以为按钮添加动画效果，定义动画效果相关的函数，并使用at [动画效果函数名]进行调用，例如：
  • 

# 可以创建一个新脚本文件管理这些动画效果cimagetrans.rpy
# 这里设置了一个滑动渐入效果
transform main_menu_show_btn(wait = 0):
    xoffset 100
    alpha 0.0
    pause(wait)
    easein 0.45 xoffset 0 alpha 1

# 脚本screens.rpy
# 其余代码省略
screen main_menu():
# 该脚本原本自带的其它代码省略
		# UI内容纵向排列
    vbox:
        # 调整该UI中各个按钮的位置和距离
        spacing 20
        xalign 0.1
        yalign 0.85
        # 开始按钮
        imagebutton:
            idle "gui/button/start_game.png"
            hover "gui/button/start_game_hover.png"
            # 调用此动画方法
            at main_menu_show_btn(0.3)
            action Start()
        # 读取进度按钮
        imagebutton:
            idle "gui/button/get_in.png"
            hover "gui/button/get_in_hover.png"
            at main_menu_show_btn(0.4)
            action ShowMenu("load")
        # 环境设置按钮
        imagebutton:
            idle "gui/button/set_up.png"
            hover "gui/button/set_up_hover.png"
            at main_menu_show_btn(0.5)
            action ShowMenu("preferences")
        # 此处预留一cg回想占位符，不可点击，后续填充内容
        add "gui/button/extra_what.png":
            at main_menu_show_btn(0.6)
            alpha 0.5

2.游戏界面

(1)对话框

• 1)renpy预设的对话框图片包括对话内容框./game/gui/textbox.png和对话人姓名框./game/gui/namebox.png，可直接对该图进行图片替换。
  • 对话人姓名框默认会根据内容长度调整框体长度，可在初始脚本screens.rpy约85行对话屏幕部分进行调整，例如：

# 部分代码省略

            window:
                id "namebox"
                style "namebox"
                # 原始代码为 text who id "who" 进行微调，适应namebox的表现效果
                text who id "who" xoffset 45 yoffset -8

# 其余原始代码省略

# 对话框样式
style window:
    xalign 0.5
    xfill True
    yalign gui.textbox_yalign
    ysize gui.textbox_height

    background Image("gui/textbox.png", xalign=0.5, yalign=1.0)

# 姓名框样式
style namebox:
    xpos gui.name_xpos
    xanchor gui.name_xalign
    # 原始代码为 xsize gui.namebox_width，可将namebox的size改为固定，防止其自适应角色名字长短变化
    xsize 235
    ypos gui.name_ypos
    # 同理，如果需要，可以将宽度也改为固定值
    ysize gui.namebox_height
    # 可以添加y轴偏移量微调
    yoffset -60

    background Frame("gui/namebox.png", gui.namebox_borders, tile=gui.namebox_tile, xalign=gui.name_xalign)
    padding gui.namebox_borders.padding

style say_label:
    properties gui.text_properties("name", accent=True)
    xalign gui.name_xalign
    yalign 0.5

style say_dialogue:
    properties gui.text_properties("dialogue")

    xpos gui.dialogue_xpos
    xsize gui.dialogue_width
    ypos gui.dialogue_ypos

    adjust_spacing False

(2)选项界面

• 1)renpy预设的分支选项框图片包括默认显示图片./game/gui/button/choice_idle_background.png及悬停点击时显示图片./game/gui/button/choice_hover_background.png，可直接对该图进行图片替换。
• 2)renpy预设的分支选项框的属性设置在初始脚本gui.rpy约191行如下部分，可对属性进行简单修改操作。

## 选项按钮 ########################################################################
##
## 游戏内菜单使用的选项按钮。

# 选项按钮的固定宽度
define gui.choice_button_width = 1185
# 选项按钮的固定高度
define gui.choice_button_height = None
# 按钮背景是否平铺
define gui.choice_button_tile = False
# 按钮背景九宫格边框
define gui.choice_button_borders = Borders(150, 8, 150, 8)
# 选项按钮文本字体
define gui.choice_button_text_font = gui.text_font
# 选项按钮文本字号
define gui.choice_button_text_size = gui.text_size
# 选项按钮x轴位置
define gui.choice_button_text_xalign = 0.5
# 选项按钮默认颜色
define gui.choice_button_text_idle_color = '#707070'
# 选项按钮悬停时颜色
define gui.choice_button_text_hover_color = "#ffffff"
# 选项按钮不可用状态颜色
define gui.choice_button_text_insensitive_color = '#7070707f'

• 3)renpy预设的分支选项框的动画控制位置在初始脚本screens.rpy约201行如下部分，可在这部分进行动画添加等操作。

screen choice(items):
    style_prefix "choice"

    # 控制分支选项，可在这部分添加需要的效果
    vbox:
        for i in items:
            textbutton i.caption action i.action

(3)快捷菜单

• 1)预设样式位置：renpy预设的放在对话框下方的快捷菜单QuickMenu为文本按钮，在初始脚本screen.rpy约231行screen quick_menu():部分中定义了这些文本按钮。
  • 

# 原始代码
screen quick_menu():

    ## 确保该菜单出现在其他屏幕之上，
    zorder 100

    if quick_menu:

        hbox:
            style_prefix "quick"
            style "quick_menu"

            textbutton _("回退") action Rollback()
            textbutton _("历史") action ShowMenu('history')
            textbutton _("快进") action Skip() alternate Skip(fast=True, confirm=True)
            textbutton _("自动") action Preference("auto-forward", "toggle")
            textbutton _("保存") action ShowMenu('save')
            textbutton _("快存") action QuickSave()
            textbutton _("快读") action QuickLoad()
            textbutton _("设置") action ShowMenu('preferences')

• 2)自定义修改与添加：常见做法是将原本的文本按钮替换为图片按钮，准备好对应的图片（含默认状态、悬停状态、点击状态、持续点击状态、对应点击音效等）放到合理位置，图片大小根据实际需求调整（图中大小为50宽度），设置UI布局方式之后会自动排列，不会出现重叠问题。
  • 

# 只包含此快捷菜单部分代码
screen quick_menu():

    ## 确保该菜单出现在其他屏幕之上，
    zorder 100

    if quick_menu:

        hbox:
            style_prefix "quick"
            style "quick_menu"

            # 以下为修改的部分

            # 回退按钮
            imagebutton:
                idle "gui/quick_menu/btn_back_base.png" # idle 鼠标不在按钮上的样式
                hover "gui/quick_menu/btn_back_onMouse.png" # hover 鼠标放在按钮上的样式
                selected_hover "gui/quick_menu/btn_back_onClick.png" # selected_hover 鼠标点击时的样式
                hover_sound "voice/effect/music_btn_back_onMouse.ogg" # hover_sound 鼠标放在按钮上的音效
                activate_sound "voice/effect/music_btn_back_onClick.ogg" # activate_sound 鼠标点击时的音效
                action Rollback()

            # 历史按钮
            imagebutton:
                idle "gui/quick_menu/btn_history_base.png" # idle 鼠标不在按钮上的样式
                hover "gui/quick_menu/btn_history_onMouse.png" # hover 鼠标放在按钮上的样式
                selected_hover "gui/quick_menu/btn_history_onClick.png" # selected_hover 鼠标点击时的样式
                hover_sound "voice/effect/music_btn_history_onMouse.ogg" # hover_sound 鼠标放在按钮上的音效
                activate_sound "voice/effect/music_btn_history_onClick.ogg" # activate_sound 鼠标点击时的音效
                action ShowMenu('history')

            # 快进按钮
            ## 快进和自动属于要保存状态的按钮，多一个 selected_idle 特性
            imagebutton:
                idle "gui/quick_menu/btn_skip_base.png"
                hover "gui/quick_menu/btn_skip_onMouse.png"
                selected_hover "gui/quick_menu/btn_skip_onClick.png"
                selected_idle "gui/quick_menu/btn_skip_Clicked.png" # 快进是一个持续的状态（启用时一直高亮） selected_idle 表示点击后持续展示这个图标
                hover_sound "voice/effect/music_btn_skip_onMouse.ogg"
                activate_sound "voice/effect/music_btn_skip_onClick.ogg"
                action Skip() alternate Skip(fast=True, confirm=True)

            # 自动按钮
            ## 快进和自动属于要保存状态的按钮，多一个 selected_idle 特性
            imagebutton:
                idle "gui/quick_menu/btn_auto_base.png"
                hover "gui/quick_menu/btn_auto_onMouse.png"
                selected_hover "gui/quick_menu/btn_auto_onClick.png"
                selected_idle "gui/quick_menu/btn_auto_Clicked.png" # 快进是一个持续的状态（启用时一直高亮） selected_idle 表示点击后持续展示这个图标
                hover_sound "voice/effect/music_btn_auto_onMouse.ogg"
                activate_sound "voice/effect/music_btn_auto_onClick.ogg"
                action Preference("auto-forward", "toggle")

            # 存档按钮
            imagebutton:
                idle "gui/quick_menu/btn_save_base.png" # idle 鼠标不在按钮上的样式
                hover "gui/quick_menu/btn_save_onMouse.png" # hover 鼠标放在按钮上的样式
                selected_hover "gui/quick_menu/btn_save_onClick.png" # selected_hover 鼠标点击时的样式
                hover_sound "voice/effect/music_btn_save_onMouse.ogg" # hover_sound 鼠标放在按钮上的音效
                activate_sound "voice/effect/music_btn_save_onClick.ogg" # activate_sound 鼠标点击时的音效
                action ShowMenu("game_save") # 这里是另外定义了save界面，如使用原本的save界面则写为action ShowMenu("save")

            # 快存按钮
            imagebutton:
                idle "gui/quick_menu/btn_qsave_base.png" # idle 鼠标不在按钮上的样式
                hover "gui/quick_menu/btn_qsave_onMouse.png" # hover 鼠标放在按钮上的样式
                selected_hover "gui/quick_menu/btn_qsave_onClick.png" # selected_hover 鼠标点击时的样式
                hover_sound "voice/effect/music_btn_qsave_onMouse.ogg" # hover_sound 鼠标放在按钮上的音效
                activate_sound "voice/effect/music_btn_qsave_onClick.ogg" # activate_sound 鼠标点击时的音效
                action QuickSave()

            # 快读按钮
            imagebutton:
                idle "gui/quick_menu/btn_qload_base.png" # idle 鼠标不在按钮上的样式
                hover "gui/quick_menu/btn_qload_onMouse.png" # hover 鼠标放在按钮上的样式
                selected_hover "gui/quick_menu/btn_qload_onClick.png" # selected_hover 鼠标点击时的样式
                hover_sound "voice/effect/music_btn_qload_onMouse.ogg" # hover_sound 鼠标放在按钮上的音效
                activate_sound "voice/effect/music_btn_qload_onClick.ogg" # activate_sound 鼠标点击时的音效
                action QuickLoad()

            # 系统设置按钮
            imagebutton:
                idle "gui/quick_menu/btn_prefs_base.png" # idle 鼠标不在按钮上的样式
                hover "gui/quick_menu/btn_prefs_onMouse.png" # hover 鼠标放在按钮上的样式
                selected_hover "gui/quick_menu/btn_prefs_onClick.png" # selected_hover 鼠标点击时的样式
                hover_sound "voice/effect/music_btn_prefs_onMouse.ogg" # hover_sound 鼠标放在按钮上的音效
                activate_sound "voice/effect/music_btn_prefs_onClick.ogg" # activate_sound 鼠标点击时的音效
                action ShowMenu('preferences')

3.历史界面

• (1)重写历史界面：renpy关于历史界面的部分位于初始脚本screens.rpy约869行历史屏幕部分，这部分如果需要自定义修改，建议仿照原有代码逻辑，重写界面。
  • 参考 https://lucylcarus.github.io/posts/39e7251c.html

## 历史屏幕 ########################################################################
##
## 这是一个向用户显示对话历史的屏幕。虽然此屏幕没有什么特别之处，但它必须访问储
## 存在 _history_list 中的对话历史记录。
##
## https://www.renpy.cn/doc/history.html

screen history():

    tag menu

    ## 避免预缓存此屏幕，因为它可能非常大。
    predict False
    #添加历史记录背景图
    add "history_bg.png"
    frame:
        style"history_frame_style"
        frame:
            style"history_window_frame_style"

            vpgrid id "history_list":
                #行数
                cols 1
                #视口初始垂直偏移量
                yinitial 1.0

                mousewheel True
                draggable True
                pagekeys True
                
                side_xfill True

                for h in _history_list:
                    
                    window:
                        # 背景默认为对话框
                        background None
                        # 高度
                        ysize 200
                        
                        if h.who:
                            
                            # 角色名字
                            label h.who:
                                xoffset 100
                                substitute False
                                text_color "#fff"
                                text_outlines [(3, "#000000", 0, 0)]

                        # 历史记录
                        $ what = renpy.filter_text_tags(h.what, allow=gui.history_allow_tags)
                        text what:
                            color "#ffffff"
                            outlines [(3, "#000000", 0, 0)]
                            xoffset 250
                
                if not _history_list:
                    label _("尚无对话历史记录。")


    # 滚动条
    vbar:
        xsize 44
        ysize 570
        align (0.95, 0.5)
        base_bar "history_bar.png"
        thumb Frame("thumb.png",xysize=(44,44))
        thumb_offset 14
        value YScrollValue("history_list")


    # 返回按钮
    imagebutton:
        align (0.95, 0.9)
        idle "return.png"
        hover "return_hover.png"
        action Return()

    # 跳转按钮  
    imagebutton:  
        idle "jump.png"  
        hover "jump_hover.png"  
        action Confirm("确定要跳转到该处吗？",yes=RollbackToIdentifier(h.rollback_identifier), no=None, confirm_selected=False)

#新添加样式  
style history_frame_style:
    left_padding 200 #左边距
    right_padding 0 #右边距

style history_window_frame_style:
    top_padding 185 #顶部边距
    bottom_padding 150 #底部边距
    xfill True

## 此代码决定了允许在历史记录屏幕上显示哪些标签。

define gui.history_allow_tags = { "alt", "noalt", "rt", "rb", "art" }


style history_window is empty

style history_name is gui_label
style history_name_text is gui_label_text
style history_text is gui_text

style history_label is gui_label
style history_label_text is gui_label_text

style history_window:
    xfill True
    ysize gui.history_height

style history_name:
    xpos gui.history_name_xpos
    xanchor gui.history_name_xalign
    ypos gui.history_name_ypos
    xsize gui.history_name_width

style history_name_text:
    min_width gui.history_name_width
    textalign gui.history_name_xalign

style history_text:
    xpos gui.history_text_xpos
    ypos gui.history_text_ypos
    xanchor gui.history_text_xalign
    xsize gui.history_text_width
    min_width gui.history_text_width
    textalign gui.history_text_xalign
    layout ("subtitle" if gui.history_text_xalign else "tex")

style history_label:
    xfill True

style history_label_text:
    xalign 0.5

# 上述代码中还可以实现在历史对话中显示对应说话人的头像
# 添加头像，如果你在对话框中的头像合适的话，可以直接写为side [h.image_tag]
# (但大多数情况下是不合适的)
if h.image_tag:
    add "[h.image_tag]_side.png" xysize (100,100) xoffset 90 yoffset 50

4.系统设置界面

• (1)renpy关于系统设置界面的部分位于初始脚本screens.rpy约710行设置屏幕部分，这部分如果需要自定义修改，建议仿照原有代码逻辑，重写系统设置界面界面。

5.SL界面

• (1)renpy关于存读档界面的部分位于初始脚本screens.rpy约566行读取和保存屏幕部分，这部分如果需要自定义修改，建议仿照原有代码逻辑，重写存档界面和读档界面。
  • 参考 https://lucylcarus.github.io/posts/39e7251c.html

## 读取和保存屏幕 #####################################################################
##
## 这些屏幕负责让用户保存游戏并能够再次读取。由于它们几乎完全一样，因此这两个屏
## 幕都是以第三个屏幕 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")

6.常用功能美化

(1)鼠标指针主题

• 1)准备好鼠标指针图片（建议大小64×64/128×128），放在合理位置，在初始脚本screens.rpy中合适位置写入代码define config.mouse = {'default' :[('images/mouse.png【图片位置】', 0, 0)]}，此鼠标指针将在全局生效。
  • 

(2)游戏图标

• 1)主程序执行图标：准备好游戏程序图标图片（格式必须为.ico，建议大小128×128，无内容部分透明处理），命名为icon.ico放在与game同层级的base文件夹（根文件夹）下，此时打包游戏时将使用该图片作为程序执行图标。
  • 若为安卓端的主程序执行图标，只需要准备好图片命名为android-icon_background.png和android-icon_foreground.png放在base文件夹（根文件夹）下即可。
• 2)任务栏图标：准备好游戏图片，替换./game/gui/window_icon.png图片内容，注意图片大小，建议大小250×250。