How to add different styles to diffrent menu?

[AnnieJuraski]

I want main_menu to have different font effect from preferences menu... How to achieve that? I tried change this, but it change all menu:

Code: Select all

define gui.button_text_font = "KOMIKAHB.ttf"
define gui.button_text_outlines = [ (4, "#00000034", 7, 7), (4, "#a30000ff", 3, 3) ]

And I also want to change the font where it is written "velocidade do texto" (equivalent to text speed) in the attachment. How to change that?

[jeffster]

I want main_menu to have different font effect from preferences menu... How to achieve that? I tried change this, but it change all menu:

Code: Select all

define gui.button_text_font = "KOMIKAHB.ttf"
define gui.button_text_outlines = [ (4, "#00000034", 7, 7), (4, "#a30000ff", 3, 3) ]

And I also want to change the font where it is written "velocidade do texto" (equivalent to text speed) in the attachment. How to change that?

You need to learn how "style properties" work.

Run Ren'Py SDK Launcher and select "Tutorial".
Launch it.
Start the Tutorial game, and soon you will see the menu with
Styles and Style Properties

Then you will know how to use "style" and "style_prefix" to modify several text labels at once, and how to add individual style properties to one text label.

For example, in file "screens.rpy" there is a line

Code: Select all

                    label _("Text Speed")

You can change its font individually:

Code: Select all

                    label _("Text Speed") text_font "KOMIKAHB.ttf"

And you can change the font for many labels at once. E.g. find these lines:

Code: Select all

style pref_label_text:
    yalign 1.0

and add a new style property "font":

Code: Select all

style pref_label_text:
    yalign 1.0
    font "KOMIKAHB.ttf"

[AnnieJuraski]

I want main_menu to have different font effect from preferences menu... How to achieve that? I tried change this, but it change all menu:

Code: Select all

define gui.button_text_font = "KOMIKAHB.ttf"
define gui.button_text_outlines = [ (4, "#00000034", 7, 7), (4, "#a30000ff", 3, 3) ]

And I also want to change the font where it is written "velocidade do texto" (equivalent to text speed) in the attachment. How to change that?

You need to learn how "style properties" work.

Run Ren'Py SDK Launcher and select "Tutorial".
Launch it.
Start the Tutorial game, and soon you will see the menu with
Styles and Style Properties

Then you will know how to use "style" and "style_prefix" to modify several text labels at once, and how to add individual style properties to one text label.

For example, in file "screens.rpy" there is a line

Code: Select all

                    label _("Text Speed")

You can change its font individually:

Code: Select all

                    label _("Text Speed") text_font "KOMIKAHB.ttf"

And you can change the font for many labels at once. E.g. find these lines:

Code: Select all

style pref_label_text:
    yalign 1.0

and add a new style property "font":

Code: Select all

style pref_label_text:
    yalign 1.0
    font "KOMIKAHB.ttf"

This helped with one question, but I still trying how to customize main_menu independent from other menu.


I removed use navigation andd added this:

Code: Select all

screen main_menu():

    ## Isso garante que qualquer outra tela de menu seja substituída.
    tag menu

    add gui.main_menu_background

    ## Esse quadro vazio escurece o menu principal.
    frame:
        style "main_menu_frame"
        

    ## A instrução de uso inclui outra tela dentro desta. O conteúdo real do
    ## menu principal está na tela de navegação.
    #use navigation
    
    vbox:
        style_prefix "navigation"
        style "main_menu_button"
        
        yalign 0.85
        xalign 0.5

        spacing gui.navigation_spacing

        if main_menu:

            textbutton _("Início") action Start()

        else:

            textbutton _("Histórico") action ShowMenu("history")

            textbutton _("Salvar") action ShowMenu("save")

        textbutton _("Carregar") action ShowMenu("load")

        textbutton _("Preferências") action ShowMenu("preferences")

        if _in_replay:

            textbutton _("Fim da reprodução") action EndReplay(confirm=True)

        elif not main_menu:

            textbutton _("Menu principal") action MainMenu()

        textbutton _("Sobre") action ShowMenu("about")

        if renpy.variant("pc") or (renpy.variant("web") and not renpy.variant("mobile")):

            ## A ajuda não é necessária ou relevante para dispositivos móveis.
            textbutton _("Ajuda") action ShowMenu("help")

        if renpy.variant("pc"):

            ## O botão Sair é proibido no iOS e desnecessário no Android e na
            ## Web.
            textbutton _("Sair") action Quit(confirm=not main_menu)

    



    if gui.show_name:

        vbox:
            style "main_menu_vbox"

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

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

Also I created a custom style and don't know how to use it

Code: Select all

style main_menu_button:
    font "fonts/KOMIKAHB.ttf"
    outlines [ (4, "#00000034", 7, 7), (4, "#a30000ff", 3, 3) ]
    size 25

[jeffster]

Style properties here are text properties:

Code: Select all

style main_menu_button:
    font "fonts/KOMIKAHB.ttf"
    outlines [ (4, "#00000034", 7, 7), (4, "#a30000ff", 3, 3) ]
    size 25

Here you assign those text properties to a vbox:

Code: Select all

    vbox:
        style_prefix "navigation"
        style "main_menu_button"

It's incorrect. vbox doesn't have text properties.

You can do this:

Code: Select all

    vbox:
        style_prefix "main_menu"

Then text in that vbox will have style "main_menu_text".
(It's style_prefix + "_text").

Therefore try to name that style "main_menu_text":

Code: Select all

style main_menu_text:
    font "fonts/KOMIKAHB.ttf"
    outlines [ (4, "#00000034", 7, 7), (4, "#a30000ff", 3, 3) ]
    size 25

To check which elements have which styles and properties, use "Shift+I Style Inspecting"
https://renpy.org/doc/html/developer_to ... inspecting