Transmission Hero Move Example

Example.swift

import SwiftUI
import Transmission // https://github.com/nathantannar4/Transmission

struct HeroMoveExample: View {
  let colors: [Color] = [.blue, .red, .green, .orange]

  var body: some View {
    NavigationStack {
      ScrollView(.vertical) {
        ForEach(colors, id: \.hashValue) { color in
          PresentationLink(
            transition: .matchedGeometry(options: .init(edges: .all, preferredCornerRadius: 10))
          ) {
            Destination(color: color)
          } label: {
            RoundedRectangle(cornerRadius: 10)
              .foregroundStyle(color)
              .frame(height: 100)
          }
        }
      }
      .padding(.horizontal)
      .navigationTitle("Hero Move Example")
    }
  }
}

struct Destination: View {
  @Environment(\.presentationCoordinator) private var presentationCoordinator

  let color: Color

  var body: some View {
    TransitionReader { proxy in
      ZStack(alignment: .topTrailing) {
        color
          .ignoresSafeArea(.all)

        Image(systemName: "x.circle.fill")
          .resizable()
          .frame(width: 30, height: 30)
          .onTapGesture {
            presentationCoordinator.dismiss()
          }
          .padding(.horizontal)
          .opacity(proxy.progress) // fade with transition
      }
    }
  }
}

#Preview {
  HeroMoveExample()
}