UIView.animate: co to je, animace vlastností UIView v iOS

Co je UIView.animate?

UIView.animate — statická metoda třídy UIView, představená v iOS 4 (2010). Poskytuje deklarativní API pro animaci animovatelných vlastností UIView: frame, bounds, center, alpha, transform, backgroundColor. Metoda přijímá blok (uzavření) se změnami vlastností — systém automaticky vytváří CABasicAnimation pro každou změněnou vlastnost.

Bloková syntaxe nahradila starou beginAnimations/commitAnimations (iOS 2-3) a stala se standardem animace v UIKit. Animace UIView.animate se provádějí na hlavním vlákně a neblokují UI. Ve výchozím nastavení je doba trvání animace 0.25 sekundy s křivkou easeInOut.

Podle údajů Apple WWDC 2023 je doporučeným způsobem animace v nových projektech SwiftUI s modifikátory .animation() a .transition(), ale UIKit.animate zůstává hlavním nástrojem pro podporu iOS 16 a nižších, stejně jako pro složité vlastní přechody.

Parametry a možnosti animace

UIView.animate poskytuje tři klíčové parametry: duration (trvání v sekundách), delay (zpoždění před začátkem) a options (sada bitových masek UIView.AnimationOptions). Options zahrnují curve (easeInOut, easeIn, easeOut, linear), repeat (opakování), autoreverse (automatické otočení), allowUserInteraction, beginFromCurrentState a overrideInheritedDuration.

Parametr options se kombinuje pomocí pole: [.curveEaseOut, .repeat, .autoreverse]. Animace s repeat a autoreverse plynule vrací View do počátečního stavu a opakuje se donekonečna. Pro konečný počet opakování použijte animateKeyframes.

Spring animace přes UIView.animate

Spring animace přidává fyzický efekt pružiny: objekt se nejen přesouvá z bodu A do B, ale přelétá cíl s tlumenými kmity. Parametry: usingSpringWithDamping (tlumení 0-1, kde 0 — maximální kmity) a initialSpringVelocity (počáteční rychlost pružiny).

Apple doporučuje usingSpringWithDamping v rozsahu 0.4-0.8 pro přirozené UI animace. Hodnota 0.5 vytváří znatelný odraz bez pocitu gumovosti. initialSpringVelocity = 1.0 odpovídá rychlosti 1 pt/s. Při 0 animace startuje z klidového stavu.

// Příklad spring a keyframe animace
import UIKit

class AnimatedView: UIView {

    func springBounce() {
        // Spring animace s tlumením
        UIView.animate(
            withDuration: 0.8,
            delay: 0,
            usingSpringWithDamping: 0.5,
            initialSpringVelocity: 1.0,
            options: [.allowUserInteraction],
            animations: {
                self.transform = CGAffineTransform(scaleX: 1.2, y: 1.2)
                self.alpha = 0.7
            },
            completion: { _ in
                UIView.animate(withDuration: 0.3) {
                    self.transform = .identity
                    self.alpha = 1.0
                }
            }
        )
    }

    func slideIn(from offset: CGFloat) {
        self.transform = CGAffineTransform(translationX: offset, y: 0)
        self.alpha = 0.0

        UIView.animate(
            withDuration: 0.6,
            delay: 0.1,
            options: [.curveEaseOut]
        ) {
            self.transform = .identity
            self.alpha = 1.0
        }
    }
}

Keyframe animace

UIView.animateKeyframes umožňuje rozdělit animaci na několik kroků (keyframes), každý s vlastním relativním časem a délkou. Metoda addKeyframe(withRelativeStartTime:relativeDuration:) přijímá časové hodnoty od 0 do 1 vzhledem k celkové délce animace.

Keyframe animace jsou užitečné pro vícekrokové efekty: pulzace tlačítka (zvětšení → pauza → návrat), sekvenční objevování prvků, složité deformace s mezistavy. Každý keyframe může mít svou vlastní křivku animace přes options.

// Keyframe animace se složitou sekvencí
func complexPulse() {
    UIView.animateKeyframes(withDuration: 2.0, delay: 0, options: [.repeat]) {
        UIView.addKeyframe(withRelativeStartTime: 0.0, relativeDuration: 0.25) {
            self.transform = CGAffineTransform(scaleX: 1.5, y: 1.5)
            self.alpha = 0.5
        }
        UIView.addKeyframe(withRelativeStartTime: 0.25, relativeDuration: 0.25) {
            self.transform = CGAffineTransform(scaleX: 0.8, y: 0.8)
            self.alpha = 0.8
        }
        UIView.addKeyframe(withRelativeStartTime: 0.5, relativeDuration: 0.5) {
            self.transform = .identity
            self.alpha = 1.0
        }
    }
}

// Animace s vnořenými uzavřeními
func animateCardTransition() {
    UIView.animate(withDuration: 0.4, delay: 0, options: [.curveEaseOut]) {
        self.transform = CGAffineTransform(scaleX: 0.95, y: 0.95)
    } completion: { _ in
        UIView.animate(withDuration: 0.3, delay: 0, options: [.curveEaseIn]) {
            self.transform = .identity
        }
    }
}

Vnitřní uspořádání: Core Animation pod kapotou

Pod kapotou UIView.animate deleguje animaci na CALayer každého UIView přes Core Animation (CAAnimation). Když změníte frame uvnitř bloku animace, systém vytvoří CABasicAnimation pro vlastnosti position a bounds příslušné vrstvy. Pokud se změní alpha — CABasicAnimation pro vlastnost opacity vrstvy.

Core Animation používá samostatný proces render server (backboardd na iOS), který zpracovává animace na frekvenci 120 Hz (ProMotion). UIView.animate neblokuje hlavní vlákno — změny vlastností jsou odesílány render serveru, který interpoluje snímky bez účasti aplikace.

Podle Apple mají animace přes UIView.animate režii ~2-3% CPU na každou změněnou vrstvu při 60 FPS. Pro hromadné animace (20+ objektů současně) se doporučuje použití CATransaction a ruční správa vrstev.

Pro ladění a vizualizaci UIKit animací použijte Xcode Debug View Hierarchy — zobrazuje aktivní CAAnimations na každé vrstvě, jejich trvání, křivku a aktuální stav. Pochopení vnitřního uspořádání Core Animation pomáhá vyhnout se problémům s výkonem u složitých animací a zvolit optimální přístup mezi UIView.animate a přímým použitím CABasicAnimation.