UIView.animate: यह क्या है, iOS में UIView गुणों का एनिमेशन

UIView.animate क्या है?

UIView.animate UIView वर्ग की एक स्थिर विधि है, जो iOS 4 (2010) में शुरू हुई। यह UIView के एनिमेटेबल गुणों: frame, bounds, center, alpha, transform, backgroundColor को एनिमेट करने के लिए एक घोषणात्मक API प्रदान करती है। यह विधि गुण परिवर्तनों के साथ एक ब्लॉक (क्लोज़र) स्वीकार करती है — सिस्टम प्रत्येक बदले गए गुण के लिए स्वचालित रूप से CABasicAnimation बनाता है।

ब्लॉक सिंटैक्स ने पुराने beginAnimations/commitAnimations (iOS 2-3) को बदल दिया और UIKit में एनिमेशन मानक बन गया। UIView.animate एनिमेशन मुख्य थ्रेड पर चलते हैं और UI को ब्लॉक नहीं करते। डिफ़ॉल्ट रूप से, एनिमेशन की अवधि easeInOut वक्र के साथ 0.25 सेकंड है।

Apple WWDC 2023 के अनुसार, नए प्रोजेक्ट्स में अनुशंसित एनिमेशन दृष्टिकोण SwiftUI है जिसमें .animation() और .transition() मॉडिफायर हैं, लेकिन UIView.animate iOS 16 और उससे नीचे के समर्थन के साथ-साथ जटिल कस्टम ट्रांज़िशन के लिए मुख्य उपकरण बना हुआ है।

एनिमेशन पैरामीटर और विकल्प

UIView.animate तीन मुख्य पैरामीटर प्रदान करता है: duration (सेकंड में अवधि), delay (शुरू होने से पहले विलंब), और options (UIView.AnimationOptions बिट मास्क का सेट)। Options में शामिल हैं curve (easeInOut, easeIn, easeOut, linear), repeat, autoreverse, allowUserInteraction, beginFromCurrentState और overrideInheritedDuration।

options पैरामीटर एक सरणी के माध्यम से संयुक्त किया जाता है: [.curveEaseOut, .repeat, .autoreverse]। repeat और autoreverse के साथ एनिमेशन View को उसकी प्रारंभिक स्थिति में सुचारू रूप से लौटाता है और अनिश्चित काल तक दोहराता है। सीमित संख्या में दोहराव के लिए, animateKeyframes का उपयोग करें।

UIView.animate के माध्यम से स्प्रिंग एनिमेशन

स्प्रिंग एनिमेशन एक भौतिक स्प्रिंग प्रभाव जोड़ता है: वस्तु केवल बिंदु A से B तक नहीं जाती, बल्कि अवमंदित दोलनों के साथ लक्ष्य को पार कर जाती है। पैरामीटर: usingSpringWithDamping (अवमंदन 0-1, जहाँ 0 अधिकतम दोलन है) और initialSpringVelocity (प्रारंभिक स्प्रिंग वेग)।

Apple प्राकृतिक UI एनिमेशन के लिए 0.4-0.8 की सीमा में usingSpringWithDamping की अनुशंसा करता है। मान 0.5 "रबड़ जैसा" महसूस किए बिना ध्यान देने योग्य उछाल पैदा करता है। initialSpringVelocity = 1.0 1 pt/सेकंड की गति से मेल खाता है। 0 पर, एनिमेशन विश्राम अवस्था से शुरू होता है।

// स्प्रिंग एनिमेशन और कीफ्रेम उदाहरण
import UIKit

class AnimatedView: UIView {

    func springBounce() {
        // अवमंदन के साथ स्प्रिंग एनिमेशन
        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
        }
    }
}

कीफ्रेम एनिमेशन

UIView.animateKeyframes आपको एक एनिमेशन को कई चरणों (कीफ्रेम) में विभाजित करने की अनुमति देता है, प्रत्येक का अपना सापेक्ष समय और अवधि होती है। addKeyframe(withRelativeStartTime:relativeDuration:) विधि कुल एनिमेशन अवधि के सापेक्ष 0 से 1 तक समय मान स्वीकार करती है।

कीफ्रेम एनिमेशन बहु-चरणीय प्रभावों के लिए उपयोगी हैं: बटन पल्स (वृद्धि → विराम → वापसी), अनुक्रमिक तत्व उपस्थिति, मध्यवर्ती अवस्थाओं के साथ जटिल विकृतियाँ। प्रत्येक कीफ्रेम का options के माध्यम से अपना एनिमेशन वक्र हो सकता है।

// जटिल अनुक्रम के साथ कीफ्रेम एनिमेशन
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
        }
    }
}

// नेस्टेड क्लोज़र के साथ एनिमेशन
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
        }
    }
}

आंतरिक संरचना: Core Animation अंतर्निहित रूप से

अंतर्निहित रूप से, UIView.animate Core Animation (CAAnimation) के माध्यम से प्रत्येक UIView के CALayer को एनिमेशन सौंपता है। जब आप एनिमेशन ब्लॉक के अंदर frame बदलते हैं, तो सिस्टम संबंधित लेयर के position और bounds गुणों के लिए CABasicAnimation बनाता है। यदि alpha बदला जाता है — लेयर के opacity गुण के लिए CABasicAnimation।

Core Animation एक अलग रेंडर सर्वर प्रक्रिया (iOS पर backboardd) का उपयोग करता है जो 120 Hz (ProMotion) पर एनिमेशन संसाधित करती है। UIView.animate मुख्य थ्रेड को ब्लॉक नहीं करता — गुण परिवर्तन रेंडर सर्वर को भेजे जाते हैं, जो एप्लिकेशन की भागीदारी के बिना फ्रेम को इंटरपोलेट करता है।

Apple के अनुसार, UIView.animate के माध्यम से एनिमेशन में 60 FPS पर प्रति बदली गई लेयर ~2-3% CPU का ओवरहेड होता है। बड़े पैमाने पर एनिमेशन (एक साथ 20+ ऑब्जेक्ट) के लिए, CATransaction और मैनुअल लेयर प्रबंधन का उपयोग करने की अनुशंसा की जाती है।

UIKit एनिमेशन को डीबग और विज़ुअलाइज़ करने के लिए, Xcode Debug View Hierarchy का उपयोग करें — यह प्रत्येक लेयर पर सक्रिय CAAnimations, उनकी अवधि, वक्र और वर्तमान स्थिति दिखाता है। Core Animation की आंतरिक संरचना को समझने से जटिल एनिमेशन के साथ प्रदर्शन समस्याओं से बचने और UIView.animate और CABasicAnimation के प्रत्यक्ष उपयोग के बीच इष्टतम दृष्टिकोण चुनने में मदद मिलती है।