image button help

mickydoo · Nov 29, 2019

I have a video playing and have image buttons on a screen over the top of it to change camera/positions etc. Works good, but if the player clicks on anywhere where the buttons are not the scene skips. Can I make it so you can't click the screen, just the buttons?

anne O'nymous · Nov 29, 2019

mickydoo said:
Can I make it so you can't click the screen, just the buttons?

Option 1, the

You must be registered to see the links

screen property, that will prevent the player to click outside of the screen :

Code:

screen whatever():
    modal True

    imagebutton:
        auto "whatever"
        action whatever

Option 2, create your own modal-like screen :

Python:

screen whatever():

    #  Every click outside of the following image buttons will be
    # for this one.
    imagebutton:
        idle Solid( "#00000000" )
        xpos 0 ypos 0
        xsize config.screen_width
        ysize config.screen_height
        action NullAction()

    imagebutton:
        auto "whatever"
        action whatever

Not really needed in this particular case, but always good method to know. Useful in case where you can't use the modal property, by example because you have an internal sub screen :

Python:

screen whatever():

    default opened = False

    if opened is True:
        #  Every click outside of the following image buttons will be
        # for this one.
        imagebutton:
            idle Solid( "#00000000" )
            xpos 0 ypos 0
            xsize config.screen_width
            ysize config.screen_height
            action NullAction()

       [...]
    else:
        textbutton "Edit":
            action SetScreenVariable( "opened", True )

   [...]

Or if you intend to have dialog lines during the video :

Python:

screen whatever():

    #  Every click outside of the following image buttons will be
    # for this one.
    imagebutton:
        idle Solid( "#00000000" )
        xpos 0 ypos 0
        xsize config.screen_width
        # 250 is the default size of the say window.
        #  Therefore, cover the screen and its still shown clickable UI,
        # but let the player click on the say window to advance the
        # dialog.
        ysize config.screen_height - 250
        action NullAction()

    imagebutton:
        auto "whatever"
        action whatever

You can also use it to cover part of the buttons of the UI that shouldn't be clicked, while still letting available those that can be clicked.
Personally I use it a lot when modding, since I can't edit the original screen to put if that will show or not the buttons.

Option 3, put the video directly into the screen, to have an universal player :

Python:

screen videoPlayer( views ):

    # By default, use the first view.
    default actual = 0

    # Show the video for the actual view.
    add views[actual]

    vbox:
        # For each view..
        for i in range( 0, len( views ) ):
            # add an image button...
            imagebutton:
                # correctly named...
                auto ( "videoButton{}_%s.png".format( i ) )
                # that will change the view.
                action SetScreenVariable( "actual", i )

        imagebutton:
            auto "videoButtonReturn_%s.png"
            action Return()

label whatever:
    call screen videoPlayer( [ "images/videos/BJ1.webm", "images/videos/BJ2.webm", images/videos/BJ3.webm" ] )

You need to have at least images named "videoButton1_idle.png", "videoButton2_idle.png", "videoButton3_idle.png", and so on to cover the maximal number of views.

This one is the one I prefer, one single screen and all your videos are automatically covered.

mickydoo · Nov 30, 2019

anne O'nymous said:
Option 1, the
You must be registered to see the links
screen property, that will prevent the player to click outside of the screen :

Code:

screen whatever(): modal True imagebutton: auto "whatever" action whatever

Option 2, create your own modal-like screen :

Python:

screen whatever(): # Every click outside of the following image buttons will be # for this one. imagebutton: idle Solid( "#00000000" ) xpos 0 ypos 0 xsize config.screen_width ysize config.screen_height action NullAction() imagebutton: auto "whatever" action whatever

Not really needed in this particular case, but always good method to know. Useful in case where you can't use the modal property, by example because you have an internal sub screen :

Python:

screen whatever(): default opened = False if opened is True: # Every click outside of the following image buttons will be # for this one. imagebutton: idle Solid( "#00000000" ) xpos 0 ypos 0 xsize config.screen_width ysize config.screen_height action NullAction() [...] else: textbutton "Edit": action SetScreenVariable( "opened", True ) [...]

Or if you intend to have dialog lines during the video :

Python:

screen whatever(): # Every click outside of the following image buttons will be # for this one. imagebutton: idle Solid( "#00000000" ) xpos 0 ypos 0 xsize config.screen_width # 250 is the default size of the say window. # Therefore, cover the screen and its still shown clickable UI, # but let the player click on the say window to advance the # dialog. ysize config.screen_height - 250 action NullAction() imagebutton: auto "whatever" action whatever

You can also use it to cover part of the buttons of the UI that shouldn't be clicked, while still letting available those that can be clicked.
Personally I use it a lot when modding, since I can't edit the original screen to put if that will show or not the buttons.

Option 3, put the video directly into the screen, to have an universal player :

Python:

screen videoPlayer( views ): # By default, use the first view. default actual = 0 # Show the video for the actual view. add views[actual] vbox: # For each view.. for i in range( 0, len( views ) ): # add an image button... imagebutton: # correctly named... auto ( "videoButton{}_%s.png".format( i ) ) # that will change the view. action SetScreenVariable( "actual", i ) imagebutton: auto "videoButtonReturn_%s.png" action Return() label whatever: call screen videoPlayer( [ "images/videos/BJ1.webm", "images/videos/BJ2.webm", images/videos/BJ3.webm" ] )

You need to have at least images named "videoButton1_idle.png", "videoButton2_idle.png", "videoButton3_idle.png", and so on to cover the maximal number of views.

This one is the one I prefer, one single screen and all your videos are automatically covered.

Thank you (again lol) my game would be a jigsaw puzzle without a lid going around in a linear circle without ppl like you.

mickydoo · Nov 30, 2019

anne O'nymous said:
Option 1, the
You must be registered to see the links
screen property, that will prevent the player to click outside of the screen :

Code:

screen whatever(): modal True imagebutton: auto "whatever" action whatever

Option 2, create your own modal-like screen :

Python:

screen whatever(): # Every click outside of the following image buttons will be # for this one. imagebutton: idle Solid( "#00000000" ) xpos 0 ypos 0 xsize config.screen_width ysize config.screen_height action NullAction() imagebutton: auto "whatever" action whatever

Not really needed in this particular case, but always good method to know. Useful in case where you can't use the modal property, by example because you have an internal sub screen :

Python:

screen whatever(): default opened = False if opened is True: # Every click outside of the following image buttons will be # for this one. imagebutton: idle Solid( "#00000000" ) xpos 0 ypos 0 xsize config.screen_width ysize config.screen_height action NullAction() [...] else: textbutton "Edit": action SetScreenVariable( "opened", True ) [...]

Or if you intend to have dialog lines during the video :

Python:

screen whatever(): # Every click outside of the following image buttons will be # for this one. imagebutton: idle Solid( "#00000000" ) xpos 0 ypos 0 xsize config.screen_width # 250 is the default size of the say window. # Therefore, cover the screen and its still shown clickable UI, # but let the player click on the say window to advance the # dialog. ysize config.screen_height - 250 action NullAction() imagebutton: auto "whatever" action whatever

You can also use it to cover part of the buttons of the UI that shouldn't be clicked, while still letting available those that can be clicked.
Personally I use it a lot when modding, since I can't edit the original screen to put if that will show or not the buttons.

Option 3, put the video directly into the screen, to have an universal player :

Python:

screen videoPlayer( views ): # By default, use the first view. default actual = 0 # Show the video for the actual view. add views[actual] vbox: # For each view.. for i in range( 0, len( views ) ): # add an image button... imagebutton: # correctly named... auto ( "videoButton{}_%s.png".format( i ) ) # that will change the view. action SetScreenVariable( "actual", i ) imagebutton: auto "videoButtonReturn_%s.png" action Return() label whatever: call screen videoPlayer( [ "images/videos/BJ1.webm", "images/videos/BJ2.webm", images/videos/BJ3.webm" ] )

You need to have at least images named "videoButton1_idle.png", "videoButton2_idle.png", "videoButton3_idle.png", and so on to cover the maximal number of views.

This one is the one I prefer, one single screen and all your videos are automatically covered.

I have just gotten around to trying this and its not working, this is my code

Python:

screen pen_blw1:
    modal True

    hbox:
        xalign 1.0
        yalign 0
        imagebutton auto "pblow1_%s.png" action Jump("pull_me")

screen pen_blw2:
    modal True

    hbox:
        xalign 1.0
        yalign 0.1
        imagebutton auto "pblow2_%s.png" action Jump("suck_me")

screen pen_blw3:
    modal True

    hbox:
        xalign 1.0
        yalign 0.2
        imagebutton auto "pblow3_%s.png" action Jump("penny_8fuck")

Thats the screen for my 3 image buttons, I am using show screen to bring them up, but the modal thingy is doing nothing.

anne O'nymous · Nov 30, 2019

Note: I'm a bit out of service today, so I'll perhaps say something stupid for once.

mickydoo said:
Thats the screen for my 3 image buttons, I am using show screen to bring them up, but the modal thingy is doing nothing.

A shown screen is supposed to stay will the dialog continue, therefore, the click can't be blocked. It would lead to a dead end, you can't click to make the dialog advance and reach the line where the screen is hidden, and there's possibly no action on the screen that will hide it ; for a called screen not having action is a design error, but for a shown one it's natural.
I never looked for this, but apparently in this case the modal property is ignored.

Therefore, you have to fallback to the second option.

Porcus Dev · Nov 30, 2019

mickydoo said:
I have just gotten around to trying this and its not working, this is my code

Python:

screen pen_blw1: modal True hbox: xalign 1.0 yalign 0 imagebutton auto "pblow1_%s.png" action Jump("pull_me") screen pen_blw2: modal True hbox: xalign 1.0 yalign 0.1 imagebutton auto "pblow2_%s.png" action Jump("suck_me") screen pen_blw3: modal True hbox: xalign 1.0 yalign 0.2 imagebutton auto "pblow3_%s.png" action Jump("penny_8fuck")

Thats the screen for my 3 image buttons, I am using show screen to bring them up, but the modal thingy is doing nothing.

Maybe adding an image as a background will block interactivity outside the screen; or a "zorder".
I also think it's better, if you use "show", to hide the "screen" just before the "action" you want the button to do.

Python:

screen pen_blw1:
    modal True
    zorder 101    ## Keep screen at the top
    add "image_pen_blw1"   ## background image, but that's not the solution if you play an animation :-p
    hbox:
        xalign 1.0
        yalign 0
        imagebutton auto "pblow1_%s.png" focus_mask True action Hide("pen_blw1"), Jump("pull_me")   ## Added focus mask

mickydoo · Dec 1, 2019

mgomez0077 said:
Maybe adding an image as a background will block interactivity outside the screen; or a "zorder".
I also think it's better, if you use "show", to hide the "screen" just before the "action" you want the button to do.

Python:

screen pen_blw1: modal True zorder 101 ## Keep screen at the top add "image_pen_blw1" ## background image, but that's not the solution if you play an animation :-p hbox: xalign 1.0 yalign 0 imagebutton auto "pblow1_%s.png" focus_mask True action Hide("pen_blw1"), Jump("pull_me") ## Added focus mask

Righto, because I am a coding hack, for the life of me I could not get what anne O'nymous said to work.

BUT mgomez0077 you are officially now my new best friend. For two reasons.

Firstly I never knew you could put multiple actions til now.

AND Your background idea, I made a hack. I made a 1920 x 1080 blank.png, I made a screen using it just with NullAction, and by showing it aswell nothing including my buttons can be clicked on, so I made it 1880 x 1080 and display at left and woohoo it works.

Edit - I dont know if I had to make it 1880 x 1080 but it works, Im not fucking touching it

anne O'nymous · Dec 1, 2019

mickydoo said:
BUT mgomez0077 you are officially now my new best friend.

What do he have more than me ?

just kidding, of course, but it was too tempting

Porcus Dev · Dec 1, 2019

mickydoo · Dec 1, 2019

anne O'nymous said:
What do he have more than me ?

just kidding, of course, but it was too tempting

I'm a bit of a slut, you will be back on top next week.
(That didn't come out the best)

Porcus Dev · Dec 1, 2019

It may seem like I'm like "Aristotle" because I'm learning from the best... anne O'nymous is the fucking " Plato "!!

Now seriously, if I can give those tips (which sometimes work and sometimes don't) it's because I've had to struggle with those same kinds of problems... overcoming them is when you learn; and that's done more easily with the help of those who know

Porcus Dev · Dec 1, 2019

Oh, by the way... if it worked for you to create a blank image, maybe the best thing would be to create a transparent image, the PNG format allows it, so you won't have to use strange resolutions.

mickydoo · Dec 1, 2019

mgomez0077 said:
Oh, by the way... if it worked for you to create a blank image, maybe the best thing would be to create a transparent image, the PNG format allows it, so you won't have to use strange resolutions.

It is transparent its just a blank .png. I dont think I needed to change the resolution, I think Modal True was the issue, for some reason even though it did nothing it bugged out me hack. I'll look later, fucked around enough on this for now.

Porcus Dev · Dec 1, 2019

mickydoo said:
It is transparent its just a blank .png. I dont think I needed to change the resolution, I think Modal True was the issue, for some reason even though it did nothing it bugged out me hack. I'll look later, fucked around enough on this for now.

First rule: "If it works, don't touch it" LOL

anne O'nymous · Dec 1, 2019

mgomez0077 said:
Now seriously, if I can give those tips (which sometimes work and sometimes don't) it's because I've had to struggle with those same kinds of problems... overcoming them is when you learn; and that's done more easily with the help of those who know

How do you think that myself I can help ? I just struggled way more often than you, it's all.
Well, perhaps not strictly "it's all", all those years I past coding, both for food and for fun, make it that I start with more knowledge, so find the solution more easily. Yet, this knowledge come from all the errors I made during those said years.

Isn't there a quote saying that "there isn't genius, just people who've done more errors than the others", or something like this ?

[to take with care, I past to much time working on my mod for SuperPowered and it's now past 4AM here]
This said, mickydoo , you don't need to have a full image. Normally a 1x1 image would be enough if you ask Ren'py to dimension it for you with Frame( "image/whatever its name.png", size=( config.screen_width, config.screen_height ).
Therefore something like :

Code:

image noClick = Frame( "image/whatever its name.png", size=( config.screen_width, config.screen_height )

screen whatever():
    [...]

    imagebutton:
        idle noClick
        action NullAction()

should do it.
But well, test with a none transparent image first, just to be sure that I still have at least two neurons working at this hour.

the66 · Dec 1, 2019

mickydoo said:
Thats the screen for my 3 image buttons, I am using show screen to bring them up, but the modal thingy is doing nothing.

how should 3 simultaneous modal screens work? create 1 screen with the 3 buttons and make that screen modal.

mickydoo · Dec 1, 2019

the66 said:
how should 3 simultaneous modal screens work? create 1 screen with the 3 buttons and make that screen modal.

I'll try that before I release this chapter, I have nearly finished it and Ill look at it then and let you know if it worked.

Porcus Dev · Dec 1, 2019

Oh, shit... I didn't know that they was part of a single screen that you wanted to visualize at the same time.

You can try that:

Code:

screen pen_all:
    modal True
    zorder 101

    hbox:
        xalign 1.0
        yalign 0.0
        imagebutton auto "pblow1_%s.png" focus_mask True action Hide("pen_all"), Jump("pull_me")
        spacing 20
        imagebutton auto "pblow2_%s.png" focus_mask True action Hide("pen_all"), Jump("suck_me")
        spacing 20
        imagebutton auto "pblow3_%s.png" focus_mask True action Hide("pen_all"), Jump("penny_8fuck")

image button help

mickydoo

Fudged it again.

anne O'nymous

I'm not grumpy, I'm just coded that way.

mickydoo

Fudged it again.

mickydoo

Fudged it again.

anne O'nymous

I'm not grumpy, I'm just coded that way.

Porcus Dev

Engaged Member

mickydoo

Fudged it again.

anne O'nymous

I'm not grumpy, I'm just coded that way.

Porcus Dev

Engaged Member

mickydoo

Fudged it again.

Porcus Dev

Engaged Member

Porcus Dev

Engaged Member

mickydoo

Fudged it again.

Porcus Dev

Engaged Member

anne O'nymous

I'm not grumpy, I'm just coded that way.

the66

beware, the germans are cumming

mickydoo

Fudged it again.

Porcus Dev

Engaged Member