Skip to content

Instantly share code, notes, and snippets.

@chriseidhof
Last active September 11, 2023 09:41
Show Gist options
  • Save chriseidhof/8145e639ad911402b75dd43c9ecbe8fe to your computer and use it in GitHub Desktop.
Save chriseidhof/8145e639ad911402b75dd43c9ecbe8fe to your computer and use it in GitHub Desktop.
//
import SwiftUI
struct ContentView: View {
@State private var toggle = true
@Namespace private var ns
var body: some View {
let box = Rectangle()
.fill(.tertiary)
.frame(width: 100, height: 100)
let circle = Circle()
.fill(.blue)
.overlay { Text("1").font(.title) }
.transition(.offset()) // no-op because .identity doesn't do what you'd expect
.matchedGeometryEffect(id: "id", in: ns)
Grid {
GridRow {
box
.overlay {
if toggle {
circle
.padding()
}
}
box
.overlay {
if !toggle {
circle
.padding()
}
}
}
GridRow {
box
box
}
}
.animation(.default.speed(0.1), value: toggle)
.contentShape(Rectangle())
.onTapGesture {
toggle.toggle()
}
.padding()
}
}
struct ContentView_Previews: PreviewProvider {
static var previews: some View {
ContentView()
}
}
//
import SwiftUI
struct ContentView: View {
@State private var toggle = true
@Namespace private var ns
var body: some View {
let box = Rectangle()
.fill(.tertiary)
.frame(width: 100, height: 100)
let circle = Circle()
.fill(.blue)
.overlay { Text("1").font(.title) }
Grid {
GridRow {
box
.matchedGeometryEffect(id: "box0", in: ns)
box
.matchedGeometryEffect(id: "box1", in: ns)
}
GridRow {
box
box
}
}
.overlay {
circle
.padding()
.matchedGeometryEffect(id: toggle ? "box0" : "box1", in: ns, isSource: false)
}
.animation(.default.speed(0.1), value: toggle)
.contentShape(Rectangle())
.onTapGesture {
toggle.toggle()
}
.padding()
}
}
struct ContentView_Previews: PreviewProvider {
static var previews: some View {
ContentView()
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment