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)
}
}
}
}
}
जवाब
सुनिश्चित नहीं हैं कि अगर मैंने सही ढंग से समझा कि आपने क्या प्रभाव हासिल करने की कोशिश की, लेकिन दृश्य पदानुक्रम को रीसेट करने का प्रयास करें (कम से कम यह निश्चित रूप से बदलाव को रीसेट करता है, इसलिए वे एक दूसरे को प्रभावित नहीं करते हैं):
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 !!
}