UIView.animateとは、iOSでのUIViewプロパティアニメーション

UIView.animateとは？

UIView.animateは、iOS 4（2010年）で導入されたUIViewクラスの静的メソッドです。UIViewのアニメーション可能なプロパティ（frame、bounds、center、alpha、transform、backgroundColor）をアニメーションするための宣言的APIを提供します。このメソッドはプロパティ変更を含むブロック（クロージャ）を受け入れます — システムは変更された各プロパティに対して自動的にCABasicAnimationを作成します。

ブロック構文は古いbeginAnimations/commitAnimations（iOS 2-3）に取って代わり、UIKitでのアニメーションの標準となりました。UIView.animateアニメーションはメインスレッドで実行され、UIをブロックしません。デフォルトでは、アニメーションの長さはeaseInOut曲線で0.25秒です。

Apple WWDC 2023によると、新しいプロジェクトでの推奨アニメーションアプローチは.animation()および.transition()モディファイアを使用したSwiftUIですが、UIView.animateはiOS 16以下および複雑なカスタムトランジションのサポートにおいて主要なツールであり続けています。

アニメーションのパラメータとオプション

UIView.animateは3つの主要なパラメータを提供します：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は、120 Hz（ProMotion）でアニメーションを処理する別個のレンダーサーバープロセス（iOSのbackboardd）を使用します。UIView.animateはメインスレッドをブロックしません — プロパティ変更はレンダーサーバーに送信され、アプリケーションの関与なしにフレームを補間します。

Appleによると、UIView.animateによるアニメーションは60 FPSで変更されたレイヤーあたり約2-3%のCPUオーバーヘッドがあります。多数のアニメーション（同時に20+オブジェクト）の場合は、CATransactionと手動のレイヤー管理を使用することをお勧めします。

UIKitアニメーションのデバッグと可視化には、Xcode Debug View Hierarchyを使用してください — 各レイヤーのアクティブなCAAnimation、その長さ、曲線、現在の状態が表示されます。Core Animationの内部構造を理解することで、複雑なアニメーションでのパフォーマンス問題を回避し、UIView.animateとCABasicAnimationの直接使用の間で最適なアプローチを選択できます。