Day 23, 24 of #100DaysOfSwiftUI

Start 100DaysOfSwiftUI from 2020.Mar.18th.

Day 23, 24: Project 3, part one and two
done with 1 hour

New findings: followings are new to me

environment modifier like .font(.title)
how to define new Modifier and use it

Challenge.1

struct LargeBlue: ViewModifier {
    func body(content: Content) -> some View {
        content
            .font(.largeTitle)
            .foregroundColor(Color.blue)
    }
}

struct LargeBlue: ViewModifier {

func body(content: Content) -> some View {

content

.font(.largeTitle)

.foregroundColor(Color.blue)

}

Challenge.2

var body: some View {
    NavigationView {
        Form {
            Section {
                TextField("Amount", text: $checkAmount)
                    .keyboardType(.decimalPad)
                TextField("Number of People", text: $numberOfPeople)
                    .keyboardType(.decimalPad)
            }
            Section(header: Text("How much tip do you want to leave?")) {
                Picker("Tip percentage", selection: $tipPercentage) {
                    ForEach(0 ..< tipPercentages.count) {
                        Text("\(self.tipPercentages[$0])%")
                    }
                }
            .pickerStyle(SegmentedPickerStyle())
            }
            Section(header: Text("Total amount for the check")) {
                Text("$\(totalAmountForCheck, specifier: "%.2f")")
                    .background(tipPercentage == 4 ? Color.red : Color.white)
                
            }

            Section(header: Text("Amount per person")) {
                Text("$\(totalPerPerson, specifier: "%.2f")")
            }
        }.navigationBarTitle("WeSplit")
    }
}

var body: some View {

NavigationView {

Form {

Section {

TextField("Amount", text: $checkAmount)

.keyboardType(.decimalPad)

TextField("Number of People", text: $numberOfPeople)

.keyboardType(.decimalPad)

}

Section(header: Text("How much tip do you want to leave?")) {

Picker("Tip percentage", selection: $tipPercentage) {

ForEach(0 ..< tipPercentages.count) {

Text("\(self.tipPercentages[$0])%")

}

.pickerStyle(SegmentedPickerStyle())

}

Section(header: Text("Total amount for the check")) {

Text("$\(totalAmountForCheck, specifier: "%.2f")")

.background(tipPercentage == 4 ? Color.red : Color.white)

}

Section(header: Text("Amount per person")) {

Text("$\(totalPerPerson, specifier: "%.2f")")

}

}.navigationBarTitle("WeSplit")

}

Challenge.3

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

struct FlagImage : View {

var flagName:String

var body: some View {

Image(flagName)

.renderingMode(.original)

.clipShape(Capsule())

.overlay(Capsule().stroke(Color.black, lineWidth: 1))

.shadow(color: .black, radius: 2)

}

Sponsor Link

コメントを残す コメントをキャンセル

コメントを残すコメントをキャンセル