SwiftUI Academy · Lekcja

Wczytywanie obrazów z zasobów

Proszę dodać zasoby obrazów i wyświetlać je za pomocą Image.

Wczytywanie obrazów z zasobów to bezpłatna lekcja SwiftUI Academy na CoddyKit. To lekcja 3 z 4. Możesz przeczytać całą lekcję poniżej za darmo — a potem ćwiczyć ją interaktywnie w przeglądarce z wbudowanym edytorem kodu i tutorem AI dostępnym 24/7. To część ścieżki edukacyjnej SwiftUI Academy, a Twój postęp synchronizuje się między webem a aplikacją CoddyKit. Kurs SwiftUI Academy zawiera 4 lekcji w sumie.

Części tej lekcji nie zostały jeszcze przetłumaczone i są wyświetlane po angielsku.

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. 🎉

Często zadawane pytania

Czy lekcja „Wczytywanie obrazów z zasobów” jest bezpłatna?

Tak — pełny tekst „Wczytywanie obrazów z zasobów” jest dostępny za darmo tutaj w sieci. Aby ćwiczyć ją interaktywnie (wbudowany edytor kodu i tutor AI dostępny 24/7) i odblokować resztę kursu SwiftUI Academy, przejdź na CoddyKit PRO. Kurs SwiftUI Academy zawiera 4 lekcji w sumie.

Co nauczysz się w „Wczytywanie obrazów z zasobów”?

Proszę dodać zasoby obrazów i wyświetlać je za pomocą Image. Ćwiczysz SwiftUI Academy z praktycznym kodem, który uruchamiasz bezpośrednio w przeglądarce, a tutor AI dostępny 24/7 odpowiada na Twoje pytania podczas pracy nad lekcją.

Czy potrzebuję doświadczenia, aby zacząć SwiftUI Academy?

Nie wymagamy żadnego doświadczenia. SwiftUI Academy w CoddyKit jest strukturyzowany dla początkujących i zaawansowanych użytkowników, więc możesz zacząć tutaj lub od początku i uczyć się w swoim tempie. To lekcja 3 z 4.

Ile czasu zajmuje lekcja „Wczytywanie obrazów z zasobów”?

Większość lekcji CoddyKit trwa około 5–10 minut. Każda lekcja to mały, interaktywny krok, dzięki czemu robisz systematyczne postępy i zawsze wracasz dokładnie do tego samego miejsca — na webie i w aplikacji.

Czy mogę pisać i uruchamiać kod w tej lekcji SwiftUI Academy?

Tak. Każda lekcja SwiftUI Academy zawiera wbudowany edytor kodu, więc piszesz i uruchamiasz prawdziwy kod bezpośrednio w przeglądarce i od razu otrzymujesz sprzężenie zwrotne od AI — bez konfiguracji na komputerze.

Wszystkie lekcje w tym kursie

← Powrót do SwiftUI Academy