yet another phone system + UI

A place for Ren'Py tutorials and reusable Ren'Py code.
Forum rules
Do not post questions here!

This forum is for example code you want to show other people. Ren'Py questions should be asked in the Ren'Py Questions and Announcements forum.
Message
Author
User avatar
Nighten
Regular
Posts: 48
Joined: Fri Jan 26, 2018 12:29 am
Completed: Vincit, Sentiment Enneigés, The Devil took my Candies
Github: NightenDushi
itch: nighten
Location: France
Discord: Nighten#3081
Contact:

yet another phone system + UI

#1 Post by Nighten »

Image

Code: Select all

# How this scene is implemented:

nvl_narrator "Nighten added Eileen to the group"
n_nvl e2m2 "Hey! Welcome to the demo Eileen!"
e_nvl "who's this?"
n_nvl e2m1 "haha, silly you"
n_nvl e1m2 "We talked about showing off the phone the other day, remember?"
e_nvl "it's today? {image=emoji/fear.png}"
A simple messaging system, built on top of the NVL mode and easy to use :)

Instructions:
  • Add the images and PhoneTexting.rpy to your project folder
  • In this file, change the name of the main character to yours (MC_Name)
  • Edit the nvl screen in screen.rpy as follow:

    Code: Select all

    screen nvl(dialogue, items=None):
    
        #### ADD THIS TO MAKE THE PHONE WORK!! :) ###
        if nvl_mode == "phone":
            use PhoneDialogue(dialogue, items)
        else:
        ####
        ## Indent the rest of the screen
            window:
                style "nvl_window"
                # ...
  • Change gui.nvl_list_length in gui.rpy to None, so that all the message are shown
  • You'll then have to make a nvl character speak!
  • To use the regular nvl screen again, change the nvl_mode variable to something else, like "classic"
  • To include emojis and pictures, you can simply use an image tag; make sure they are the right size for the phone screen.
Browser demo on Itch.io
Mirror download on my website
Full source code on Github

Credits:
The background is made by Uncle Mugen. All the other art assets and the code are done by me, Nighten, and free to use in your project if you want (the source files are available).

I'm really interested in your feedback, so if you see any improvement to make to this system, don't hesitate to point it out!
Have a nice day! :)
Attachments
PhoneTexting.rpy
(4.79 KiB) Downloaded 359 times
Last edited by Nighten on Tue Nov 02, 2021 6:44 am, edited 3 times in total.
If you need help with your project, you can hire me as a programmer! :D

Image ImageImage

User avatar
HypersDev
Newbie
Posts: 18
Joined: Thu Jul 16, 2020 1:43 am
Projects: DutyCalls
itch: ItsHypers
Contact:

Re: yet another phone system + UI

#2 Post by HypersDev »

Damn, this looks really nice :)

User avatar
heartfragment
Regular
Posts: 109
Joined: Tue Nov 10, 2015 12:10 am
Projects: Heart Fragment
Tumblr: heartfragment
itch: heartfragment
Contact:

Re: yet another phone system + UI

#3 Post by heartfragment »

This is great! I replaced my previous phone system with this because the code for it is so much quicker to input. Thank you for sharing!
Published Project:
Image

User avatar
BáiYù
Regular
Posts: 131
Joined: Fri Apr 01, 2016 10:02 am
Completed: This Life Escapes Me, Up All Night, Lotus: The Self-Made Witch
Projects: Various
Organization: tofurocks, Fiendish Fiction, Spider Lily Studios
Github: baiyu-dev
itch: tofurocks
Contact:

Re: yet another phone system + UI

#4 Post by BáiYù »

Oh, this is fantastic! I was working on something like this but couldn't figure out the ATL for the messages to play right, so I'm glad someone else was able to do it.

Would you be able to me what license you're distributing this code under, and how to credit you properly? Thanks again!
Image
Games and supplementary Ren'Py codes

User avatar
Nighten
Regular
Posts: 48
Joined: Fri Jan 26, 2018 12:29 am
Completed: Vincit, Sentiment Enneigés, The Devil took my Candies
Github: NightenDushi
itch: nighten
Location: France
Discord: Nighten#3081
Contact:

Re: yet another phone system + UI

#5 Post by Nighten »

Thanks a lot for your comments! I'm so glad it can help other people!
The code is distributed under the MIT license; and as of credits, it's not required but you can simply refer to me as Nighten.

Have a great day!
If you need help with your project, you can hire me as a programmer! :D

Image ImageImage

User avatar
Nighten
Regular
Posts: 48
Joined: Fri Jan 26, 2018 12:29 am
Completed: Vincit, Sentiment Enneigés, The Devil took my Candies
Github: NightenDushi
itch: nighten
Location: France
Discord: Nighten#3081
Contact:

Re: yet another phone system + UI

#6 Post by Nighten »

Someone contacted me by email to ask how to make a different icon appear depending on the character speaking; so here's a quick fix I propose:

On the line 103 of PhoneTexting.rpy, you can change:

Code: Select all

if d.who == MC_Name:

          $ message_icon = "phone_send_icon.png"

else:

          $ message_icon = "phone_received_icon.png"
To:

Code: Select all

if d.who == MC_Name:

          $ message_icon = "phone_"+d.who+"_icon.png" //This now include the name of the character

else:

          $ message_icon = "phone_received_icon.png"
This way, the image that will be shown will include the character's name : If Eileen speak, the icon used will be called "phone_Eileen_icon.png"

I hope it help! Questions by email or private messages are totally welcome btw :)
If you need help with your project, you can hire me as a programmer! :D

Image ImageImage

User avatar
ghostclown
Regular
Posts: 28
Joined: Sun Oct 11, 2020 2:33 pm
Projects: R. I. P. Tour
itch: ghostclown
Contact:

Re: yet another phone system + UI

#7 Post by ghostclown »

This is great. I was just thinking I should refactor my own phone system, and this will save me a lot of time. :)

chekkin
Newbie
Posts: 5
Joined: Wed Feb 16, 2022 2:51 pm
Contact:

Re: yet another phone system + UI

#8 Post by chekkin »

This is fantastic, thanks!

I was wondering if there's a way to move the position of the phone on the screen? I can't quite figure it out.

*EDIT: I was just a fool blundering around in the screens and gui scripts, when you'd made it easy! It's right at the top of PhonTexting.rpy, labelled phone_poisition_x and phone_position_y. Simple!

User avatar
wwwormmie
Newbie
Posts: 1
Joined: Mon Mar 14, 2022 4:30 pm
Contact:

Re: yet another phone system + UI

#9 Post by wwwormmie »

Thank you so much for this! I wanted to know if there was a way to get menus to work on this?

User avatar
Nighten
Regular
Posts: 48
Joined: Fri Jan 26, 2018 12:29 am
Completed: Vincit, Sentiment Enneigés, The Devil took my Candies
Github: NightenDushi
itch: nighten
Location: France
Discord: Nighten#3081
Contact:

Re: yet another phone system + UI

#10 Post by Nighten »

wwwormmie wrote: Sat Mar 19, 2022 12:46 pm Thank you so much for this! I wanted to know if there was a way to get menus to work on this?
Hum, it depend; if you mean the choice it should be possible with some work. I got some request about it already, but I really not have the energy nor the time to work on it right now. But if I manage to get it working I'll release my solution here for sure :)

If you mean more complex menu, like having a CGs gallery accessible via the phone, it would obviously be a lot of more work; the nvl screen behave sometime in an unexpecting way. I don't plan to work much on this, especially because it would be hard to make it generic enough to be useful for a lot of people.

I'm glad my code is useful!
If you need help with your project, you can hire me as a programmer! :D

Image ImageImage

chekkin
Newbie
Posts: 5
Joined: Wed Feb 16, 2022 2:51 pm
Contact:

Re: yet another phone system + UI

#11 Post by chekkin »

Nighten wrote: Sat Mar 19, 2022 4:12 pm
wwwormmie wrote: Sat Mar 19, 2022 12:46 pm Thank you so much for this! I wanted to know if there was a way to get menus to work on this?
Hum, it depend; if you mean the choice it should be possible with some work. I got some request about it already, but I really not have the energy nor the time to work on it right now. But if I manage to get it working I'll release my solution here for sure :)

If you mean more complex menu, like having a CGs gallery accessible via the phone, it would obviously be a lot of more work; the nvl screen behave sometime in an unexpecting way. I don't plan to work much on this, especially because it would be hard to make it generic enough to be useful for a lot of people.

I'm glad my code is useful!
Assuming wwwormmie is asking about choice menus, I actually implemented this based on the code for your other phone UI system, Nighten. I'm still a bit of a coding noob, but hopefully it works for everyone else too.
My project is in 1920x1080, so if yours is different you may have to change some numbers.

Go into PhoneTexting.rpy, and replace screen PhoneDialogue with the following:

Code: Select all

screen PhoneDialogue(dialogue, items=None):

    style_prefix "phoneFrame"
    frame at phone_transform(phone_position_x, phone_position_y):
        if len(dialogue) == 1:
            at phone_appear(phone_position_x, phone_position_y)

        viewport:
            draggable True
            mousewheel True
            yinitial 1.0
            vbox:
                null height 20
                use nvl_phonetext(dialogue)
                null height 100

                # If there is a choice menu, move the messages up so the latest can still be seen
                if len(items) > 0:
                    null height len(items) * 100



        # Adding in choice menu
        if len(items) > 0:
            frame:
                yalign 0.9
                xalign 0.5
                ysize len(items) * 115
                xsize 480
                background Solid("#000000")
                foreground None

                vbox:
                    yalign 0.9
                    for i in items: #For each choice, add its button
                        button:
                            action i.action
                            xalign 0.5
                            frame:
                                background Solid("#808b96")
                                foreground None
                                xysize (450,90)

                                text i.caption:
                                    align (0.5,0.5)
                                    text_align 0.5
                                    size 26
Let me know if there are any issues with it. Hope that helps someone!

Edit to add: Don't forget that in order to see this, use menu(nvl=True)

edgebug
Regular
Posts: 41
Joined: Thu Jun 30, 2016 11:44 pm
Contact:

Re: yet another phone system + UI

#12 Post by edgebug »

Hey, I'm having the WACKIEST issue where everything said in the phone system is showing up twice.

Can you also explain the "e1m2" tags you're using? :) Sorry if this is a stupid question, hehe.

User avatar
Nighten
Regular
Posts: 48
Joined: Fri Jan 26, 2018 12:29 am
Completed: Vincit, Sentiment Enneigés, The Devil took my Candies
Github: NightenDushi
itch: nighten
Location: France
Discord: Nighten#3081
Contact:

Re: yet another phone system + UI

#13 Post by Nighten »

The problem was solved by adding "window show" in the script, in case anyone stumble upon the same issue.

The e1m2 tag is just a image tag, specific to the sprite I used for the demo. If your are curious, e1m2 mean "eyes 1, mouth 2". I don't setup my sprite like this anymore, as it's not really intuitive. But you don't have to worry about it, since it is just how I named the sprites.

Thanks again for anyone who is using this code!
If you need help with your project, you can hire me as a programmer! :D

Image ImageImage

slamy
Newbie
Posts: 2
Joined: Sun May 22, 2022 8:49 pm
Contact:

Re: yet another phone system + UI

#14 Post by slamy »

You said you would deliver the revised code by last weekend.
Still, you don't have any answer.
You are unilaterally disconnecting without giving a reason.
I gave you the money first because you said you would have to pay to deliver the code.
However, requests for correction of errors found in the code are being ignored.
Please respect my project.
Your behavior is too violent and irresponsible.

kirikiri
Newbie
Posts: 3
Joined: Thu Mar 30, 2023 3:25 pm
Contact:

Re: yet another phone system + UI

#15 Post by kirikiri »

I'm having the same issue where the text is showing up twice- "window show" does not fix it for me. Can someone help?

Post Reply

Who is online

Users browsing this forum: No registered users