Moving picture with mouse cursor (not drag)

[sculpteur]

Hello guys,

I don't have any problem but I would like some opinion before I jump into a new code alone a get a lot of troubles!

I would like your opinion about eh best way to make the system I gonna to describe to you.

First, Take a look at this picture I've done :

(Clik on it to enlarge)
https://i.ibb.co/s2DRfz2/Key-Hole-WORK-IN-PROGRESS.jpg
This is the final picture which is compose of this 2 other one :


The mask
https://i.ibb.co/FVqwyx8/Key-Hole-WORK- ... S-Mask.jpg
The image
https://i.ibb.co/YDWfVMT/Key-Hole-WORK- ... SS-Pic.jpg

Now, the thing is, I want the player to be able to move the mouse cursor around to explore the image without having to click anywhere, just moving the mouse cursor around.
(In order to simulate the head movement of the charcter who is peeping through the keyhole.

So I have no idea how to begin my coding but I'm almost sure this is possible.

I'm wondering mainly about this things :

Which part should be fix and which part should move : the image it self or the mask which cover it (the result should be the same)

Should I do a moving keyhole in all axes, or only x axis (left and right) ? so I could use a keyhoe mask with is png and way larger than the picture itself.

How do I limit my movement to avoid displaying part of the side of the images ?

And what code should I use ?


I know it's a lot but I was wondering maybe someone around here is familiar with this kind of thing or have already done it in it's own project so I could lead me in the right direction, thanks guys !

[drKlauz]

As player i think moving image make more sense than moving mask.
Y axis is probably not needed unless you want to have big image, just make sure mask is big enough to fit "target parts" of image without much precision.

Ok, idea of this nifty little feature was interesting, so here is my version

Code: Select all

define peek_mask_matrix=renpy.display.matrix.Matrix(
  [ 0,  0,  0,  0,
    0,  0,  0,  0,
    0,  0,  0,  0,
   -1,  0,  0,  1,]
  )

transform tf_peek_mask:
  matrixcolor peek_mask_matrix

init python:
  def tf_peek_pic_pos(tf,st,at):
    tf.xpos=max(0.25,min(0.75,renpy.get_mouse_pos()[0]/float(config.screen_width)))
    return 0

transform tf_peek_pic:
  xanchor 0.5
  function tf_peek_pic_pos

label start:
  scene pic at tf_peek_pic
  show mask at tf_peek_mask
  "*peek*"
  return

"pic" and "mask" are image names, i simple renamed your images and put them inside game/images folder.
Matrix thing needed only because i forgot how to copy color channel to alpha channel with ffmpeg
0.25-0.75 are pic movement limits.
You probably should add some check to see if game run with actual mouse as some machines/mobiles will produce weird result otherwise.

[plastiekk]

I think they should both move but at different speeds, simply looks more realistic (imho).
drKlaus function is really great! I tried around for a few minutes and this is what came out.
By the way: Boys, don't look through the keyhole all the time!

Code: Select all

# original code by drKlaus
define peek_mask_matrix=renpy.display.matrix.Matrix(
  [ 0,  0,  0,  0,
    0,  0,  0,  0,
    0,  0,  0,  0,
   -1,  0,  0,  1,]
  )

transform tf_peek_mask:
  matrixcolor peek_mask_matrix
  xsize config.screen_width+300      # added some pixel to fit my screen
  ysize config.screen_height+50      # added some pixel to fit my screen
  
  xanchor 0.3
  yanchor 0.2
  function tf_peek_pic_pos2

init python:
  def tf_peek_pic_pos(tf,st,at):
    tf.xpos=max(0.25,min(0.75,renpy.get_mouse_pos()[0]/float(config.screen_width)))
    return 0


  def tf_peek_pic_pos2(tf,st,at):
    tf.xpos=max(0.15,min(0.35,renpy.get_mouse_pos()[0]/float(config.screen_width)/2))
    tf.ypos=max(0.15,min(0.18,renpy.get_mouse_pos()[1]/float(config.screen_width)/2))
    return 0

    
    
    
transform tf_peek_pic:
  xanchor 0.5
  function tf_peek_pic_pos

label start:
  scene pic at tf_peek_pic
  show mask at tf_peek_mask
  "*peek*"
  return

[sculpteur]

Thank you really much guys, it worked just fine. I almost had no modification to adapt it to my code. It's really good !