Ren'Py Blurry text for tips in a screen

[Six Fingers]

Is it possible to make a text blurry in a screen and once the player click on it, the normal text shows?

The idea is to show tips in the events screen and i would like to hide the tips for the adventures players. And is it possible to add a toggle button for it?

Any help will be appreciated
Thank you

 

[79flavors]

I assume you're talking about RenPy?

If so... yes.

I've not done it, but I can imagine something like:

screen just_testing():
    imagebutton:
        idle im.Blur("/images/tooltip1.png", 3.0)
        hover "/images/tooltip1.png"
        action NullAction()

This is just off the top of my head, without testing. So it may need some tweaking.

But this example (at least in my head) would show a blurred image as a button until the player moved their mouse over it, at which point it would become clear. There'd be a lot more work to position things and make them look how you want. Perhaps there would be multiple buttons and vboxes and stuff. Once you know it's possible, everything else is just implementation.

You could probably be more creative, with the action being to swap two values which exchange the blurred image for the non-blurred version when it is clicked. But the theory is there to prove something could be done.

 

[Six Fingers]

I assume you're talking about RenPy?

If so... yes.

I've not done it, but I can imagine something like:

screen just_testing():
    imagebutton:
        idle im.Blur("/images/tooltip1.png", 3.0)
        hover "/images/tooltip1.png"
        action NullAction()

This is just off the top of my head, without testing. So it may need some tweaking.

But this example (at least in my head) would show a blurred image as a button until the player moved their mouse over it, at which point it would become clear. There'd be a lot more work to position things and make them look how you want. Perhaps there would be multiple buttons and vboxes and stuff. Once you know it's possible, everything else is just implementation.

You could probably be more creative, with the action being to swap two values which exchange the blurred image for the non-blurred version when it is clicked. But the theory is there to prove something could be done.

thanks a lot this will help. but thats for imagebutton, is there something for plain text?

 

[anne O'nymous]

The idea is to show tips in the events screen and i would like to hide the tips for the adventures players.

Then why not just showing the text only when needed ?

Instead of a permanent blurred text that is unblurred only when "this" happen, you've a text that is permanently not shown, except when "this" happen.

screen whatever():
    vbox:

        imagebutton:
            {...]
            tooltip "Hello there"

        textbutton "whatever":
            [...]
            tooltip "Hello there"


    $ tt = GetTooltip()
    if tt:
        text "[tt]"

 

[Six Fingers]

Then why not just showing the text only when needed ?

Instead of a permanent blurred text that is unblurred only when "this" happen, you've a text that is permanently not shown, except when "this" happen.

screen whatever():
    vbox:

        imagebutton:
            {...]
            tooltip "Hello there"

        textbutton "whatever":
            [...]
            tooltip "Hello there"


    $ tt = GetTooltip()
    if tt:
        text "[tt]"

i wanted the player to know that there is a tip and he can reveal it if he/ she wishes by clicking.
anyway i got an idea thanks to you. I'll just ask the player if he want tips at some point in the game and i'll create a variable for it. I'll also add a button in the events screen to toggle the variable on and off.

 

[79flavors]

thanks a lot this will help. but thats for imagebutton, is there something for plain text?

Not that I know of.
But it's all fundamentally python, so I suspect the answer is probably "yeah, but..."

I think I'd probably go for a single "[click here to see hint]" type text or image as a simple solution. I can see why you'd want to blur the text, but I think the solution you want would be dependent on finding a kind soul who could do all the heavy lifting for you. (Or get lucky with google and the LemmaSoft forums).

 

[anne O'nymous]

Not that I know of.

There's two displayable dedicated for text (

You must be registered to see the links

and

You must be registered to see the links

). But they don't effectively turn your text into an image, just make it "sensible to transforms". What mean that manipulators like im.Blur do not accept them, because they expect a true image.

But it's all fundamentally python, so I suspect the answer is probably "yeah, but..."

Basically, you need to create your own displayable, and in the render method you use PyGame to generate the text, then apply a blur algorithm to the result ; you can't use im.Blur because they still aren't true images.

So, effectively, "yeah, but...". Not only it need advanced knowledge, but I'm not sure at all that there's a pure Python blur algorithm that would be fast enough to not slow down the speed ; you proceed the image pixel by pixel, what need time.
But even if you find a way to speed-up the process (by generating the result early, then cache it internally, by example), it will now be images representing a text, not anymore text by itself.

 

[Rich]

But even if you find a way to speed-up the process (by generating the result early, then cache it internally, by example), it will now be images representing a text, not anymore text by itself.

Your comment got me thinking, since, at the end of the day, when things are finally rendered, everything ends up being OpenGL meshes and textures. Given that Ren'py supports pretty much any font, it's probably converting things to meshes "down deep." In theory, one could fiddle with things so that some text was rendered "normally" and some rendered with a fragment shader that implemented blurring. I'm not saying it would be easy, or that it could even fit into Ren'py's architecture - you just got me pondering... LOL

 

[anne O'nymous]

In theory, one could fiddle with things so that some text was rendered "normally" and some rendered with a fragment shader that implemented blurring.

Hmm. I haven't had the time to really looks at the way Ren'py works now that it use vertex ; few things have changed (the way cursor are handle seem to be really different), so perhaps it's possible. But the main problem I see is that Ren'py really treat text differently than images.
For the game I'm (too) slowly working on, I made few glitch effects for the images, and I had to pass directly by PyGame to adapt them for text. Prior to 7.4.0, nothing was effectively an image before the very last moment, when Ren'py finally generate the screen.
By example, you can have a user defined displayable with a render method that would looks like :

# create the Render object
r = renpy.render()
# Put an image for the background
r.blit( image1, ( 0, 0 ) )
# Add another image (with alpha channel)
r.blit( image2, ( 0, 0 ) )

It will stay two different images until the very last moment. And the introduction of vertex probably enforced this way to do ; Ren'py already considered images as texture to apply to a surface, and now they really are textures and really are applied to a surface...

Therefore, like text isn't an image before the very last moment, I'm not sure that you can apply a shader to them. But since the two displayable dedicated to text exist to offer you the possibility to apply a transform, perhaps that it also works with shaders ; or would in the future.
This said, it fall back to what I said previously, for Ren'py it would now be an image, not text. So you'll need something like add or imagebutton to display them, and can't rely on a simple text.

If the text displayable also works with shaders, there's no problem. The text will be split on as many lines as needed, depending of the available width, then the shader will be applied.
But if you've to transform it yourself into an image before the shader can be applied, you'll also have to do the computation by yourself ; PyGame will write everything on a single line. Therefore, you'll end with an algorithm that start to really grow, what lead you to a benefit/cost thinking: does having a blurred text is really more interesting than simply showing the text on demand ?

Personally, my conclusion was that screens showing only text are reliable screens and totally glitch free ; the glitches can add something when applied to images, and are just flourishes when it come to text.

you just got me pondering... LOL

What is always interesting. It's how I learned so many things regarding Ren'py ; after the many failure while effective pondering

 

[Rich]

Therefore, like text isn't an image before the very last moment, I'm not sure that you can apply a shader to them.

Oh, absolutely. Not arguing that. In fact, I strongly suspect that text is never actually an image per se. But, "down deep," it's rendered the same way that an image is - by constructing a polygon mesh with a material. I'm sure, however, that "down deep" is too down deep to do this easily.

 

[InCompleteController]

I don't know how to blur the text, but something like this will give you an area you can mouse over to show hints. You can just delete the background stuff, since I just make the idle text transparent, so it's only there to show where the hint is on the screen.

default hintText = "Hint!"

style hintStyle:
    idle_color "#0000"
    hover_color "#ffff"
   
screen testHintButton:
    textbutton hintText action Null text_style "hintStyle" background "#000f"

Alternatively, why not just have a button they can press to get the hint shown? I don't really see a reason why the hint button can't just say "Hints" and open a new screen that shows the hint needed.

 

[Six Fingers]

I don't know how to blur the text, but something like this will give you an area you can mouse over to show hints. You can just delete the background stuff, since I just make the idle text transparent, so it's only there to show where the hint is on the screen.

default hintText = "Hint!"

style hintStyle:
    idle_color "#0000"
    hover_color "#ffff"
  
screen testHintButton:
    textbutton hintText action Null text_style "hintStyle" background "#000f"

Alternatively, why not just have a button they can press to get the hint shown? I don't really see a reason why the hint button can't just say "Hints" and open a new screen that shows the hint needed.

I learned everything from scratch so i'll try to explain as much as possible.
for events there is a class and the class have 3 things(i dont know what they are called ), name, description and image.
the name is clickable to toggle the current event (with screen variable), description includes description and the hints spaced by "/n/n" so thats why i want to hide the text only to reduce my workload.

What I will do is I will make a new "thing" in the class and make it for tips only and i will use if statement to show it if "Tips is on" and i will add a button in the screen to toggle the tips on and off.

but thank you so much for helping.