Home Python C Language C ++ HTML 5 CSS Javascript Java Kotlin SQL DJango Bootstrap React.js R C# PHP ASP.Net Numpy Dart Pandas Digital Marketing

Graphics and Animations


Kivy provides powerful tools for creating rich graphical user interfaces with smooth animations. Here's an overview of how to work with graphics and animations in Kivy.


Graphics

Kivy uses the Canvas to manage drawing operations. The Canvas contains a sequence of drawing instructions that define the visual appearance of widgets. Here are the basic components:

Canvas Instructions

Rectangle:Draws a rectangle.

Ellipse: Draws an ellipse or circle.

Line:Draws a line.

Color: Sets the color for subsequent drawing instructions.

Example


from kivy.app import App
from kivy.uix.widget import Widget
from kivy.graphics import Rectangle, Color

class MyWidget(Widget):
    def __init__(self, **kwargs):
        super(MyWidget, self).__init__(**kwargs)
        with self.canvas:
            Color(1, 0, 0, 1)  # Set color to red
            self.rect = Rectangle(pos=(100, 100), size=(200, 100))

class MyApp(App):
    def build(self):
        return MyWidget()

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

            

Animations

Kivy provides the Animation class for creating animations. Animations can animate various properties of widgets such as pos, size, color, etc.


Basic Animation :Create an animation to move a widget from one position to another.


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

class MyApp(App):
    def animate(self, instance):
        animation = Animation(x=300, y=300, duration=2)
        animation.start(instance)

    def build(self):
        btn = Button(size_hint=(None, None), size=(100, 50), text='Animate Me')
        btn.bind(on_press=self.animate)
        return btn

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

            

In this example, clicking the button triggers an animation that moves it to the coordinates (300, 300) over a duration of 2 seconds.


Chaining AnimationsAnimations can be chained together to create complex sequences.


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

class MyApp(App):
    def animate(self, instance):
        animation = Animation(x=300, y=300, duration=2) + Animation(size=(200, 200), duration=1)
        animation.start(instance)

    def build(self):
        btn = Button(size_hint=(None, None), size=(100, 50), text='Animate Me')
        btn.bind(on_press=self.animate)
        return btn

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

            

Here, the button first moves to (300, 300) over 2 seconds and then changes its size to (200, 200) over 1 second.


Repeating Animations Animations can also be looped or repeated.


                from kivy.app import App
                from kivy.uix.button import Button
                from kivy.animation import Animation
                
                class MyApp(App):
                    def animate(self, instance):
                        animation = Animation(x=300, y=300, duration=2) + Animation(size=(200, 200), duration=1)
                        animation &= Animation(color=(1, 0, 0, 1), duration=1)  # Change color to red
                        animation.repeat = True  # Repeat the animation
                        animation.start(instance)
                
                    def build(self):
                        btn = Button(size_hint=(None, None), size=(100, 50), text='Animate Me')
                        btn.bind(on_press=self.animate)
                        return btn
                
                if __name__ == '__main__':
                    MyApp().run()                  
            

In this example, the animation repeats indefinitely.


Combining Animations Animations can be combined to run simultaneously.


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

class MyApp(App):
    def animate(self, instance):
        move = Animation(x=300, y=300, duration=2)
        resize = Animation(size=(200, 200), duration=1)
        color_change = Animation(color=(1, 0, 0, 1), duration=1)
        animation = move & resize & color_change  # Combine animations to run simultaneously
        animation.start(instance)

    def build(self):
        btn = Button(size_hint=(None, None), size=(100, 50), text='Animate Me')
        btn.bind(on_press=self.animate)
        return btn

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

            

In this example, the button moves, resizes, and changes color simultaneously.




Advertisement





Q3 Schools : India


Online Complier

HTML 5

Python

java

C++

C

JavaScript

Website Development

HTML 5

Python

java

C++

C

JavaScript

Campus Learning

C

C#

java