0Pricing
SwiftUI Academy · Урок

Адаптация к светлой и тёмной темам

Используйте семантические цвета для обоих вариантов оформления.

«Адаптация к светлой и тёмной темам» — бесплатный урок SwiftUI Academy на CoddyKit. Это урок 4 из 4. Ты можешь прочитать весь урок бесплатно ниже — а потом практиковать его прямо в браузере с встроенным редактором кода и ИИ-репетитором 24/7. Это часть пути обучения SwiftUI Academy, и твой прогресс синхронизируется между веб-версией и приложением CoddyKit. Курс SwiftUI Academy содержит 4 уроков всего.

Части этого урока еще не переведены и отображаются на английском.

Two Appearances

iOS offers Light and Dark Mode, and users switch any time. A polished app looks great in both without extra effort.

Use Semantic Colors

Reach for semantic colors like Color.primary or Color(.systemBackground). They flip automatically between appearances.

Text("Title")
    .foregroundStyle(.primary)
    .background(Color(.systemBackground))

Avoid Hardcoded Colors

A fixed Color.black background stays black in Dark Mode and can vanish into it. Semantic colors adapt; raw ones do not.

Text("Hi")
    .background(.black)

Asset Catalog Colors

Define a color in the asset catalog with separate Any and Dark values. Reference it by name and it switches for you.

Color("Brand")

Primary and Secondary

Use .secondary for less important text. It dims appropriately in each mode while staying readable.

Text("Subtitle")
    .foregroundStyle(.secondary)

Materials for Depth

System materials like .ultraThinMaterial blur the background and adapt to the mode, giving cards a native feel.

VStack { }
    .background(.ultraThinMaterial)

Detecting the Mode

Read the current appearance with @Environment(\.colorScheme) when you truly need different content per mode.

@Environment(\.colorScheme) var scheme

Branch on Scheme

With colorScheme in hand, you can choose an asset, like swapping a logo, only where a semantic color can't do the job.

Image(scheme == .dark ? "logoDark" : "logoLight")

Preview Both Modes

Add .preferredColorScheme(.dark) to a preview to check Dark Mode without leaving Xcode.

#Preview {
    ContentView()
        .preferredColorScheme(.dark)
}

Forcing a Mode

You can lock a screen with preferredColorScheme, but prefer respecting the user's system choice whenever you can.

ContentView()
    .preferredColorScheme(.dark)

Check Contrast

Verify text stays readable in both modes. Good contrast is part of accessibility, not just style.

Quick Check

Which color choice automatically adapts between Light and Dark Mode?

Recap

Your app now looks right in any appearance: lean on semantic colors, asset colors, and materials, and preview both modes. 🌓

Часто задаваемые вопросы

Урок «Адаптация к светлой и тёмной темам» бесплатный?

Да — полный текст урока «Адаптация к светлой и тёмной темам» бесплатно доступен здесь в веб-версии. Чтобы практиковать его интерактивно (встроенный редактор кода и ИИ-репетитор 24/7) и разблокировать остальной курс SwiftUI Academy, подпишись на CoddyKit PRO. Курс SwiftUI Academy содержит 4 уроков всего.

Чему я научусь в уроке «Адаптация к светлой и тёмной темам»?

Используйте семантические цвета для обоих вариантов оформления. Ты практикуешь SwiftUI Academy с помощью реального кода, который запускаешь прямо в браузере, и ИИ-репетитор 24/7 отвечает на твои вопросы во время урока.

Нужен ли мне опыт, чтобы начать SwiftUI Academy?

Предыдущий опыт не требуется. SwiftUI Academy на CoddyKit структурирован для всех уровней — от новичков до продвинутых, поэтому ты можешь начать отсюда или с самого начала и учиться в своем темпе. Это урок 4 из 4.

Сколько времени занимает урок «Адаптация к светлой и тёмной темам»?

Большинство уроков CoddyKit занимают около 5–10 минут. Каждый из них компактный и интерактивный, поэтому ты постоянно делаешь прогресс и продолжаешь с того же места в веб-версии и приложении.

Можно ли писать и запускать код в этом уроке SwiftUI Academy?

Да. Каждый урок SwiftUI Academy включает встроенный редактор кода, поэтому ты пишешь и запускаешь реальный код прямо в браузере и получаешь моментальную обратную связь от AI — локальная установка не требуется.

Все уроки этого курса

  1. VoiceOver и метки доступности
  2. Динамический тип и масштабируемые шрифты
  3. Локализация строк и каталогов строк
  4. Адаптация к светлой и тёмной темам
← Назад к SwiftUI Academy