100 Days of SwiftUI - Day 24 项目3

挑战

尝试以下方式扩展之前的程序：

1. 创建一个自定义ViewModifier（和附带的View扩展名），使视图具有适合于视图的蓝色大标题。
2. 返回项目1，如果用户选择了0％小费，使用条件修饰符将文本总数视图更改为红色。
3. 返回猜旗项目2，并创建一个FlagImage()视图，该视图使用已经有的修饰符来渲染一个旗帜。

代码如下

struct TopTitle: ViewModifier {
    
    var title: String
    func body(content: Content) -> some View {
        
        VStack(spacing: 10) {
            Text(title)
                .font(.largeTitle)
                .foregroundColor(.blue)
            content
        }
    }
}

extension View {
    
    func topTitleStyle(with text: String) -> some View {
        self.modifier(TopTitle(title: text))
    }
}

.topTitleStyle(with: "My title")

    var is0Percentage: Bool {
        let tipSelection = Double(tipPercentages[tipPercentage])
        if tipSelection == 0 {
            return true
        } else {
            return false
        }
    }

Text("$\(totalAmount, specifier: "%.2f")")
        .foregroundColor(is0Percentage ? .red : .primary)

struct FlagImage: View {
    
    var name: String
    var body: some View {
        Image(name)
            .renderingMode(.original)
            .clipShape(Capsule())
            .overlay(Capsule().stroke(Color.black, lineWidth: 1.0))
            .shadow(color: .black, radius: 2)
    }
}

FlagImage(name: countries[number])