Espaçamento e alinhamento em pilhas
Ajuste o espaçamento e o alinhamento entre visualizações empilhadas.
Espaçamento e alinhamento em pilhas é uma aula grátis de SwiftUI Academy no CoddyKit. Esta é a aula 4 de 4. Você pode ler a aula completa abaixo gratuitamente — depois pratica ao vivo no navegador com um editor de código integrado e um tutor de IA 24/7. Faz parte do caminho de aprendizado de SwiftUI Academy, e seu progresso é sincronizado entre a web e o app CoddyKit. O curso de SwiftUI Academy inclui 4 aulas no total.
Partes desta aula ainda não foram traduzidas e aparecem em inglês.
Fine-Tuning Your Stacks
You can stack views in three directions, but real layouts need control over the gaps and edges between them. Let's tune that. 🎛️
The spacing Argument
Every stack accepts a spacing value that sets the gap between its children. A bigger number spreads views farther apart.
VStack(spacing: 20) {
Text("Top")
Text("Bottom")
}Zero Spacing
Pass spacing: 0 to remove the gap entirely, so children sit flush against each other. This is handy for tight, edge-to-edge designs.
Default Spacing
If you skip the argument, SwiftUI picks a sensible default gap that matches Apple's design guidelines. You only override it when you need to.
Aligning a VStack
A VStack's alignment argument controls horizontal placement. Use .leading to left-align children instead of centering them.
VStack(alignment: .leading) {
Text("Name")
Text("Email")
}Leading, Center, Trailing
VStack alignment offers .leading, .center, and .trailing. They decide whether children hug the left, the middle, or the right edge.
Aligning an HStack
An HStack's alignment is vertical instead. Use .top, .center, or .bottom to line children up along their tops, middles, or bottoms.
HStack(alignment: .top) {
Text("Tall")
Text("Short")
}Spacing and Alignment Together
You can set both arguments at once. Alignment comes first, then spacing, giving you full control over the layout in one line.
VStack(alignment: .leading, spacing: 8) {
Text("A")
Text("B")
}Meet Spacer
A Spacer is a flexible view that expands to push its neighbors apart, soaking up all the leftover space in a stack.
HStack {
Text("Left")
Spacer()
Text("Right")
}Pushing Views to Edges
Drop a Spacer between two views to send them to opposite ends, or before one view to shove it fully to the trailing side.
Baseline Alignment for Text
For mixed font sizes, HStack offers .firstTextBaseline so labels of different sizes share a clean reading line.
Quick Check
Let's check what each stack's alignment controls.
Recap: Spacing & Alignment
Well done! Use spacing to set gaps, alignment to position children, and Spacer to push views to the edges of any stack. 🚀
Aprenda Swift com um tutor de IA — grátis
Escreva e execute código real no seu navegador, obtenha ajuda instantânea de um tutor de IA 24/7 e continue de onde parou na web ou no app.
- Cursos
- 30
- Aulas
- 120
Perguntas Frequentes
A aula “Espaçamento e alinhamento em pilhas” é grátis?
Sim — o texto completo de “Espaçamento e alinhamento em pilhas” é grátis para ler aqui na web. Para praticá-la interativamente (um editor de código integrado e um tutor de IA 24/7) e desbloquear o restante do curso de SwiftUI Academy, atualize para CoddyKit PRO. O curso de SwiftUI Academy inclui 4 aulas no total.
O que vou aprender em “Espaçamento e alinhamento em pilhas”?
Ajuste o espaçamento e o alinhamento entre visualizações empilhadas. Você pratica SwiftUI Academy com código prático que executa diretamente no navegador, e um tutor de IA 24/7 responde suas dúvidas enquanto trabalha na aula.
Preciso ter experiência prévia para começar SwiftUI Academy?
Nenhuma experiência prévia é necessária. SwiftUI Academy no CoddyKit é estruturado para alunos iniciantes até avançados, então você pode começar aqui ou desde o início e aprender no seu ritmo. Esta é a aula 4 de 4.
Quanto tempo leva a aula “Espaçamento e alinhamento em pilhas”?
A maioria das aulas CoddyKit leva cerca de 5–10 minutos. Cada uma é compacta e interativa, então você faz progresso constante e retoma exatamente de onde parou entre web e app.
Posso escrever e executar código nesta aula de SwiftUI Academy?
Sim. Cada aula de SwiftUI Academy inclui um editor de código integrado, então você escreve e executa código real direto no navegador e recebe feedback de IA instantaneamente — nenhuma configuração local necessária.
Todas as aulas deste curso
- Empilhando visualizações verticalmente
- Linhas com HStack
- Sobrepondo visualizações com ZStack
- Espaçamento e alinhamento em pilhas