Page 1 of 1
How to create a parallax in the main menu
Posted: Fri Feb 15, 2019 9:09 pm
by SomeDude
I've been trying to achieve this parallax effect on my main menu, but nothing I try seems to work.
I tried using the code provided by Geckos in this Topic:
viewtopic.php?t=47482
But this only seems to work in-game with the "show" statement and not the "add" statement which is what I used to create my background (my background is made up of multiple images, but I only want to move one of them so I don't think it's necessary to go into detail about it).
I also tried using this image tracking code provided by PyTom in this Topic:
viewtopic.php?t=28495
This worked, but I have no clue how to tinker with it even after reading the CDD renpy page.
I would like for the background image to follow the cursor, but only slightly. Is this possible? Or am I just looking for the wrong things entirely?
Re: How to create a parallax in the main menu
Posted: Mon Feb 18, 2019 2:42 pm
by SONTSE
SomeDude wrote: ↑Fri Feb 15, 2019 9:09 pm
I also tried using this image tracking code provided by PyTom in this Topic:
viewtopic.php?t=28495
This worked, but I have no clue how to tinker with it even after reading the CDD renpy page.
I would like for the background image to follow the cursor, but only slightly. Is this possible? Or am I just looking for the wrong things entirely?
this is exact line of PyTom's code you need to tinker.
Code: Select all
rv.blit(cr, (self.x - cw / 2, self.y - ch / 2))
what's within inner hooks is a coordinates of upper left corner of displayed image.
to tinker it we need to apply some math
below is my guess of exact formula. currently not in shape to properly test it though, but I hope you've got the point ^^
Code: Select all
factor = 30 # this is how much your image will move
csw,csh = (config.screen_width,config.screen_height)
cx = (self.x-csw/2)*factor/csw-cw/2
cy = (self.y-csh/2)*factor/csh-ch/2
rv.blit(cr, (cx,cy))
Re: How to create a parallax in the main menu
Posted: Tue Feb 19, 2019 7:58 pm
by SomeDude
Code: Select all
factor = 30 # this is how much your image will move
csw,csh = (config.screen_width,config.screen_height)
cx = (self.x-csw/2)*factor/csw-cw/2
cy = (self.y-csh/2)*factor/csh-ch/2
rv.blit(cr, (cx,cy))
[/quote]
Works perfectly! This is exactly what I needed. Thanks a bunch!
Re: How to create a parallax in the main menu
Posted: Wed May 08, 2019 9:51 pm
by lacticacid
Lena_Borodach wrote: ↑Mon Feb 18, 2019 2:42 pm
SomeDude wrote: ↑Fri Feb 15, 2019 9:09 pm
I also tried using this image tracking code provided by PyTom in this Topic:
viewtopic.php?t=28495
This worked, but I have no clue how to tinker with it even after reading the CDD renpy page.
I would like for the background image to follow the cursor, but only slightly. Is this possible? Or am I just looking for the wrong things entirely?
this is exact line of PyTom's code you need to tinker.
Code: Select all
rv.blit(cr, (self.x - cw / 2, self.y - ch / 2))
what's within inner hooks is a coordinates of upper left corner of displayed image.
to tinker it we need to apply some math
below is my guess of exact formula. currently not in shape to properly test it though, but I hope you've got the point ^^
Code: Select all
factor = 30 # this is how much your image will move
csw,csh = (config.screen_width,config.screen_height)
cx = (self.x-csw/2)*factor/csw-cw/2
cy = (self.y-csh/2)*factor/csh-ch/2
rv.blit(cr, (cx,cy))
Would you happen to know how to stop it from getting into its original position when the cursor goes past the edge of the window?
Re: How to create a parallax in the main menu
Posted: Thu May 09, 2019 11:37 am
by SONTSE
lacticacid wrote: ↑Wed May 08, 2019 9:51 pm
Would you happen to know how to stop it from getting into its original position when the cursor goes past the edge of the window?
on that occasion both x and y on UDD's 'event' section gain -1 value. so you just need to if these values out
insertion suggested below is somewhat brutal, but might work
Code: Select all
def event(self, ev, x, y, st):
#insert here
if x<0 or y<0:
return
#rest of code here
Re: How to create a parallax in the main menu
Posted: Thu May 09, 2019 9:31 pm
by lacticacid
Lena_Borodach wrote: ↑Thu May 09, 2019 11:37 am
lacticacid wrote: ↑Wed May 08, 2019 9:51 pm
Would you happen to know how to stop it from getting into its original position when the cursor goes past the edge of the window?
on that occasion both x and y on UDD's 'event' section gain -1 value. so you just need to if these values out
insertion suggested below is somewhat brutal, but might work
Code: Select all
def event(self, ev, x, y, st):
#insert here
if x<0 or y<0:
return
#rest of code here
Unfortunately, this doesn't seem to work!
Re: How to create a parallax in the main menu
Posted: Fri May 10, 2019 5:10 am
by SONTSE
whoops, just realized my remarks indented in a misleading way. this would be more clear
Code: Select all
def event(self, ev, x, y, st):
#insert here
if x<0 or y<0:
return
#rest of code here
in case of further hardships there is tested worknig example code
Code: Select all
#to run this toss any image into images dir of your project and rename it into 'image'
init python:
class TrackCursor(renpy.Displayable):
def __init__(self, child):
super(TrackCursor, self).__init__()
self.child = renpy.displayable(child)
self.x = None
self.y = None
def render(self, width, height, st, at):
rv = renpy.Render(width, height)
if self.x is not None:
cr = renpy.render(self.child, width, height, st, at)
cw, ch = cr.get_size()
factor = 300 # this is how much your image will move
csw,csh = (config.screen_width,config.screen_height)
cx = (self.x-csw/2)*factor/csw #-cw/2
cy = (self.y-csh/2)*factor/csh #-ch/2
rv.blit(cr, (cx,cy))
return rv
def event(self, ev, x, y, st):
if x<0 or y<0:
return
if (x != self.x) or (y != self.y):
self.x = x
self.y = y
renpy.redraw(self, 0)
image bgr = TrackCursor('image')
label main_menu:
return
label start:
show bgr
pause
return
Re: How to create a parallax in the main menu
Posted: Fri May 10, 2019 9:20 pm
by lacticacid
Lena_Borodach wrote: ↑Fri May 10, 2019 5:10 am
whoops, just realized my remarks indented in a misleading way. this would be more clear
Code: Select all
def event(self, ev, x, y, st):
#insert here
if x<0 or y<0:
return
#rest of code here
in case of further hardships there is tested worknig example code
Code: Select all
#to run this toss any image into images dir of your project and rename it into 'image'
init python:
class TrackCursor(renpy.Displayable):
def __init__(self, child):
super(TrackCursor, self).__init__()
self.child = renpy.displayable(child)
self.x = None
self.y = None
def render(self, width, height, st, at):
rv = renpy.Render(width, height)
if self.x is not None:
cr = renpy.render(self.child, width, height, st, at)
cw, ch = cr.get_size()
factor = 300 # this is how much your image will move
csw,csh = (config.screen_width,config.screen_height)
cx = (self.x-csw/2)*factor/csw #-cw/2
cy = (self.y-csh/2)*factor/csh #-ch/2
rv.blit(cr, (cx,cy))
return rv
def event(self, ev, x, y, st):
if x<0 or y<0:
return
if (x != self.x) or (y != self.y):
self.x = x
self.y = y
renpy.redraw(self, 0)
image bgr = TrackCursor('image')
label main_menu:
return
label start:
show bgr
pause
return
Nope. Pasted the entire code and it still doesn't work for me for some reason. The image only moves when the cursor is on the bottom right fourth of the screen.