Ray Wenderlich Course - SwiftUI (Part 5)

Here we go! So a bit of time now to continue with Laurie's course. Let's do this!

Start Time - 19:29

ForEach & Identifiable

Key paths - accessing the properties without accessing the actual values.

\. syntax.

\. self is used for simple types like strings.

Paused at 19:35; resumed at 19:55

UUID - unique identifier. Making a custom type that conforms to identifiable.

Nothing is actually working - with the picker or when using the custom type.

{
  
    let tips = RelaxationTip.demoTips
    
    @State private var selectedPickerIndex = 0
  
  var body: some View {
    Picker(selection: $selectedPickerIndex, label: Text("Relaxation actions")) {
    VStack {
        ForEach(0..<tips.count) { index in
            HStack {
           
            Image(self.tips[index].imageName)
        .resizable()
            .scaledToFit()
            Text(self.tips[index].tip)
      }
    }
  }
}
}

}
It says build succeeded but then does not actually build. Some error error message - not with the code but with some settings or something. 

This is a good time to save, then return to tomorrow. Too tired to do more today!

Stopped at 20:09 (20 minutes so far; will continue tomorrow!)

Continued three days later at 19:49!

So a bit mad at work but I'm back!

Lists and Forms

No more table views! Instead we have List. Cool.

This is much easier than what was there before. Before there was the whole p list thing. So will be interesting to see what other differences there are.

var body: some View {
    List {
        Section(header: Text("Main Treats"), footer: Text("More to come!")) {
      ForEach(0..<5) { Text("\($0)").tag($0) }
    }
  }
}


}

Nice!


There is a form component. There is a navigation component too. Putting a picker component inside a navigation one means that the format alters accordingly. 

OK, confusing stuff...

var body: some View {
    Form {
        Section {
            Picker(selection: $selectedSnackIndex, label: Text("Snack Type")) {
            ForEach(0..<treats.count) {
            Text(self.treats[$0].name).tag($0)
                }
                
            }
        }
        
    }
}
}

This is good exposure but I really should play around with my own ideas before just moving on. 

NavigationView {
    Form {
        Section {
            Picker(selection: $selectedSnackIndex, label: Text("Snack Type")) {
            ForEach(0..<treats.count) {
            Text(self.treats[$0].name).tag($0)
                }
                
            }
        }
        
        Section {
            Toggle(isOn: $isOn) {
                Text("Would you like some milk, my dude?")
            }
            
            if isOn {
                Text("Milk will cost you a little extra")
                    .foregroundColor(.gray)
                    .font(Font.system(size: 12))
            }
        }
        }
    .navigationBarTitle("Kitty Snacks!")
    }



So the last version!


struct ContentView: View {

@State private var
    selectedSnackIndex = 0
    
    @State private var isOn = false
    @State var textValue = ""
    
    let treats = Treat.demoTreats
    
  var body: some View {
    
    NavigationView {
    Form {
        Section {
            Picker(selection: $selectedSnackIndex, label: Text("Snack Type")) {
            ForEach(0..<treats.count) {
            Text(self.treats[$0].name).tag($0)
                }
                
            }
        }
        
        Section {
            Toggle(isOn: $isOn) {
                Text("Would you like some milk, my dude?")
            }
            
            if isOn {
                Text("Milk will cost you a little extra")
                    .foregroundColor(.gray)
                    .font(Font.system(size: 12))
            }
        }
        Section {
            TextField("Special requests", text: $textValue)
        }
        
        Section {
            Button(action: { })
            {
        HStack {
            Image(systemName: "paperplane")
                .foregroundColor(.blue)
            Text("Place your order")
        }
        }
        }
    .navigationBarTitle("Kitty Snacks!")
    }
}
}
}

And here's what we've made...


I'm stopping there - best to do a bit at a time, then experiment before the next video methinks.

Finish Time - 20:25 (36 minutes today; 56 in total)

So next time, I'm going to apply what I have learned so far to code that I am more interested in - something F1, Wrestling etc. etc. Anyway, I'm picking up lots here but it needs more context. But yes, it's a lot to take in so it's all good!


Comments

Popular posts from this blog

*Xcode Project Entry 2* F1 Quiz - part 1

Angela Yu Course Part 10 (up to lesson 112)

Angela Yu Xcode 12 Course - Part 7 (lectures 74 to 79)