Introduction to SwiftUI

Jun 20 2024 · Swift 5.10, iOS 17.3, Xcode 15.3

Lesson 03: Adaptable SwiftUI Views

SwiftUI Color Picker

Episode complete

Play next episode

Next

Heads up... You’re accessing parts of this content for free, with some sections shown as obfuscated text.

Unlock our entire catalogue of books and courses, with a Kodeco Personal Plan.

Unlock now

Heads up... You’re accessing parts of this content for free, with some sections shown as obfuscated text.

Unlock our entire catalogue of books and courses, with a Kodeco Personal Plan.

Unlock now

Intro

struct ContentView: View {
  var body: some View {
    VStack {
      Image(systemName: "globe")
        .imageScale(.large)
        .foregroundStyle(.tint)
      Text("Hello, world!")
    }
    .padding()
  }
}

struct ContentView: View {
  @State private var redValue = 0.0
  @State private var greenValue = 0.0
  @State private var blueValue = 0.0
  @State private var activeColor = Color.gray
  // ... rest of the view code
}

// Inside the VStack of ContentView
RoundedRectangle(cornerRadius: 24.0)
  .frame(width: 300, height: 250)
  .foregroundStyle(activeColor)
  .padding(.bottom, 24)

// Inside the VStack of ContentView
Text("Red")

HStack {
  Slider(value: $redValue, in: 0...255)
    .tint(.red)
  Text("\(Int(redValue.rounded()))")
}

Text("Green")

HStack {
  Slider(value: $greenValue, in: 0...255)
    .tint(.green)
  Text("\(Int(greenValue.rounded()))")
}

Text("Blue")

HStack {
  Slider(value: $blueValue, in: 0...255)
    .tint(.blue)
  Text("\(Int(blueValue.rounded()))")
}

Button("Set color") {
  activeColor = Color(red: redValue / 255.0, green: greenValue / 255.0, blue: blueValue / 255.0)
}
.buttonStyle(.borderedProminent)
.padding(16.0)
See forum comments
Cinema mode Download course materials from Github
Previous: SwiftUI-Views Next: Conclusion