6. diel - Animácie a ScatterLayout v Kivy a Pythone

Zdravím vás u ďalšej lekcie Pythone a Kivy frameworku. V minulej lekcii, Aplikácie Čítačka Kníh v Kivy a Pythone , sme si vytvorili aplikáciu Čítačka kníh a predstavili ScreenManager a PageLayout. V tej dnešnej si ukážeme ako fungujú animácie a ScatterLayout.

ScatterLayout

Najskôr si ukážeme, ako funguje ScatterLayout, pre ukážku nám poslúži Rectangle vnútri canvas u. So štvorcom pôjde voľne pohybovať, rotovať a ľubovoľne meniť jeho veľkosť. To všetko vďaka multi-touch podpore, ktorú Kivy framework ponúka. Ukážme si rovno funkčné kód:

import kivy
kivy.require("1.10.1")
from kivy.uix.scatterlayout import ScatterLayout
from kivy.graphics import Rectangle
from kivy.app import App

class MujWidget(ScatterLayout):

    def __init__(self, *args, **kwargs):
        super(MujWidget, self).__init__(*args, **kwargs)
        #Vytvoříme čtverec
        self.rect = Rectangle(size=(50, 50))
        #Přidáme čtverec do canvasu
        self.canvas.add(self.rect)

class MainApp(App):
    def build(self):
        return MujWidget()

root = MainApp()
root.run()

Teraz môžeme štvorcom voľne pohybovať, meniť veľkosť a rotovať. S myšou vytvoríte multi-touch bod pravým tlačidlom.

Ak budete takúto funkcionalitu potrebovať, určite si na ScatterLayout teraz spomeniete.

Animácie

Animácia nám umožňuje zmeniť vlastnosti widgetu, nastaviť samotné animáciu dobu a tiež pridať efekty prechodov, tzv. Transition. Zoznam priechodov, ktoré Kivy ponúka, nájdete v oficiálnej dokumentácii. Vytvoríme si ďalší ukážkovú aplikáciu, tentoraz využívajúce Animation:

import kivy
kivy.require("1.10.1")
from kivy.uix.widget import Widget
from kivy.graphics import Rectangle
from kivy.animation import Animation
from kivy.app import App

class MujWidget(Widget):

    def __init__(self, *args, **kwargs):
        super(MujWidget, self).__init__(*args, **kwargs)
        #Vytvoříme si widget, do kterého přidáme čtverec
        self.widget = Widget(size = (50, 50), pos = (225, 225))
        self.rect = Rectangle(size = self.widget.size, pos = self.widget.pos)
        self.widget.canvas.add(self.rect)
        self.add_widget(self.widget)
        #Vytvoříme animaci, která trvá 3 sekundy
        anim = Animation(x = 500, y = 400, duration = 3)
        #Spustíme animaci s widgetem
        anim.start(self.widget)
        #Jelikož nepoužíváme Kivy Language, musíme vytvořit bind, aby se aktualizoval i čtverec
        self.widget.bind(pos = self.update, size = self.update)

    def update(self, *args):
        self.rect.pos = self.widget.pos
        self.rect.size = self.widget.size

class MainApp(App):
    def build(self):
        return MujWidget()

root = MainApp()
root.run()

Animácie vyzerá nasledovne:

Sekvencie animácií

Kivy nám dovoľuje vytvoriť sekvenciu po sebe idúcich animácií. Ako príklad nám poslúži 2 na seba nadväzujúce animácie, ktoré sa budú opakovať:

import kivy
kivy.require("1.10.1")
from kivy.uix.widget import Widget
from kivy.graphics import Rectangle
from kivy.animation import Animation
from kivy.app import App

class MujWidget(Widget):

    def __init__(self, *args, **kwargs):
        super(MujWidget, self).__init__(*args, **kwargs)
        #Vytvoříme si widget, do kterého přidáme čtverec
        self.widget = Widget(size = (50, 50), pos = (225, 225))
        self.rect = Rectangle(size = self.widget.size, pos = self.widget.pos)
        self.widget.canvas.add(self.rect)
        self.add_widget(self.widget)
        #Vytvoříme 2 animace, které trvají každá 3 sekundy
        anim = Animation(x = 500, y = 400, duration = 3, t = "out_bounce") + Animation(x = 225, y = 225, duration = 3, t = "in_bounce")
        #Nastavíme opakování animací
        anim.repeat = True
        #Spustíme animaci s widgetem
        anim.start(self.widget)
        #Jelikož nepoužíváme Kivy Language, musíme vytvořit bind, aby se aktualizoval i čtverec
        self.widget.bind(pos = self.update, size = self.update)

    def update(self, *args):
        self.rect.pos = self.widget.pos
        self.rect.size = self.widget.size

class MainApp(App):
    def build(self):
        return MujWidget()

root = MainApp()
root.run()

Keďže sme pridali 2 opačné efekty, animácie na seba krásne nadväzujú

Zdrojový kód nájdete na stiahnutie v prílohe článku ako je tomu u všetkých lekcií. V lekcii budúci, Hra a reakcie na stlačenie klávesy v Kivy a Pythone , si vytvoríme hru a naučíme sa ako reagovať na stlačenie klávesy.

Mal si s čímkoľvek problém? Stiahni si vzorovú aplikáciu nižšie a porovnaj ju so svojím projektom, chybu tak ľahko nájdeš.