Selección de opciones con Picker
Ofrezca opciones mediante selectores de menú y segmentados.
Selección de opciones con Picker es una lección gratuita de SwiftUI Academy en CoddyKit. Esta es la lección 4 de 4. Puedes leer la lección completa abajo gratuitamente — luego la practicas en el navegador con un editor de código integrado y un tutor de IA 24/7. Forma parte de la ruta de aprendizaje de SwiftUI Academy, y tu progreso se sincroniza en la web y la app de CoddyKit. El curso de SwiftUI Academy incluye 4 lecciones en total.
Partes de esta lección aún no han sido traducidas y se muestran en inglés.
Meet the Picker
A Picker lets users choose one option from several. It is the go-to for selecting a category, color, or plan. 📋
Picker Tracks a Selection
A Picker stores the selected value in state. As the user chooses, that bound property updates to match.
@State private var fruit = "Apple"Bind the Selection
Pass a label and the selection binding so the Picker knows which property to read and update.
Picker("Fruit", selection: $fruit) {
// options go here
}List the Options
Inside the closure, add a view per choice and tag each with its value using tag so selection can match it.
Text("Apple").tag("Apple")
Text("Pear").tag("Pear")Loop with ForEach
For many options, generate them with ForEach over an array instead of writing each row by hand.
ForEach(fruits, id: \.self) { name in
Text(name).tag(name)
}Match Selection Types
The selection type must match the tag type. If you select a String, every tag must also be a String.
The Menu Style
Apply pickerStyle to change the look. The menu style shows the choice and pops options on tap.
Picker("Fruit", selection: $fruit) { }
.pickerStyle(.menu)The Segmented Style
For a few short options, the segmented style lays them out as a row of side-by-side buttons.
.pickerStyle(.segmented)The Wheel Style
The wheel style shows a spinning drum, classic for dates or long lists where scrolling feels natural.
.pickerStyle(.wheel)React to the Choice
Read the bound value anywhere to react to the user's pick, like showing the selected fruit in a Text.
Text("You picked \(fruit)")The Full View
Here is a complete Picker: a selection binding, options from ForEach, and the segmented style applied.
struct ChooseView: View {
@State private var fruit = "Apple"
let fruits = ["Apple", "Pear"]
var body: some View {
Picker("Fruit", selection: $fruit) {
ForEach(fruits, id: \.self) { Text($0).tag($0) }
}
}
}Quick Check
Why must each Picker option be tagged?
Recap
A Picker binds to a selection, tags each option, and changes look with menu, segmented, or wheel styles. 📋
Aprende Swift con un tutor de IA — gratis
Escribe y ejecuta código real en tu navegador, obtén ayuda instantánea de un tutor de IA disponible 24/7 y continúa donde lo dejaste en la web o en la aplicación.
- Cursos
- 30
- Lecciones
- 120
Preguntas frecuentes
¿La lección «Selección de opciones con Picker» es gratis?
Sí — el texto completo de «Selección de opciones con Picker» es gratis para leer aquí en la web. Para practicarla de forma interactiva (editor de código integrado y tutor de IA 24/7) y desbloquear el resto del curso de SwiftUI Academy, actualiza a CoddyKit PRO. El curso de SwiftUI Academy incluye 4 lecciones en total.
¿Qué aprenderé en «Selección de opciones con Picker»?
Ofrezca opciones mediante selectores de menú y segmentados. Practicas SwiftUI Academy con código real que ejecutas directamente en el navegador, y un tutor de IA 24/7 responde tus preguntas mientras trabajas en la lección.
¿Necesito experiencia previa para empezar SwiftUI Academy?
No se requiere experiencia previa. SwiftUI Academy en CoddyKit está estructurado para principiantes hasta estudiantes avanzados, así que puedes empezar aquí o desde el inicio y avanzar a tu ritmo. Esta es la lección 4 de 4.
¿Cuánto tiempo toma la lección «Selección de opciones con Picker»?
La mayoría de las lecciones de CoddyKit toman alrededor de 5–10 minutos. Cada una es compacta e interactiva, así que avanzas constantemente y retomas exactamente por donde dejaste en la web y la app.
¿Puedo escribir y ejecutar código en esta lección de SwiftUI Academy?
Sí. Cada lección de SwiftUI Academy incluye un editor de código integrado, así que escribes y ejecutas código real directamente en tu navegador y obtienes retroalimentación instantánea de IA — sin configuración local necesaria.
Todas las lecciones de este curso
- Activación y desactivación con Toggle
- Elección de valores con Slider
- Incremento con Stepper
- Selección de opciones con Picker