SwiftUI Academy · Aula

Carregando imagens dos recursos

Adicione recursos de imagem e exiba-os com Image.

Carregando imagens dos recursos é uma aula grátis de SwiftUI Academy no CoddyKit. Esta é a aula 3 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.

Images Bring Apps to Life

Text is only half the story. This lesson shows how to add image files to your project and display them on screen. 🖼️

The Asset Catalog

Images live in Assets, the asset catalog in your project. Drag a picture there and Xcode gives it a name you reference in code.

Showing an Asset Image

Use Image with the asset name to display it. The name is the one shown in the asset catalog, not the file path.

Image("logo")

Images Are Their Native Size

By default an Image shows at its full pixel size, which can overflow the screen. You will usually need to resize it.

Image("hero")

Making Images Resizable

Add the resizable modifier first so the image can stretch to fit the space you give it.

Image("hero")
    .resizable()

Keeping the Aspect Ratio

Pair resizable with scaledToFit so the image scales without distortion, leaving empty space if needed.

Image("hero")
    .resizable()
    .scaledToFit()

Filling the Space

Use scaledToFill when you want the image to cover the whole frame. Crop the overflow with a clip so edges stay clean.

Image("hero")
    .resizable()
    .scaledToFill()

Sizing with frame

Combine resizable with a frame to pin exact dimensions. This is the common recipe for avatars and thumbnails.

Image("avatar")
    .resizable()
    .frame(width: 80, height: 80)

Clipping to a Shape

Wrap things up with clipShape to round images into circles or rounded rectangles for a refined look.

Image("avatar")
    .resizable()
    .frame(width: 80, height: 80)
    .clipShape(Circle())

Decorative vs Meaningful

Mark purely decorative images so VoiceOver skips them, and label meaningful ones so they are described to everyone.

Image(decorative: "swirl")

Loading Remote Images

For images from the web, AsyncImage downloads and shows them, with a placeholder while loading. Assets stay for bundled art.

AsyncImage(url: photoURL)

Quick Check

What must you add before an Image can resize?

Lesson Recap

You loaded assets with Image, then made them fit using resizable, scaledToFit, frame, and clipShape. Now your art behaves. 🎉

Perguntas Frequentes

A aula “Carregando imagens dos recursos” é grátis?

Sim — o texto completo de “Carregando imagens dos recursos” é 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 “Carregando imagens dos recursos”?

Adicione recursos de imagem e exiba-os com Image. 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 3 de 4.

Quanto tempo leva a aula “Carregando imagens dos recursos”?

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

← Voltar para SwiftUI Academy