Ripple¶
Classes implements a circular and rectangular ripple effects.
To create a widget with сircular ripple effect, you must create a new class
that inherits from the CircularRippleBehavior
class.
For example, let’s create an image button with a circular ripple effect:
from kivy.lang import Builder
from kivy.uix.behaviors import ButtonBehavior
from kivy.uix.image import Image
from kivymd.app import MDApp
from kivymd.uix.behaviors import CircularRippleBehavior
KV = '''
#:import images_path kivymd.images_path
Screen:
CircularRippleButton:
source: f"{images_path}/kivymd.png"
size_hint: None, None
size: "250dp", "250dp"
pos_hint: {"center_x": .5, "center_y": .5}
'''
class CircularRippleButton(CircularRippleBehavior, ButtonBehavior, Image):
def __init__(self, **kwargs):
self.ripple_scale = 0.85
super().__init__(**kwargs)
class Example(MDApp):
def build(self):
self.theme_cls.theme_style = "Dark"
return Builder.load_string(KV)
Example().run()
To create a widget with rectangular ripple effect, you must create a new class
that inherits from the RectangularRippleBehavior
class:
from kivy.lang import Builder
from kivy.uix.behaviors import ButtonBehavior
from kivymd.app import MDApp
from kivymd.uix.behaviors import RectangularRippleBehavior, BackgroundColorBehavior
KV = '''
Screen:
RectangularRippleButton:
size_hint: None, None
size: "250dp", "50dp"
pos_hint: {"center_x": .5, "center_y": .5}
'''
class RectangularRippleButton(
RectangularRippleBehavior, ButtonBehavior, BackgroundColorBehavior
):
md_bg_color = [0, 0, 1, 1]
class Example(MDApp):
def build(self):
self.theme_cls.theme_style = "Dark"
return Builder.load_string(KV)
Example().run()
API - kivymd.uix.behaviors.ripple_behavior
¶
- class kivymd.uix.behaviors.ripple_behavior.CommonRipple¶
Base class for ripple effect.
- ripple_rad_default¶
Default value of the ripple effect radius.
ripple_rad_default
is anNumericProperty
and defaults to 1.
- ripple_color¶
Ripple color in
rgba
format.ripple_color
is anColorProperty
and defaults to None.
- ripple_alpha¶
Alpha channel values for ripple effect.
ripple_alpha
is anNumericProperty
and defaults to 0.5.
- ripple_scale¶
Ripple effect scale.
ripple_scale
is anNumericProperty
and defaults to None.
- ripple_duration_in_fast¶
Ripple duration when touching to widget.
ripple_duration_in_fast
is anNumericProperty
and defaults to 0.3.
- ripple_duration_in_slow¶
Ripple duration when long touching to widget.
ripple_duration_in_slow
is anNumericProperty
and defaults to 2.
- ripple_duration_out¶
The duration of the disappearance of the wave effect.
ripple_duration_out
is anNumericProperty
and defaults to 0.3.
- ripple_func_in¶
Type of animation for ripple in effect.
ripple_func_in
is anStringProperty
and defaults to ‘out_quad’.
- ripple_func_out¶
Type of animation for ripple out effect.
ripple_func_out
is anStringProperty
and defaults to ‘ripple_func_out’.
- abstract lay_canvas_instructions(self)¶
- start_ripple(self)¶
- finish_ripple(self)¶
- fade_out(self, *args)¶
- anim_complete(self, *args)¶
- on_touch_down(self, touch)¶
- on_touch_move(self, touch, *args)¶
- on_touch_up(self, touch)¶
- class kivymd.uix.behaviors.ripple_behavior.RectangularRippleBehavior¶
Class implements a rectangular ripple effect.
- ripple_scale¶
See
ripple_scale
.ripple_scale
is anNumericProperty
and defaults to 2.75.
- lay_canvas_instructions(self)¶
- class kivymd.uix.behaviors.ripple_behavior.CircularRippleBehavior¶
Class implements a circular ripple effect.
- ripple_scale¶
See
ripple_scale
.ripple_scale
is anNumericProperty
and defaults to 1.
- lay_canvas_instructions(self)¶