[iOS]アニメーションとトランジション

import SwiftUI

struct ContentView: View {
    @State private var isBig = false

    var body: some View {
        VStack(spacing: 20) {
            Text("アニメーションの基本")
                .font(.title)

            Circle()
                .fill(.blue)
                .frame(width: isBig ? 200 : 100,
                       height: isBig ? 200 : 100)
                .animation(.easeInOut(duration: 0.5), value: isBig)

            Button("サイズ変更") {
                isBig.toggle()
            }
        }
        .padding()
    }
}

import SwiftUI

struct ContentView: View {
    @State private var showBox = false

    var body: some View {
        VStack(spacing: 20) {
            Text("トランジションの基本")
                .font(.title)

            if showBox {
                Rectangle()
                    .fill(.green)
                    .frame(width: 200, height: 150)
                    .transition(.slide)         // ← これがトランジション
                    .animation(.easeInOut, value: showBox)
            }

            Button(showBox ? "消す" : "表示") {
                showBox.toggle()
            }
        }
        .padding()
    }
}

import SwiftUI

struct ContentView: View {
    @State private var showCard = false

    var body: some View {
        VStack(spacing: 20) {
            Text("アニメーション + トランジション")
                .font(.title)

            if showCard {
                RoundedRectangle(cornerRadius: 16)
                    .fill(.orange)
                    .frame(width: 250, height: 160)
                    .shadow(radius: 10)
                    .padding()
                    .transition(.opacity.combined(with: .scale))
                    .animation(.spring(response: 0.4, dampingFraction: 0.6), value: showCard)
            }

            Button(showCard ? "隠す" : "表示") {
                showCard.toggle()
            }
        }
        .padding()
    }
}