SwiftUI : 뷰가 생성 된 후 뷰의 전환을 동적으로 변경
뷰가 생성 된 후 뷰의 전환을 동적으로 변경하고 싶습니다 . 나는 상태 변수를 전환 isTransition1
사이에 스위치 버튼을 클릭 transition1
하고 transition2
아래로. 그러나 이러한 전환 중 하나가 불투명하면 의도 한대로 작동하지 않습니다. 전환 변경 직후 제거 할 뷰는 항상 원래 전환을 유지합니다. 놀랍게도 transition2
슬라이드로 변경 하면 문제없이 작동합니다. 제거 할보기는 새 전환을 사용합니다. 여기에서 불투명도를 작동시키는 방법이 있습니까?
let transition1 = AnyTransition.asymmetric(insertion: .move(edge: .trailing),
removal: .move(edge: .leading))
let transition2 = AnyTransition.opacity
struct Wrapper1<Content: View>: View {
let content: Content
var body: some View {
content
}
}
struct Wrapper2<Content: View>: View {
let content: Content
var body: some View {
content
}
}
struct TextView: View {
let count: Int
let color: Color
var body: some View {
ZStack {
color
.edgesIgnoringSafeArea(.all)
.frame(maxWidth: UIScreen.main.bounds.width,
maxHeight: UIScreen.main.bounds.height)
Text("Count: \(count)")
.font(.title)
.offset(y: -200)
}
}
}
struct ContentView: View {
@State private var count = 0
@State private var isTransition1 = false
var body: some View {
ZStack {
if count % 2 == 0 {
Wrapper1(content: TextView(count: count, color: Color.green)
.transition(isTransition1 ? transition1 : transition2))
} else {
Wrapper2(content: TextView(count: count, color: Color.red)
.transition(isTransition1 ? transition1 : transition2))
}
HStack(spacing: 100) {
Button(action: {
self.isTransition1.toggle()
}) {
Text("Toggle Transition").font(.title)
}
Button(action: {
withAnimation(.linear(duration: 2)) {
self.count += 1
}
}) {
Text("Increase").font(.title)
}
}
}
}
}
답변
1 Asperi
달성하려는 효과를 올바르게 이해했는지 확실하지 않지만 뷰 계층 구조를 재설정하십시오 (적어도 전환이 재설정되므로 서로 영향을 미치지 않습니다).
var body: some View {
ZStack {
if count % 2 == 0 {
Wrapper1(content: TextView(count: count, color: Color.green)
.transition(isTransition1 ? transition1 : transition2))
} else {
Wrapper2(content: TextView(count: count, color: Color.red)
.transition(isTransition1 ? transition1 : transition2))
}
HStack(spacing: 100) {
Button(action: {
self.isTransition1.toggle()
}) {
Text("Toggle Transition").font(.title)
}
Button(action: {
withAnimation(.linear(duration: 2)) {
self.count += 1
}
}) {
Text("Increase").font(.title)
}
}
}.id(isTransition1) // << here !!
}