Get your own website
Demo.swift
ContentView.swift
App.swift
 
import SwiftUI

struct CardsMatchedDemo: View {
  @Namespace private var ns
  @State private var expanded = false
  var body: some View {
    VStack(spacing: 16) {
      if expanded {
        Rounded(cornerRadius: 16)
          .fill(.blue.opacity(0.2))
          .matchedGeometryEffect(id: "card", in: ns)
          .frame(height: 160)
          .overlay(Text("Detail").font(.headline))
      } else {
        Rounded(cornerRadius: 12)
          .fill(.blue.opacity(0.2))
          .matchedGeometryEffect(id: "card", in: ns)
          .frame(height: 60)
          .overlay(Text("Card").font(.subheadline))
      }
      Button(expanded ? "Close" : "Open") {
        withAnimation(.spring()) { expanded.toggle() }
      }
    }
    .padding()
  }
}

                    
import SwiftUI

struct ContentView: View {
  var body: some View { CardsMatchedDemo() }
}

                    
import SwiftUI

@main
struct MyApp: App {
  var body: some Scene {
    WindowGroup { ContentView() }
  }
}