Learning Kivy: Animate widgets

Hello everyone!

The Kivy framework provides the kivy.animation module to animate widgets. For any animation, we must specify certain values that represent the position of the animated object.

To use Animation in Kivy one needs to follow two simple steps namely:

1. Setup an Animation object
2. Use the Animation object on a Widget

There are two kinds of Animation that can be applied:

1. Sequential Animation

As the name suggests, it is used to join animations sequentially using the ‘+’ operator.

Example from Kivy docs:

anim = Animation(x=50) + Animation(size=(80, 80), duration=2.)
anim.start(widget)

The above example will animate to x=50 over 1 second, then animate size to (80, 80) over the next two seconds.

2. Parallel Animation

It is used join animations in parallel. It uses the ‘&’ operator.

Example from Kivy docs:

anim = Animation(pos=(80, 10))
anim &= Animation(size=(800, 800), duration=2.)
anim.start(widget)

The above example will animate position to (80, 10) over 1 second, while in parallel animating the first half of size=(800, 800).

Along with animations one can also use various Animation Transition properties to create custom animations for widgets. One can use built-in or custom transition functions using transition (or t= shortcut).

For example using the ‘in_quad’ transition as follows:

anim = Animation(x=50, size=(80, 80), t='in_quad')
anim.start(widget)

Here is a sample program to demonstrate the Animation module in Kivy:


import kivy
kivy.require('1.4.0')

from kivy.app import App
from kivy.uix.button import Button
from kivy.animation import Animation
from kivy.uix.widget import Widget

class MyAnimApp(App):

        def build(self):
            parent= Widget()
            button= Button(text='Animated', font_size=14)
            button.bind(on_press=self.on_button_press)
            parent.add_widget(button)
            return parent
          
        def on_button_press(self,instance):
            anim = Animation(x=50, size=(50, 50), t='in_out_bounce')
            #apply sequential animation
            anim += Animation(pos=(200,70),t='in_out_back')
            #apply parallel animation
            anim &= Animation(size=(100,50))
            anim.start(instance)
                        

if __name__== '__main__':
       MyAnimApp().run()

You can write the above code using the Python IDLE and run it as:

kivy yourfilename.py

Karan Balkar About Karan Balkar
self proclaimed extraterrestrial fandroid, computer engineer, amateur gamer and die hard punk rock fan!

4 thoughts on “Learning Kivy: Animate widgets

  1. Hi Karan
    Love your kivy tuts. How about one to show how one can connect to a database, post, edit and display entries? I’m New to kivy and python but have loads of Delphi experience. Tks for the tutorials.

  2. Hey Karan,
    I have a question. Can you call Animation(pos=(x,y),t=’in_out_back’) like this? I have a function that reads an x and y and I want to give them as values for pos. Is this possible?

Leave a Reply