Display a chat-like interface alongside dialogue? [Solved]

[Milkymalk]

Correct, though you can also put the viewport inside a normal screen layout. The viewport is just a type of screen element that allows you to scroll its content.

[Fuu]

How would one go about doing that? Or rather, what is the style code I would use with the new interface? Most of the recipes don't seem to apply anymore.

[Milkymalk]

To be honest, I suck at using styles Someone else will have to help you there.

[Fuu]

I've been tinkering around with this a bit more and two things. Again, thank you for all the help!

the command delchat doesn't seem to do anything. I'm using

Code: Select all

    $ chat.delchat

also, do you know how to get the viewport to focus on the bottom, so the newest text is shown automatically without having to scroll?

So far I've customized with

Code: Select all

screen chatdisplay:
    frame:
        align (0.95, 0.2)
        viewport id "chatwindow":
            mousewheel True
            ##area (10, 25, 550, 500)
            xsize 550
            ysize 600
            yinitial 0.0
            xinitial 0.0

[Milkymalk]

it's $ chat.delchat(), otherwise you are literally returning the function itself instead of calling it.

All about viewports is here:
https://www.renpy.org/doc/html/screens.html#viewport

You use
yinitial 1.0
for that. 0.0 would be the top as I understand it. If your viewport doesn't scroll horizontally, you don't need xinitial.

[Fuu]

Yep! That did the trick! Thanks again for the help!

As for the viewport...Hm...that doesn't seem to move it when something new is added. I'll do some more research on it! If push comes to shove I may just work around it with the delchat command

[Milkymalk]

Try adding renpy.restart_interaction() to Message.addmessage(), this should "reboot" the screen:
https://www.renpy.org/doc/html/other.ht ... nteraction

If that doesn't work, try adding the Python equivalent of showing the screen instead. Too lazy to look it up now, but there is a page in the docs about Python equivalents of Renpy statements.

[Fuu]

Try adding renpy.restart_interaction() to Message.addmessage(), this should "reboot" the screen:
https://www.renpy.org/doc/html/other.ht ... nteraction

If that doesn't work, try adding the Python equivalent of showing the screen instead. Too lazy to look it up now, but there is a page in the docs about Python equivalents of Renpy statements.

No dice there. It's as if the yinitial isn't doing anything.

I have

Code: Select all

    $ chat.addmessage(" ", "        Almost!")
    $ renpy.restart_interaction()

[Milkymalk]

I meant you should write the restart_interaction inside the function, where the class i declared, but it has the same effect.

No idea for now ...

[Milkymalk]

Okay, I found the solution in this thread:
viewtopic.php?f=8&t=32584&p=422238

I used the method in the second post as it is much shorter and easier to understand.

Code: Select all

screen chatdisplay:
    $ chatyadj.value = infyadjValue
    frame:
        ### Here is where I added the viewport, and set its yadjustment property to the ui.adjustment object I created earlier.
        viewport id "chatwindow":
            yadjustment chatyadj
            mousewheel True
            xsize 550
            ysize 600
            scrollbars "vertical"
            hbox:
                vbox:
                    for i in chat.history:
                        text i.name
                vbox:
                    for i in chat.history:
                        text i.message

init python:
    class Message(object):
        def __init__(self, name, message):
            self.name = name
            self.message = message

    class Chatlog(object):
        def __init__(self):
            self.history = []

        def addmessage(self, name, message):
            self.history.append(Message(name, message))
        def delchat(self):
            self.history = []

    ### Set a variable to infinity, to be used later.
    infyadjValue = float("inf")
    ### Create a ui.adjustment object and assign it to a variable so that we can reference it later. I'll assign it to the yadjustment property of our viewport later.
    chatyadj = ui.adjustment()

init:
    default chat = Chatlog()
    
label start:
    show screen chatdisplay
    $ n=0
    while True:
        $ n+=1
        $ chat.addmessage(str(n), 'Blahblahblah')
        ""

[Fuu]

You my friend are a veritable genius and I can't thank you enough! The code worked like a charm. I adjusted the chat so it shows on the right side and used the chat.addmessage you suggested previously to make the chat work as expected.

Again, thank you so much for your help!

[Milkymalk]

No problem at all I've been fiddling with screen language a lot these days in order to learn more about it. I always struggled for days just to make a simple screen so I thought it was time to get real and learn it.

[storykween]

Wow, all this code is very helpful, thanks for posting!

Sorry if this is a dumb question (my screen coding is really rusty) but how do you make sure that the vertical spacing between all the messages is consistent? A problem I'm having with the code provided in your example is that if one of the coded messages is really long and spans multiple lines, the name to its left does not appear with a sufficient gap between the name from the last message.

Image example below:

[Milkymalk]

I could have seen that coming, honestly.

Change the screen code to this and if you like try to understand the difference as a screen language and coding exercise

Code: Select all

screen chatdisplay:
    $ chatyadj.value = infyadjValue
    frame:
        ### Here is where I added the viewport, and set its yadjustment property to the ui.adjustment object I created earlier.
        viewport id "chatwindow":
            yadjustment chatyadj
            mousewheel True
            xsize 550
            ysize 600
            scrollbars "vertical"
            vbox:
                for i in chat.history:
                    hbox:
                        text i.name:
                            xsize 150 # for bonus points: why is this necessary?
                        text i.message

[zankizuna]

Can you screenshot the output? It looks very interesting. Adding the screen to a viewport sounds genius.