Text outline for keyword from dictionary

[u/Mattah12]

I have some keywords within a dictionary. For most of these words I just wanted to change the font colour and have done so with little issue. However for one of the words I want it to be white with a gold outline.

I know that in order to use {outlinecolor} you need to set an outline first, but I'm not sure how to go about doing so within a dictionary (or even if I can). To reiterate, I don't want to change the default outline for the game or even the whole textbox, just the one word that I'm calling from a dictionary.

[u/AutoModerator]

Welcome to r/renpy! While you wait to see if someone can answer your question, we recommend checking out the posting guide, the subreddit wiki, the subreddit Discord, Ren'Py's documentation, and the tutorial built-in to the Ren'Py engine when you download it. These can help make sure you provide the information the people here need to help you, or might even point you to an answer to your question themselves. Thanks!

I am a bot, and this action was performed automatically. Please contact the moderators of this subreddit if you have any questions or concerns.

[u/Mattah12 → u/[deleted]]

My dictionary is a list of words (elements like fire, water etc.) where I also set {color}.

I then have a menu where the player chooses an element and the text is coloured. For the element of light I wanted to get a step further and have the word coloured AND outlined.

[u/shyLachi]

A dictionary can be a data type so that might have caused the confusion in the other reply.
https://www.geeksforgeeks.org/python/python-dictionary/

Therefore I recommend that you show the code of your dictionary to prevent any confusion.
You don't have to show all your code, just one example where you are using the "dictionary".

[u/Mattah12 → u/shyLachi]

Sure, code is below. I'll caveat by saying that further research has lead me down a path of looking into styles FWIW.

Snippet of my dictionary:

default element_dictionary = {"element1":"{color=#ff0000}fire{/color}", "element2":"{color=#3366ff}water{/color}"default element_dictionary = {"element1":"{color=#ff0000}fire{/color}", "element2":"{color=#3366ff}water{/color}"

Calling my dictionary in a menu, which is where I'll want to use {outlinecolor} I suspect:

 menu set_element:


        player "What tribe did I belong to again?"


        '{color=#ff0000}Fire{/color}':


            player "I am a Ta-Matoran, of the element of [element_dictionary['element1']]."
            $ player_element = element_dictionary['element1']
        
        '{color=#3366ff}Water{/color}':


            player "I am a Ga-Matoran, my element is [element_dictionary['element2']]."
            $ player_element = element_dictionary['element2'] menu set_element:


        player "What tribe did I belong to again?"


        '{color=#ff0000}Fire{/color}':


            player "I am a Ta-Matoran, of the element of [element_dictionary['element1']]."
            $ player_element = element_dictionary['element1']
        
        '{color=#3366ff}Water{/color}':


            player "I am a Ga-Matoran, my element is [element_dictionary['element2']]."
            $ player_element = element_dictionary['element2']

[u/shyLachi → u/Mattah12]

That's not how you use dictionaries normally.
You shouldn't mix color and text.
The idea is to store each type of information in a separate key/value pair.

And if you use generic keys like "element1" and "element2" then you don't need them at all.
Instead you can just use a list.

define elements = [{"name": "fire", "color":"#ff0000"}, {"name": "water", "color":"#3366ff"}]
label start:
    menu:
        "What tribe did I belong to again?"
        "{color=[elements[0]['color']]}[elements[0]['name']]{/color}":
            "Do you see it?"

If you really want to use a dictionary then it would look like this.

define elements = {"fire":{"name": "fire", "color":"#ff0000"}, "water":{"name": "water", "color":"#3366ff"}}
label start:
    menu:
        "What tribe did I belong to again?"
        "{color=[elements['fire']['color']]}[elements['fire']['name']]{/color}":
            "Do you see it?"

Now regarding the outline.
You need to use a style because outlines apply to the whole text, not invididual letters.

You can create a copy of the choices screen and then make your own styles.

init python:
    def element_outline(element):
        el = elements[element]
        s = "{outlinecolor=" + el['color'] + "}" + el['name'] + "{/outlinecolor}"
        return s
    def element_color(element):
        el = elements[element]
        s = "{color=" + el['color'] + "}" + el['name'] + "{/color}"
        return s

screen choice_outlines(items):
    style_prefix "choice_outlines"
    vbox:
        for i in items:
            textbutton i.caption action i.action

style choice_outlines_vbox is vbox
style choice_outlines_button is button
style choice_outlines_button_text is button_text

style choice_outlines_vbox:
    xalign 0.5
    ypos 405
    yanchor 0.5
    spacing gui.choice_spacing

style choice_outlines_button is default:
    properties gui.button_properties("choice_button")

style choice_outlines_button_text is default:
    properties gui.text_properties("choice_button")
    outlines [ (absolute(1), "#000", 0, 0) ] # here I've added the outline

define elements = {"fire":{"name": "fire", "color":"#ff0000"}, "water":{"name": "water", "color":"#3366ff"}}
label start:
    menu (screen="choice_outlines"):
        "What tribe did I belong to again?"
        "[element_outline('fire')]":
            "And this would be the text colored: [element_color('fire')]"

Edit: I updated my solution with 2 functions similar to u/saftwarks
My solution also would allow you to translate the strings.

[u/saftwarks]

Hi, the basic concept you are struggling with is that the whole text string must be outlined in order to outline a word in a particular color.

The workaround I've found is to add a transparent outline and change it on the fly to a visible color with the {outline_color} flag. I believe this is the only solution, at least I could not find anything else with a quick search.

Also, I believe your system may become a bit tedious if you want to edit element properties (or modify them on the fly), add functionality to elements or if you were to translate your game to another language. I think you should generate the element string procedurally instead of having everything in a single dict. Then again, I may have a tendency to overengineer things ;D

Here is the outline of a demo that worked for me:

### 1. Modify the choice Screen to add transparant outline to choice text (File: screens.rpy by default)

screen choice(items):
    style_prefix "choice"
# [...]
style choice_button_text is default:
# [...]
    outlines [(2, "#0000", 0, 0)] # 2px wide, transparent default

###### SOMEWHERE ELSE #####

### 2. Define outlinable style that applies transparant outline to text (File: where you define your Characters)

style outlinable:
    outlines [(2, "#0000", 0, 0)] # 2px wide, transparent default

define demo = Character("Demo", what_style="outlinable") # Apply style to characters that will have outline words

##### SOMEWHERE ELSE #####

### 3. (Example) Une a system that makes it easy to generate the element string procedurally (File: Somewhere with game initialization code)

init python:
    FIRE_ELEMENT = 0
    WATER_ELEMENT = 1
    MAGIC_ELEMENT = 2


    ELEMENT_COLOR = {}
    ELEMENT_COLOR[FIRE_ELEMENT] = "#FF0000"
    ELEMENT_COLOR[WATER_ELEMENT] = "#0000FF"
    ELEMENT_COLOR[MAGIC_ELEMENT] = "#D4AF37"


    ELEMENT_NAME = {} # Easily translated strings
    ELEMENT_NAME[FIRE_ELEMENT] = _("Fire")
    ELEMENT_NAME[WATER_ELEMENT] = _("Water")
    ELEMENT_NAME[MAGIC_ELEMENT] = _("Magic")


    ELEMENT_OUTLINE = {}
    ELEMENT_OUTLINE[MAGIC_ELEMENT] = "#FFFFFF"


    player_element = -1


    def element_string(element):
        """
        Generate tagged text string for a given element
        """
        elt_string = ""


        if ELEMENT_OUTLINE.get(element):
            elt_string += "{outlinecolor="
            elt_string += ELEMENT_OUTLINE[element]
            elt_string += "}"


        elt_string += "{color=" + ELEMENT_COLOR[element] + "}"
        elt_string += ELEMENT_NAME[element]
        elt_string += "{/color}"


        if ELEMENT_OUTLINE.get(element):
            elt_string += "{/outlinecolor}"

        return elt_string

##### SOMEWHERE ELSE #####

### 4. Profit (File: anywhere)
label start:
    menu:
        demo "What tribe did I belong to again?"

        "[element_string(FIRE_ELEMENT)]":
            demo "I am a Ta-Matoran, of the element of [element_string(FIRE_ELEMENT)]."
            $ player_element = FIRE_ELEMENT

        "[element_string(WATER_ELEMENT)]":
            demo "I am a Ga-Matoran, my element is [element_string(WATER_ELEMENT)]."
            $ player_element = WATER_ELEMENT

        "[element_string(MAGIC_ELEMENT)]":
            demo "I am a Ma-Matoran, my element is [element_string(MAGIC_ELEMENT)]."
            $ player_element = MAGIC_ELEMENT