Adding a smartphone with various functionality [WIP]

[SundownKid]

This phone would work better with imagebuttons so you can easily add and remove functionality from the phone. Each icon should be a separate button in a grid. Throw away the imagemaps altogether, they are bad for something this modular!

Code: Select all

screen mainphonescreen:
    frame at popup:
        xalign 0.5
        add "Phone/150Phone.png"
        grid 4 4:
            imagebutton auto "phone/photo_%s.png" action ui.jumps("take_a_photo")

I think a setup like this would work, haven't tested it though.

Also, you seem to use labels to show screens when you can really just show a second screen on top and replace it by tagging it with something like "phoneui".

This:

Code: Select all

label travel_map_a:
    call hide_all_phone_screens
    show screen blank_phone_screen
    show screen travel_map_a
    "" #Need this, or bad things will happen...
    jump travel_map_a # To prevent more bad things happening.

Can be completely removed with no ill effects.

You should also align the phone bg and buttons at the center, and use a transform to make it look like it's popping up from underneath.

I managed to make a cool looking popup animation by using this transform:

Code: Select all

transform popup:
    yalign 10.0 rotate 50
    linear 0.3 yalign 0.5 rotate 0

Also, the new phone code is glitched, the last line on the imagemap should be changed to:

Code: Select all

hotspot (127, 492, 86, 42) clicked ui.jumps("hide_all_phone_screens") # Home button (Exits)

If you want, I can fix it, just give me a folder with all those placeholder icons.

You should probably just maintain a playable demo and let people copy the code from there rather than releasing it separately/in the OP.

[TrickWithAKnife]

Thanks for the changes. I'm busy per the next couple of days, but I will try everything out.
I'm not so keen about reuploading everything whenever a change is made. Because this code is based off my own game, I basically have to remove anything I don't want to share, remove files not needed in this demonstration, text everything out, create a distributable, upload it, get a link, and add the link to this topic. It's something I want to avoid unless it's absolutely vital. At this point people could download the attached files and just copy and paste the code.

[SundownKid]

I have some free time, I will try fixing everything up. I will switch to free use icons so no one gets sued..

Looking at it right now, I feel that the grid should actually be 3x4 because 3 of the buttons are superflous. The clock should be on the phone menu bar instead of a separate screen. Mail is too similar to messages and they could probably be combined. Phone is also too similar to Contacts and could be combined as well, since any phone usage would be from a list of contacts.

[TrickWithAKnife]

Awesome. *Puts up feet and relaxes*

Um, joking aside, if you can improve things, maybe you could make your own topic?
I mostly threw together other people's ideas anyway so I could help get the cookbook section of the forum active,
but have a bare minimum of programming knowledge. If you do want to make a topic, I would happily remove this one, unless a moderator beats me to it.

[SundownKid]

This... is somewhat harder than I thought. Anyway, here's an example of what can be done.

Code: Select all

# This creates the button to show the phone menus
screen button:
    imagebutton idle "Phone/phone smallest.png" hover "Phone/phone smaller.png" action Show('mainphonescreen') xalign 0.0 yalign 0.0
 
#*******************************************************************************#
#                                                PHONE STARTING SCREEN                                                        #
#*******************************************************************************#

# This part shows the main phone screen, and controls what happens when icons are clicked.   

transform popup:
    yalign 10.0 rotate 50 xalign 0.4
    linear 0.3 yalign 0.5 rotate 0 xalign 0.5
    
screen mainphonescreen:
    modal True
    frame at popup:
        xpadding 0 ypadding 0
        xmaximum 334 ymaximum 555
        background "Phone/300x400 phone no icons.png"
        use phoneselect
        hbox xalign 0.5 yalign 1.0:
            spacing 100
            imagebutton auto "phone/icons/1_%s.png" action Hide('phoneui', transition=dissolve) # Back button
            imagebutton auto "phone/icons/1_%s.png" action [Hide('mainphonescreen', transition=dissolve), Hide('phoneui', transition=dissolve)] # Home button (Exits)
        
screen phoneselect:
    grid 3 4 spacing 30 xalign 0.5 yalign 0.5:
        imagebutton auto "phone/icons/1_%s.png" action Show('start_map_app', transition=dissolve) # 1st icon (Map)
        et cetera...

And the map viewing app:

Code: Select all

screen start_map_app:
    tag phoneui
    side "c b r":
        xmaximum 296 ymaximum 353
        xalign 0.5 yalign 0.5
        viewport id "vp":
             draggable True
             vbox:
                 
                 imagebutton:
                     idle "Maps/mega tokyo map 3.jpg"
                     hover "Maps/mega tokyo map 3.jpg"
                     #action ui.callsinnewcontext("start_word_list") # FOR TESTING OTHER PHONE ICONS

Right now the map and other apps pop up over the selection buttons - I couldn't find a way to replace them instead, but I guess this works. It's still far better than how it was before.

[TrickWithAKnife]

Code: Select all

# This creates the button to show the phone menus
screen button:
    imagebutton idle "Phone/phone smallest.png" hover "Phone/phone smaller.png" action Show('mainphonescreen') xalign 0.0 yalign 0.0

This code doesn't hide the small phone images when the large image appears.

I've created the icons for the phone, and copied the phone code, but keep getting a bunch of error messages, and haven't been able to alter it to get it working.

There was also a typo on a few lines with the directory names, where "phone/icons" should be "Phone/icons".

[SundownKid]

For the imagebutton it should probably be:

Code: Select all

imagebutton auto "Phone/phone_%s.png" action Show('mainphonescreen') xalign 0.0 yalign 0.0

(Where the images are phone_idle and phone_hover)

I actually got it working with text below the buttons:



Here's a sort of draggable "feed" you can use for internet/social network browsing:

[TrickWithAKnife]

What are you naming the actual icon images? Maybe I'm messing it up there.

[SundownKid]

In the code i posted they are called "1_idle" and "1_hover", etc.

You can change it in the path of the imagebutton called "1_%s".

[TrickWithAKnife]

Thanks, that was the problem.

[Bellalea]

This looks interesting, I'll be waiting for updates (:

[Destiny]

This is definitly a interesting code
I will not need it now, but if I'm going to make a second game someday, I will definitly think about it.
The possibilitys are really too tempting to ignore this ^^

[holly64]

This looks interesting, I'll be waiting for updates (:

Do you by chance know when these updates will be coming? Would also be cool if it integrated with voip or Mobile Voip smartphone capabilities.

Thanks in advance,

Holly

[TrickWithAKnife]

Probably not for a while. My game is the main focus, and right now it doesnt require the smartphone.

Plus id like to get some phone images, so i can modify the code to match the sizes etc.

[Trafagal]

Just came to visit this while looking for a Phone system. Thank you guys for the work. It is almost 10 years ago, I hope this still works.