Combinación de pestañas con pilas
Asigne a cada pestaña su propia NavigationStack.
Combinación de pestañas con pilas 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.
Tabs Plus Navigation
Most real apps let users tap a tab and then drill into detail screens. That means mixing TabView with NavigationStack. 🧭
One Stack per Tab
The pattern is simple: give every tab its own NavigationStack so each section has independent push and pop history.
Wrapping a Tab Screen
Put a NavigationStack inside each tab and place that tab content within it. The tab bar stays put while you navigate.
NavigationStack {
HomeScreen()
}
.tabItem { Label("Home", systemImage: "house") }Stack Lives Inside TabView
Order matters: NavigationStack goes inside the TabView, never the other way around, so the bar never scrolls away.
Independent History
Because each tab owns its stack, drilling deep in one tab leaves the others untouched when you come back.
A Full Combined Example
Here two tabs each wrap their screen in a stack, giving Home and Search their own navigation.
TabView {
NavigationStack { HomeScreen() }
.tabItem { Label("Home", systemImage: "house") }
NavigationStack { SearchScreen() }
.tabItem { Label("Search", systemImage: "magnifyingglass") }
}Pushing Detail Views
Inside a tab use NavigationLink as usual to push detail screens onto that tab own stack.
NavigationLink("Details") {
DetailScreen()
}Titles Stay Per Tab
Set navigationTitle inside each stack so every tab shows its own title in the bar at the top.
Switching Tabs Keeps Depth
Move to another tab and back and your position in that tab navigation is preserved, just like native apps.
Avoid Stacking the Bar
Never wrap the whole TabView in a single NavigationStack. That can push the tab bar around in odd ways.
A Scalable Structure
This tab-plus-stack layout scales cleanly. Add a tab, give it a stack, and the rest of the app keeps working. ✨
Quick Check
Let us check the right way to nest navigation with tabs.
Recap: Combining Tabs with Stacks
Wrap each tab content in its own NavigationStack inside the TabView, and every section gets independent navigation with a steady tab bar. 🎉
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 «Combinación de pestañas con pilas» es gratis?
Sí — el texto completo de «Combinación de pestañas con pilas» 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 «Combinación de pestañas con pilas»?
Asigne a cada pestaña su propia NavigationStack. 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 «Combinación de pestañas con pilas»?
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
- Creación de una barra de pestañas
- Elementos de pestaña e insignias
- Vinculación de la pestaña seleccionada
- Combinación de pestañas con pilas