First of all, thank you for the thread. I've made a click speed test game. Also, I have successfully added the timer just because of you. Now my question is that how can I add a ripple effect as this click test game
https://clickingspeedtester.com/kohi-click-test/ did. Anyone can guide me please?
It just looks like a circle is created each time you click and it expands. Then it disappears after reaching a certain size. I don't know what you're using but I think it'd be best to have a list of circles, use a for statement to cycle through them and expand them as well as check their size. If they're big enough then remove them from the list. On another line of code, display all the circles in the list, unless what you're using works differently. My example would work best in a library such as pygame where you're constantly updating the screen and when an object stops being drawn on the screen it "disappears"
That effect is more that just a circle, there is a drawing effect applied when it is blit, and or the images are translucent. The color stacks up with overlapping circles, and they fade as they expand.
ripple_list = []
class Ripple:
def __init__(self, pos):
self.pos = pos
self.radius = 0
self.max_radius = 50
self.surf = pygame.Surface((self.max_radius*2, self.max_radius*2)
self.rect = self.surf.get_rect()
self.surf.fill((0,0,0))
self.surface.set_colorkey((0,0,0))
self.alpha = 255
self.surf.set_alpha(self.alpha)
self.color = (0, 0, 255)
self.fade = 2
self.growth_speed = 2
self.rect.center = self.pos
def update(self):
if self.radius < self.max_radius:
self.surf.fill((0,0,0))
pg.draw.circle(self.surf, self.color, (self.max_radius, self.max_radius), self.radius)
self.alpha -= self.fade
self.radius += self.growth_rate
else:
ripple_list.remove(self)
When you click, spawn a ripple with
ripple_list.append(Ripple(Your_mouse_pos))
. And each frame:
for r in ripple_list:
r.update()
for r in ripple_list:
your_game_window.blit(r.image, r.rect)
That will get you started.
(Feb-16-2021, 03:38 AM)michael1789 Wrote: [ -> ]That effect is more that just a circle, there is a drawing effect applied when it is blit, and or the images are translucent. The color stacks up with overlapping circles, and they fade as they expand.
ripple_list = []
class Ripple:
def __init__(self, pos):
self.pos = pos
self.radius = 0
self.max_radius = 50
self.surf = pygame.Surface((self.max_radius*2, self.max_radius*2)
self.rect = self.surf.get_rect()
self.surf.fill((0,0,0))
self.surface.set_colorkey((0,0,0))
self.alpha = 255
self.surf.set_alpha(self.alpha)
self.color = (0, 0, 255)
self.fade = 2
self.growth_speed = 2
self.rect.center = self.pos
def update(self):
if self.radius < self.max_radius:
self.surf.fill((0,0,0))
pg.draw.circle(self.surf, self.color, (self.max_radius, self.max_radius), self.radius)
self.alpha -= self.fade
self.radius += self.growth_rate
else:
ripple_list.remove(self)
When you click, spawn a ripple with ripple_list.append(Ripple(Your_mouse_pos))
. And each frame:
for r in ripple_list:
r.update()
for r in ripple_list:
your_game_window.blit(r.image, r.rect)
That will get you started.
instead of using ripple_list as a global variable I think something like this would be better:
def update(self):
if self.radius < self.max_radius:
self.surf.fill((0,0,0))
pg.draw.circle(self.surf, self.color, (self.max_radius, self.max_radius), self.radius)
self.alpha -= self.fade
self.radius += self.growth_rate
return False
else:
return True
for r in ripple_list:
if r.update():
ripple_list.remove(r)
for r in ripple_list:
your_game_window.blit(r.image, r.rect)