.if(_:then:) | ios.dev

... there is yet another problem beyond animations. When you use applyIf with a view that contains a State property, all state will be lost when the condition changes. 👉 objc.io

In SwiftUI, views are structs which means that they don't have identity. For SwiftUI to animate changes, it needs to compare the value of the view before the animation started and the value of the view after the animation ends. SwiftUI then interpolates between the two values.

... the outermost type is a _ConditionalContent. This is an enum that will either contain the value from executing the if branch, or the value from executing the else branch. 👉 objc.io

extension View {
    /// transform self if `condition` is met.
    /// ```
    /// view.if(condition) { $0.hidden() }
    /// ```
    @ViewBuilder public func `if`<Content: View>(
        _    condition: Bool, 
        @ViewBuilder then transform: (Self) -> Content
    ) -> some View {
        if condition { transform(self) } 
        else { self }
    }
}

extension View {
    // .if(_:then:else:)
    @ViewBuilder public func `if`<T: View, F: View>(
        _ condition: Bool, 
        then doThis: (Self) -> T, 
        else doThat: (Self) -> F
    ) -> some View {
        if condition { doThis(self) } 
        else { doThat(self) }
    }
}

struct ContentView: View {
    
    let red  : Color? = .red
    let color: Color? = nil
    
    var body: some View {
        VStack {
            
            // .if()
            Text("Hello World")
                .if(true){ $0.padding() }
                .if(true){ $0.border(Color.black) }
                
            // .if(_:then:else:)
            Text("Hello World")
                // ⭐️ Swift 5.3: Multiple Trailing Closures
                // .if(true) { $0.padding() } else: { $0.background(Color.purple) }
                .if(false, then: { $0.padding() }, 
                    else: { $0.background(Color.purple) })
                
            // ⭐️ SwiftUI 新功能：目前沒作用！
            // .ifLet(_:then:)
            Text("Hello World")
                .ifLet(red) { $0.foregroundColor($1) }
            
        } // HStack
            .frame(maxWidth: .infinity, maxHeight: .infinity)
            .background(Color.gray)
            .padding()
            .background(Color.orange)
    }
}

Design+Code ⟩ Conditional modifier
SwiftLee ⟩ How to create a Conditional View Modifier in SwiftUI
Conditional view modifiers - Five Stars
objc.io ⟩ Why Conditional View Modifiers are a Bad Idea ⭐️
新版 SwiftUI 的 ViewBuilder 可以輸入 if let，switch & 宣告變數常數 - 彼得潘
[Swift 5.3預覽] Multiple Trailing Closures - 史努比的第一個家

Swift ⟩ Trailing Closures