How to make a Moving Text box anytime Character is Switch

Discuss how to use the Ren'Py engine to create visual novels and story-based games. New releases are announced in this section.
Forum rules
This is the right place for Ren'Py help. Please ask one question per thread, use a descriptive subject like 'NotFound error in option.rpy' , and include all the relevant information - especially any relevant code and traceback messages. Use the code tag to format scripts.
Post Reply
Message
Author
fos1x
Newbie
Posts: 8
Joined: Tue Sep 12, 2023 8:52 am
Contact:

How to make a Moving Text box anytime Character is Switch

#1 Post by fos1x »

I want to make the text box move when ever the character is switch, to imitate a COM opening
After a day I able to make it move, but it move everytime a character speaks.
I only want it to do the animation when they start to speak, and WHEN the speaker is switch

- I got a suggestion by by making a variable like "last_who" that save up previous charater and by checking "if who is not last_who" do the animation
by that an if else that will pick a static window or an animated window,

- but knowing that doesn't help to much since i'm new to renpy and programing, i don't know how to implement it,

Here's the code I has been cooking inside renpy screen.rpy

Code: Select all

transform windowa:
    Transform(Image("gui/tbox.png", xalign=0.5, yalign=0.7), alpha=persistent.dialogueBoxOpacity)
    anchor (0.5, 1.0) pos (0.5, 0.6) crop (0.0, 1.1, 1.0, 0.6)
    linear 0.2 crop (0.0, 0.0, 1.0 , 1.0) pos (0.5, 1.0)
    alpha 0
    pause 0.02
    alpha 1.0

#noted hcrop speed = move speed, zcrop speed x2 move speed
#background Transform(Image("gui/tbox.png", xalign=0.5, yalign=0.7), alpha=persistent.dialogueBoxOpacity)
screen say(who, what):
    style_prefix "say"

    window:
        id "window"
        window at windowa
        if who is not None:

            window:
                id "namebox"
                style "namebox"
                text who id "who"

        text what id "what"

    ## If there's a side image, display it above the text. Do not display on the
    ## phone variant - there's no room.
    if not renpy.variant("small"):
        add SideImage() xalign 0.0 yalign 1.0

Another_Tom
Regular
Posts: 61
Joined: Mon Apr 24, 2023 9:06 am
Completed: Harold And The Witches
Projects: Steven On The Run
itch: dantom
Location: Germany
Contact:

Re: How to make a Moving Text box anytime Character is Switch

#2 Post by Another_Tom »

fos1x wrote: Tue Sep 12, 2023 4:45 pm I want to make the text box move when ever the character is switch, to imitate a COM opening
It's a neat idea and I also want to know how to do it.
I tried it with last_who = who but to no avail since last who (if you enable console and type in watch last_who) is always eval failed. I thought you can use it like any other variable as the var is passed to the screen say(who,what).
(I don't have your images, that's why I used my own transform and added a windowb transform which is used if the sayer (who) is the same.
This doesn't work:

Code: Select all

...removed, obsolete...
Last edited by Another_Tom on Sat Sep 23, 2023 9:56 am, edited 1 time in total.

Another_Tom
Regular
Posts: 61
Joined: Mon Apr 24, 2023 9:06 am
Completed: Harold And The Witches
Projects: Steven On The Run
itch: dantom
Location: Germany
Contact:

Re: How to make a Moving Text box anytime Character is Switch

#3 Post by Another_Tom »

fos1x wrote: Tue Sep 12, 2023 4:45 pm I want to make the text box move when ever the character is switch, to imitate a COM opening
Well, here we go. I think this is not the best method but at least it works.

Code: Select all

transform windowa:
    xpos -3.0
    linear 0.5 xalign 0.0
    
default last_who = ""
default trans_say = ""

screen say(who, what):
    on "hide" action SetVariable("last_who", who)   # the trick is, to change the var on "hide" screen
    text "who:[who] last_who [last_who]"    # <- delete this line it was for debugging
    style_prefix "say"

    if who != last_who:
        $ trans_say = windowa        
    else:
        $ trans_say = None

    window at trans_say:
        id "window" 

        if who is not None:            
            window:
                id "namebox"
                style "namebox"
                text who id "who"
                
        text what id "what"
        
    ## If there's a side image, display it above the text. Do not display on the
    ## phone variant - there's no room.
    if not renpy.variant("small"):
        add SideImage() xalign 0.0 yalign 1.0

Another_Tom
Regular
Posts: 61
Joined: Mon Apr 24, 2023 9:06 am
Completed: Harold And The Witches
Projects: Steven On The Run
itch: dantom
Location: Germany
Contact:

Re: How to make a Moving Text box anytime Character is Switch

#4 Post by Another_Tom »

While working on a VN in my spare time, I also used this code (but with a different transform) and realized that we don't need two transforms at all, so transform windowb is obsolete, instead we use None. I have modified the code above.

fos1x
Newbie
Posts: 8
Joined: Tue Sep 12, 2023 8:52 am
Contact:

Re: How to make a Moving Text box anytime Character is Switch

#5 Post by fos1x »

sorry it doesn't work in my case, but it would be a good code for me to learn! thank!

Another_Tom
Regular
Posts: 61
Joined: Mon Apr 24, 2023 9:06 am
Completed: Harold And The Witches
Projects: Steven On The Run
itch: dantom
Location: Germany
Contact:

Re: How to make a Moving Text box anytime Character is Switch

#6 Post by Another_Tom »

fos1x wrote: Thu Oct 05, 2023 12:53 pm sorry it doesn't work in my case, but it would be a good code for me to learn! thank!
Ah of course, my mistake. In your case you need a second atl transform that does the same as windowa but without animations. Here is the code for your situation, try it out.

Code: Select all

transform windowa:
    Transform(Image("gui/tbox.png", xalign=0.5, yalign=0.7), alpha=persistent.dialogueBoxOpacity)
    anchor (0.5, 1.0) pos (0.5, 0.6) crop (0.0, 1.1, 1.0, 0.6)
    linear 0.2 crop (0.0, 0.0, 1.0 , 1.0) pos (0.5, 1.0)
    alpha 0
    pause 0.02
    alpha 1.0

transform windowb:
    Transform(Image("gui/tbox.png", xalign=0.5, yalign=0.7), alpha=persistent.dialogueBoxOpacity)
    anchor (0.5, 1.0) pos (0.5, 0.6) crop (0.0, 1.1, 1.0, 0.6)
    crop (0.0, 0.0, 1.0 , 1.0) pos (0.5, 1.0)
    alpha 1.0
    
    
    
default last_who = None
default trans_say = windowa

screen say(who, what):
    on "hide" action SetVariable("last_who", who)   # the trick is, we change the var on "hide" screen
    text "who:[who] last_who [last_who]"	# <- i forgot to delete this again lmao
    style_prefix "say"

    if who != last_who:
        $ trans_say = windowa
        
    else:
        $ trans_say = windowb
    
    # if last_who == "" or last_who == None:
        # $ trans_say = windowc

    window at trans_say:
        background Transform(Image("gui/tbox.png", xalign=0.5, yalign=0.7), alpha=persistent.dialogueBoxOpacity)
        id "window" 

        if who is not None:

            
            window:
                id "namebox"
                style "namebox"
                text who id "who"
                

        text what id "what"
        
    
    

    ## If there's a side image, display it above the text. Do not display on the
    ## phone variant - there's no room.
    if not renpy.variant("small"):
        add SideImage() xalign 0.0 yalign 1.0


For everyone else who doesn't "crop" their textboxes, the above code (in my other post) should suffice.

fos1x
Newbie
Posts: 8
Joined: Tue Sep 12, 2023 8:52 am
Contact:

Re: How to make a Moving Text box anytime Character is Switch

#7 Post by fos1x »

Another_Tom wrote: Fri Oct 06, 2023 10:55 am
fos1x wrote: Thu Oct 05, 2023 12:53 pm sorry it doesn't work in my case, but it would be a good code for me to learn! thank!
Ah of course, my mistake. In your case you need a second atl transform that does the same as windowa but without animations. Here is the code for your situation, try it out.

Code: Select all

transform windowa:
    Transform(Image("gui/tbox.png", xalign=0.5, yalign=0.7), alpha=persistent.dialogueBoxOpacity)
    anchor (0.5, 1.0) pos (0.5, 0.6) crop (0.0, 1.1, 1.0, 0.6)
    linear 0.2 crop (0.0, 0.0, 1.0 , 1.0) pos (0.5, 1.0)
    alpha 0
    pause 0.02
    alpha 1.0

transform windowb:
    Transform(Image("gui/tbox.png", xalign=0.5, yalign=0.7), alpha=persistent.dialogueBoxOpacity)
    anchor (0.5, 1.0) pos (0.5, 0.6) crop (0.0, 1.1, 1.0, 0.6)
    crop (0.0, 0.0, 1.0 , 1.0) pos (0.5, 1.0)
    alpha 1.0
    
    
    
default last_who = None
default trans_say = windowa

screen say(who, what):
    on "hide" action SetVariable("last_who", who)   # the trick is, we change the var on "hide" screen
    text "who:[who] last_who [last_who]"	# <- i forgot to delete this again lmao
    style_prefix "say"

    if who != last_who:
        $ trans_say = windowa
        
    else:
        $ trans_say = windowb
    
    # if last_who == "" or last_who == None:
        # $ trans_say = windowc

    window at trans_say:
        background Transform(Image("gui/tbox.png", xalign=0.5, yalign=0.7), alpha=persistent.dialogueBoxOpacity)
        id "window" 

        if who is not None:

            
            window:
                id "namebox"
                style "namebox"
                text who id "who"
                

        text what id "what"
        
    
    

    ## If there's a side image, display it above the text. Do not display on the
    ## phone variant - there's no room.
    if not renpy.variant("small"):
        add SideImage() xalign 0.0 yalign 1.0


For everyone else who doesn't "crop" their textboxes, the above code (in my other post) should suffice.
holy! it almost work!
problem 1 the text didn't load on the textbox, when i fiddle with the textbox opacity slider in setting, the text will show up then, but when advance to other dialog it went hidden
problem 2 because it base on hide it only work when there are 2 people speaking, if there's only 1 person it will repeat the animation

Another_Tom
Regular
Posts: 61
Joined: Mon Apr 24, 2023 9:06 am
Completed: Harold And The Witches
Projects: Steven On The Run
itch: dantom
Location: Germany
Contact:

Re: How to make a Moving Text box anytime Character is Switch

#8 Post by Another_Tom »

fos1x wrote: Fri Oct 06, 2023 8:00 pm holy! it almost work!
problem 1 the text didn't load on the textbox, when i fiddle with the textbox opacity slider in setting, the text will show up then, but when advance to other dialog it went hidden
problem 2 because it base on hide it only work when there are 2 people speaking, if there's only 1 person it will repeat the animation
1) I see, because I was also wondering that I didn't see any text when I used your transform. I think it's because of the anchor or crop you are using, the say text seems to appear outside the screen. We can give it another shot by trying a different transform or if you don't mind, could you share your tbox.png here? Doesn't have to be the same image, but the size should fit.
How did you style the namebox and dialogue?
2) It should be the other way around, that's why we have the code. :D

fos1x
Newbie
Posts: 8
Joined: Tue Sep 12, 2023 8:52 am
Contact:

Re: How to make a Moving Text box anytime Character is Switch

#9 Post by fos1x »

Another_Tom wrote: Sat Oct 07, 2023 2:27 am 1) I see, because I was also wondering that I didn't see any text when I used your transform. I think it's because of the anchor or crop you are using, the say text seems to appear outside the screen. We can give it another shot by trying a different transform or if you don't mind, could you share your tbox.png here? Doesn't have to be the same image, but the size should fit.
How did you style the namebox and dialogue?
2) It should be the other way around, that's why we have the code. :D
here's my tbox
https://i.imgur.com/Kqla0bP.png

I believe this is my current dialogue setup
I don't have separate name box and just use the top left coner of the textbox to place name

Code: Select all

transform windowa:
    Transform(Image("gui/tbox.png", xalign=0.5, yalign=0.7), alpha=persistent.dialogueBoxOpacity)
    anchor (0.5, 1.0) pos (0.5, 0.6) crop (0.0, 1.1, 1.0, 0.6)
    linear 0.2 crop (0.0, 0.0, 1.0 , 1.0) pos (0.5, 1.0)
    alpha 0
    pause 0.02
    alpha 1.0
transform window:
    Transform(Image("gui/tbox.png", xalign=0.5, yalign=0.7), alpha=persistent.dialogueBoxOpacity)
screen say(who, what):
    style_prefix "say"
    window:
        id "window"
        window at window
        if who is not None:
            window:
                id "namebox"
                style "namebox"
                text who id "who"
        text what id "what"
    if not renpy.variant("small"):
        add SideImage() xalign 0.0 yalign 1.0


## Make the namebox available for styling through the Character object.
init python:
    config.character_id_prefixes.append('namebox')

style window is default
style say_label is default
style say_dialogue is default
style say_thought is say_dialogue

style namebox is default
style namebox_label is say_label

style window:
    xalign 0.5
    xfill True
    yalign gui.textbox_yalign
    ysize gui.textbox_height
    #background Transform(Frame("gui/tbox.png"), alpha=persistent.dialogueBoxOpacity)
    #background Image2("gui/tboxoutline.png", xalign=0.5, yalign=0.7)

style namebox:
    xpos gui.name_xpos
    xanchor gui.name_xalign
    xsize gui.namebox_width
    ypos gui.name_ypos
    ysize gui.namebox_height

    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)
    outlines [( 2, "#000000", 1, 1)]
    xalign gui.name_xalign
    ypos -0.2
    color "fff"
    size 50

style say_dialogue:
    properties gui.text_properties("dialogue")
    outlines [( 2, "#000000", 1, 1)]
    xpos gui.dialogue_xpos
    xsize gui.dialogue_width
    ypos gui.dialogue_ypos
    color "fff"
    size 32
    adjust_spacing False
  
Attachments
tbox.png

Another_Tom
Regular
Posts: 61
Joined: Mon Apr 24, 2023 9:06 am
Completed: Harold And The Witches
Projects: Steven On The Run
itch: dantom
Location: Germany
Contact:

Re: How to make a Moving Text box anytime Character is Switch

#10 Post by Another_Tom »

fos1x wrote: Sat Oct 07, 2023 8:27 am I believe this is my current dialogue setup
I don't have separate name box and just use the top left coner of the textbox to place name
Well, this line

Code: Select all

Transform(Image("gui/tbox.png", xalign=0.5, yalign=0.7), alpha=persistent.dialogueBoxOpacity)
was the culprit. I've also removed the window transform as it's unnecessary.
Here's your modified code which I've tested myself, should work as intended. Please check the out/commented lines.

Code: Select all

default trans_window = windowa
default last_who = None

transform windowa:
    # This overrides the say text for some reason do not use it here
    # Transform(Image("gui/tbox.png", xalign=0.5, yalign=0.7), alpha=persistent.dialogueBoxOpacity)
    anchor (0.5, 1.0) pos (0.5, 0.6) crop (0.0, 1.1, 1.0, 0.6)
    linear 0.2 crop (0.0, 0.0, 1.0 , 1.0) pos (0.5, 1.0)
    alpha 0
    pause 0.02
    alpha 1.0
        

screen say(who, what):
    on "hide" action SetVariable("last_who", who) 
    style_prefix "say"
    
    # this was missing in your code
    # we need to know which was the last speaker
    if last_who == who:
        $ trans_window = None
    else:
        $ trans_window = windowa
    
    window at trans_window:
        background Transform(Image("gui/tbox.png", xalign=0.5, yalign=0.7), alpha=persistent.dialogueBoxOpacity)
        id "window"
        
        if who is not None:
            window:     
                id "namebox"
                style "namebox"
                text who id "who"
        text what id "what" 
    if not renpy.variant("small"):
        add SideImage() xalign 0.0 yalign 1.0


## Make the namebox available for styling through the Character object.
init python:
    config.character_id_prefixes.append('namebox')

style window is default
style say_label is default
style say_dialogue is default
style say_thought is say_dialogue

style namebox is default
style namebox_label is say_label

# redundant style
# style window:
    # xalign 0.5
    # xfill True
    # yalign gui.textbox_yalign
    # ysize gui.textbox_height
    #background Transform(Frame("gui/tbox.png"), alpha=persistent.dialogueBoxOpacity)
    #background Image2("gui/tboxoutline.png", xalign=0.5, yalign=0.7)

style namebox:
    xpos gui.name_xpos
    xanchor gui.name_xalign
    xsize gui.namebox_width
    ypos gui.name_ypos
    ysize gui.namebox_height

    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)
    outlines [( 2, "#000000", 1, 1)]
    xalign gui.name_xalign
    ypos -0.2
    color "fff"
    size 50

style say_dialogue:
    properties gui.text_properties("dialogue")
    outlines [( 2, "#000000", 1, 1)]
    xpos gui.dialogue_xpos
    xsize gui.dialogue_width
    ypos gui.dialogue_ypos
    color "fff"
    size 32
    adjust_spacing False
  
Edit: And here's my test srcipt.rpy

Code: Select all

define e = Character("Magical Eileen")
define h = Character("Hiro")

            
label start:
    window hide
    # scene stars:
       # size (1920,1080)
    
    
    h "hiro line 1"
    h "hiro line 2"
    h "hiro line 3"
    h "hiro line 4"
    e "Eileen line 1"
    e "Eileen line 2"
    e "Eileen line 3"
    e "Eileen line 4"
    "Narrators line 1"
    "Narrators line 2"
    "Narrators line 3"
    "Narrators line 4"
    h "I'm out."
    e "Take care."
    "- The end -"
    return

fos1x
Newbie
Posts: 8
Joined: Tue Sep 12, 2023 8:52 am
Contact:

Re: How to make a Moving Text box anytime Character is Switch

#11 Post by fos1x »

Yes! it work, thank you so much!
now I have to recalibrate the text box between someone say and no one say

Post Reply

Who is online

Users browsing this forum: Ahrefs [Bot], Princesky