Dimensionando visualizações com frame
Defina restrições de largura, altura e valores mínimo e máximo.
Dimensionando visualizações com frame é uma aula grátis de SwiftUI Academy no CoddyKit. Esta é a aula 2 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.
Views Size Themselves
By default a SwiftUI view is exactly as big as its content needs. When you want a specific size, you reach for the frame modifier to ask for one.
A Fixed Width and Height
The frame modifier lets you request an exact size. Here the text is placed inside a box that is 200 points wide and 80 points tall.
Text("Card")
.frame(width: 200, height: 80)Width Only
You do not have to set both dimensions. Give only a width and the height stays natural, sized to fit the content as usual.
Text("Wide")
.frame(width: 250)Filling Available Space
Set maxWidth to infinity to let a view stretch across all the space its parent offers. This is great for full-width buttons and rows.
Text("Stretch")
.frame(maxWidth: .infinity)Aligning Inside the Frame
A roomy frame centers its content by default. The alignment argument moves that content, like pinning text to the leading edge.
Text("Left")
.frame(maxWidth: .infinity, alignment: .leading)Minimum Sizes
Use minWidth or minHeight to guarantee a view never shrinks below a floor, even when content is tiny. Handy for consistent tap targets.
Text("OK")
.frame(minWidth: 120)Maximum Sizes
The maxWidth and maxHeight values cap how large a flexible view can grow, so it stretches only up to a limit you choose.
Text("Capped")
.frame(maxWidth: 400)Combining Min and Max
Mix minWidth and maxWidth for a flexible range. The view grows with its parent but stays between a comfortable lower and upper bound.
Text("Flexible")
.frame(minWidth: 100, maxWidth: 300)Frame and Background Together
A frame defines the area a background fills. Set a frame, then add a color, and the whole sized region is painted, not just the text.
Text("Tile")
.frame(width: 120, height: 120)
.background(.mint)Frame Wraps, It Does Not Clip
A frame proposes a size but never trims content by itself. If content is larger than the frame, it can spill out unless you also clip it.
Frame Plus Padding
Combine the two tools for polished layouts: a frame sets the overall size and padding adds the inner breathing room around the content.
Text("Spaced")
.padding()
.frame(maxWidth: .infinity)Quick Check
Check your understanding of the frame modifier.
Recap
Great progress! You can now use frame to set exact sizes, flexible ranges, fill space with infinity, and align content inside the area.
Perguntas Frequentes
A aula “Dimensionando visualizações com frame” é grátis?
Sim — o texto completo de “Dimensionando visualizações com frame” é 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 “Dimensionando visualizações com frame”?
Defina restrições de largura, altura e valores mínimo e máximo. 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 2 de 4.
Quanto tempo leva a aula “Dimensionando visualizações com frame”?
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
- Adicionando preenchimento ao redor das visualizações
- Dimensionando visualizações com frame
- Planos de fundo e raio dos cantos
- Spacer e prioridade de layout