如何应用修饰符或按条件查看

时间:2019-11-25 10:18:29

标签: swiftui

@State var modifierEnabled : Bool

struct BlankModifier: ViewModifier {
    func body(content: Content) -> some View {
        content
    }
}

extension View {
    func TestModifierView() -> some View{
       return self.modifier(BlankModifier())
    }
}

操作方法

  1. 仅在BlankModifier情况下应用modifierEnabled == true
  2. 仅在TestModifierView的情况下如何应用modifierEnabled == true

2 个答案:

答案 0 :(得分:1)

extension View {
   func `if`<Content: View>(_ conditional: Bool, content: (Self) -> Content) -> some View {
        if conditional {
            return AnyView(content(self))
        } else {
            return AnyView(self)
        }
    }
}

,在这种情况下适用于视图:

Button() {}
   .if(modifierEnabled) { content in
        content.TestModifierView()
    }

用于应用自定义修饰符:

Button() {}
   .if(modifierEnabled) { content in
        content.modifier(BlankModifier())
    }

答案 1 :(得分:0)

我喜欢没有类型橡皮擦的解决方案。看起来很严格而且优雅。

public extension View {
    @ViewBuilder
    func modify<TrueContent: View, FalseContent: View>(_ condition: Bool, ifTrue modificationForTrue: (Self) -> TrueContent, ifFalse modificationForFalse: (Self) -> FalseContent) -> some View {
        if condition {
            modificationForTrue(self)
        } else {
            modificationForFalse(self)
        }
    }
}

用法

HStack {
...
            }
            .modify(modifierEnabled) { v in
                    v.font(.title)
                } ifFalse: {
                    $0.background(Color.red) // even shorter
                }

如果仅计划应用修饰符(或修饰符链),请考虑以下事项:

@available(iOS 13.0, OSX 10.15, tvOS 13.0, watchOS 6.0, *)
public extension View {
    @ViewBuilder func modifier<VM1: ViewModifier, VM2: ViewModifier>(_ condition: @autoclosure () -> Bool, applyIfTrue: VM1, applyIfFalse: VM2
) -> some View {
        if condition() {
           self.modifier(applyIfTrue)
        } else {
           self.modifier(applyIfFalse)
        }
    }
}

用法几乎与常规.modifier一样简单。

...

    Form {
        HStack {
...
            }
            .modifier(modifierEnabled, applyIfTrue: CornerRotateModifier(amount: 8, anchor: .bottomLeading), applyIfFalse: EmptyModifier())

...

为简洁起见,您可以省略applyIfFalse部分,如果条件为假,则只需省略return self.erase()