Lemma Soft Forums

Posted: **Sun Aug 15, 2010 6:55 pm**

Okay, I already posted this code before, but it was to take care of a different problem, so allow me to discuss it from scratch here.. I've already taken care of the issue over there, but I left this other one for later, and I suppose now is later.

I have my script up and running with no problems, it works as it should, but picky as I am I want it to run exactly the way I want... :/

The true code is WAY too large to post it here, so instead let's say I have this code:

Code: Select all

label music_map:

    $ result = renpy.imagemap("ground.jpg", "hover.png", [
        (480, 280, 620, 320, "tune1"),
        (480, 330, 620, 370, "tune2"),
        (480, 380, 620, 420, "tune3"),
        (655, 140, 815, 210, "stop_music"),
        (585, 525, 840, 570, "exit") 
        ], focus="imagemap")

    if result == "tune1":
        stop music fadeout 0.5
        play music "tune_one.ogg"
        show pic_one with dissolve
        $renpy.pause()
        jump music_map

    elif result == "tune2":
        stop music fadeout 0.5
        play music "tune_two.ogg"
        show pic_two with dissolve
        $renpy.pause()
        jump music_map

    elif result == "tune3":
        stop music fadeout 0.5
        play music "tune_three.ogg"
        show pic_three with dissolve
        $renpy.pause()
        jump music_map

    elif result == "stop_music":
        stop music fadeout 0.5
        jump music_map

    elif result == "exit":
        jump another_label_I_cant_be_bothered_to_declare_for_an_example

With this code, the user clicks on a button to listen to a tune while an image shows up with details about the music. BUT... as you can tell by reading the above code, the user would have to click again to be able to go back to the imagemap and click on another tune, which while it keeps playing the tune, hides the forementioned image.

What I want is the image to show and the tune to play, but while they're still on screen, the user should be able to browse the other buttons normally... with the hover functions and all.

Any ideas? ...need me to rephrase? 'cuz I barely understand myself here sometimes. xP

Posted: **Sun Aug 15, 2010 11:06 pm**

Does it still work if you don't have the renpy.pause()? cause I don't see any reason for it to be there.

As far as showing the buttons and the image at the same time, I think you just need the ground and hover images to be transparent at that part of the screen. Of course, I haven't tried it myself, but if that doesn't work, there's always ui.buttons...

Posted: **Mon Aug 16, 2010 11:49 am**

Oh it all works just fine, I use the pause function to avoid the image to show for an instant and then jump back to the imagemap, with the pause, the user clicks on the button, then the image shows but it doesn't vanish until the next click.

And yes, I use transparent PNGs, so they show just well, where they should and all, what I need is the imagemap working with the hover functions and everything while the last image is still showing.

Let's put it this way: My question is How do I set an image to show so it doesn't dissapear when ren'py jumps to the imagemap, unless I tell it to hide?

Posted: **Mon Aug 16, 2010 12:04 pm**

vaanknight wrote: Let's put it this way: My question is How do I set an image to show so it doesn't dissapear when ren'py jumps to the imagemap, unless I tell it to hide?

I'm pretty sure your images aren't disappearing, they're being covered up by the image map. You might have set your hover image to a transparent PNG, but looking at the code you posted before:

Code: Select all

    $ result = renpy.imagemap("ground.jpg", "hover.png", [

You're using a .jpg ground image, which is the base non-hover image for the imagemap... which means that it will cover up everything else on the layer when it gets shown. Have you also replaced this image with a transparent PNG?

Posted: **Mon Aug 16, 2010 12:11 pm**

Ah, my bad... I mistakenly wrote .jpg there, but the actual image is .png, and yes, transparent, although I already tried that out before and I didn't like it since I can't put a dissolve statement to the imagemap itself. ...or can I? because if so, all I'd need is to know how to and I'd be able to code it all myself!

Posted: **Mon Aug 16, 2010 1:18 pm**

put a dissolve statement to the imagemap itself

use renpy.transition() as listed here: http://www.renpy.org/wiki/renpy/doc/ref ... transition

Posted: **Mon Aug 16, 2010 3:41 pm**

vaanknight wrote:Ah, my bad... I mistakenly wrote .jpg there, but the actual image is .png, and yes, transparent, although I already tried that out before and I didn't like it since I can't put a dissolve statement to the imagemap itself. ...or can I? because if so, all I'd need is to know how to and I'd be able to code it all myself!

There must be something else wrong with your code, then, because I copied and pasted the code above and it worked absolutely fine for me with ground and hover images that had transparent backgrounds. I've attached the modified version of my code to this post, you can compare it to what you've got already.

As KimiYoriBaka notes, you can use the renpy.transition() to get the imagemap to show with a dissolve, but it will always just disappear abruptly. One way to get around this is simply to define a Ren'Py image for your imagemap ground image, and show that with a dissolve immediately before your imagemap, and then hide it with a dissolve immediately afterward. The user probably won't notice (or care) that they can't click the imagemap buttons while they're fading in and out, and it looks a lot nicer.

(You can do all this 'properly' with the Displayable versions of the UI Button and Image widgets, but if you're using imagemaps 'cause they're easier than UI then that solution is in completely the wrong direction complexity-wise.)

Posted: **Mon Aug 16, 2010 6:26 pm**

I have made the very same menu using UI buttons, the code for either way works perfectly, as you already saw, but I still have the same problem, since the issue is that I can't make ren'py keep the image on screen while the button layout is active and working.

Jake wrote:One way to get around this is simply to define a Ren'Py image for your imagemap ground image, and show that with a dissolve immediately before your imagemap, and then hide it with a dissolve immediately afterward. The user probably won't notice (or care) that they can't click the imagemap buttons while they're fading in and out, and it looks a lot nicer.

I usually do precisely that, but the problem is that using the show statement, the images appearing from the clicked tune buttons stack up one over the other and make it look like a mess. instead I include the ground.png image with the "scene" statement just before the imagemap, which obviously is the root of my "dissapearing" trouble, but it's necessary to avoid having each and every clicked image there.

so what I want is to be able to keep the image in its place while the imagemap shows up again after the user's click that jumps to the start of the label.

Just as I write this, though... I think I have an idea of how to get exactly what I want, using the renpy.transition() thingie KimiYoriBaka mentioned, but noob question... where do I put it?

Posted: **Mon Aug 16, 2010 6:36 pm**

vaanknight wrote: I usually do precisely that, but the problem is that using the show statement, the images appearing from the clicked tune buttons stack up one over the other and make it look like a mess. instead I include the ground.png image with the "scene" statement just before the imagemap, which obviously is the root of my "dissapearing" trouble

Indeed it is! You didn't mention the 'scene' before, it's definitely the cause - that statement removes everything from the screen.

If you don't want your displayed images to 'stack up' there's a far simpler way to do it than blitzing everything: just make sure they all have the same tag.

The 'tag' of an image is the first part of its defined name. So if you have a set of images like:

Code: Select all

  image eileen normal = "e_n.png"
  image eileen happy = "e_h.png"
  image eileen upset = "e_u.png"

all of these images have the same tag: "eileen". Whenever any of them is shown, Ren'Py searches the scene for already-shown images with the tag 'eileen' and if it finds one, instead of just showing the new image over the top, it replaces the existing image with the new one. So there will never be more than one image on-screen with the same tag at the same time unless you deliberately tell Ren'Py to do that.

So in this case, instead of defining your images as "pic_one", "pic_two", etc., you could define them as "pic one", "pic two" and so on, and you'll get the same behaviour - Ren'Py will automatically replace "pic one" with "pic three" and then later replace "pic three" with "pic two", because they have the same tag.

(In fact, if you look at the example code I posted, you'll see I did just this with the images I defined in there, for the same reason.)

vaanknight wrote: Just as I write this, though... I think I have an idea of how to get exactly what I want, using the renpy.transition() thingie KimiYoriBaka mentioned, but noob question... where do I put it? :shock:

If you do want to do this still, then just stick it directly before the call to renpy.imagemap.

Posted: **Mon Aug 16, 2010 6:58 pm**

Ahhhhhhh, light shines upon me now... Thanks a bunch, I didn't know about the tag thingie. I'll use it that way and I'm sure I'll get it to work. I'll edit this post to tell if it went well. :]

EDIT: Erm, I did make it work, but I didn't like how it went. :/ The thing is that I already have the menu design made and is perfect for my taste, so I don't wanna change so much of it just to fix such a simple thing. I'll stick with the old code I had, so Thank You very much for your answers guys, it's always good to learn something new in Ren'Py.

Posted: **Tue Aug 17, 2010 2:41 pm**

6.11's screen system should make this a lot easier then 6.10's imagemaps. Basically, you'd want 2 screens:

Code: Select all

screen music_room:
    imagemap:
          ground "ground.jpg"
          hover "hover.jpg"
          
          hotspot (480, 280, 140, 40) action [ Play("tune1.jpg"), Show("music_info", info="tune1.jpg") ]
          hotspot (480, 320, 140, 40) action [ Play("tune2.jpg"), Show("music_info", info="tune2.jpg") ]
          hotspot (480, 360, 140, 40) action [ Stop(), Hide("music_info") ]
          hotspot (480, 400, 140, 40) action Return()

screen music_info:
    zorder 1
    add info xpos 40 ypos 40

label music_room:
    call screen music_room
    return

Posted: **Tue Aug 17, 2010 2:47 pm**

Oh wow, I've got to try that out... and it also looks like it will solve a couple of other issues I've came across with other imagemaps. Thanks, I'll post how it went.

Then again, I'll have to learn how to use the new functions first.

Code: Select all

    hide vaan_satisfied with amazement

Posted: **Tue Apr 26, 2011 10:17 am**

This question is related to the code Pytom posted above. Just wondering if anyone here tried it and was successful with it because when I tried it, I keep getting this error.

Code: Select all

I'm sorry, but an uncaught exception occurred.

TypeError: __init__() takes exactly 3 arguments (2 given)

While running game code:
 - script at line 48 of D:\Renpy\Projects\Sample/game/script.rpy
 - python at line 532 of renpy-6.12.0-mainline/common/00statements.rpy.
 - python at line 14 of D:\Renpy\Projects\Sample/game/script.rpy.

The code I have is pretty much similar to the code above, and I only changed the image names.

Posted: **Thu Apr 28, 2011 12:02 am**

Ah. I didn't test it. The code:

Code: Select all

screen music_room:
    imagemap:
          ground "ground.jpg"
          hover "hover.jpg"
          
          hotspot (480, 280, 140, 40) action [ Play("music", "tune1.jpg"), Show("music_info", info="tune1.jpg") ]
          hotspot (480, 320, 140, 40) action [ Play("music", "tune2.jpg"), Show("music_info", info="tune2.jpg") ]
          hotspot (480, 360, 140, 40) action [ Stop("music"), Hide("music_info") ]
          hotspot (480, 400, 140, 40) action Return()

screen music_info:
    zorder 1
    add info xpos 40 ypos 40

label music_room:
    call screen music_room
    return

should work, or at least fail for a different reason. (Since I still didn't test it.)

Posted: **Wed May 04, 2011 12:50 pm**

I tried the code but not as a "hotspot" but under an if/else statement and using imagebutton

Code: Select all

if persistent.music1 == True:
            imagebutton xpos 100 ypos 130:
                idle "unlockeda.png"
                hover "unlockeda.png"
                action Play[("music", "music1.mp3"), Show("music_info", info ="unlockedb.png")]
        else:
            imagebutton xpos 100 ypos 130:
                idle "locked.png"
                hover "locked.png"

screen music_info:
    zorder 1
    add info xpos 100 ypos 130

Then I had this error.

Code: Select all

I'm sorry, but an uncaught exception occurred.

TypeError: 'type' object is unsubscriptable

I am really doing my best to work with screens, please don't give up on me yet... OTL

Lemma Soft Forums

Seriously specific functions on an imagemap... ideas?

Seriously specific functions on an imagemap... ideas?

Re: Seriously specific functions on an imagemap... ideas?

Re: Seriously specific functions on an imagemap... ideas?

Re: Seriously specific functions on an imagemap... ideas?

Re: Seriously specific functions on an imagemap... ideas?

Re: Seriously specific functions on an imagemap... ideas?

Re: Seriously specific functions on an imagemap... ideas?

Re: Seriously specific functions on an imagemap... ideas?

Re: Seriously specific functions on an imagemap... ideas?

Re: Seriously specific functions on an imagemap... ideas?

Re: Seriously specific functions on an imagemap... ideas?

Re: Seriously specific functions on an imagemap... ideas?

Re: Seriously specific functions on an imagemap... ideas?

Re: Seriously specific functions on an imagemap... ideas?

Re: Seriously specific functions on an imagemap... ideas?