Jetpack Compose Academy · Ders

Scaffold: Ekran İskeleti

Standart uygulama düzeni yuvalarını bağlayın.

1. ders / 413 adım

Scaffold: Ekran İskeleti, CoddyKit'te ücretsiz bir Jetpack Compose Academy dersidir. Bu, 4 dersinin 1. dersidir. Aşağıdan dersin tamamını ücretsiz okuyabilir, sonra tarayıcıda yerleşik kod editörü ve 7/24 yapay zeka koçu ile uygulamalı olarak pratik yapabilirsin. Bu, Jetpack Compose Academy öğrenme yolunun bir parçasıdır ve ilerlemeniz web ve CoddyKit uygulaması arasında senkronize olur. Jetpack Compose Academy kursu toplamda 4 dersten oluşur.

Bu dersin bazı bölümleri henüz çevrilmemiş olup İngilizce olarak gösterilmektedir.

Meet Scaffold

Most app screens share the same skeleton: a bar on top, content in the middle, maybe a button floating below. Scaffold gives you all of that in one Composable. 🏗️

Why Not Just a Column?

You could hand-build bars with a Column, but you would re-solve insets, spacing, and overlaps every time. Scaffold wires those standard pieces together for you.

The Slot Idea

Scaffold works with slots: named spots where you drop a Composable. You fill the slots you want and leave the rest empty.

The content Slot

The one slot you almost always use is content. It is the main body of your screen, and Scaffold hands it the right padding to use.

Scaffold { innerPadding ->
    Text("Hello", Modifier.padding(innerPadding))
}

Honor innerPadding

That innerPadding keeps your content from hiding under bars. Always apply it to your top-level content, or text can slip beneath the app bar.

The topBar Slot

Drop a bar into the topBar slot and Scaffold pins it to the top, then shrinks the content area so nothing overlaps.

Scaffold(
    topBar = { TopAppBar(title = { Text("Home") }) }
) { padding -> }

More Slots Available

Scaffold also offers bottomBar, floatingActionButton, and snackbarHost slots. You will meet each one in this course.

Leave Slots Empty

Every slot is optional. A Scaffold with only content is perfectly valid, so you add bars only when a screen actually needs them.

One Scaffold Per Screen

The usual rule is one Scaffold per screen. It frames that whole screen, while smaller Composables fill its content slot.

Scaffold Is Material 3

Import Scaffold from androidx.compose.material3 so its colors and spacing match the rest of your Material You theme.

import androidx.compose.material3.Scaffold

containerColor

Set containerColor to paint the screen background behind every slot. Skip it and Scaffold uses your theme's surface color by default.

Quick Check

What is the safest thing to do with the value Scaffold passes to its content lambda?

Recap

Scaffold is your screen skeleton: fill named slots like content and topBar, honor innerPadding, and use one per screen. Next you will style the top bar. 👍

Başlamak ücretsiz

Yapay zeka eğitmeniyle Kotlin öğren — ücretsiz

Tarayıcında gerçek kod yaz ve çalıştır, 7/24 yapay zeka eğitmeninden anında yardım al; web'de ya da uygulamada kaldığın yerden devam et.

Kurslar
30
Dersler
120

Sıkça Sorulan Sorular

“Scaffold: Ekran İskeleti” dersi ücretsiz mi?

Evet — “Scaffold: Ekran İskeleti” dersin tüm metni burada web'de ücretsiz olarak okunabilir. Etkileşimli olarak pratik yapmak (yerleşik kod editörü ve 7/24 yapay zeka koçu) ve Jetpack Compose Academy kursunun geri kalanını açmak için CoddyKit PRO'ya yükselt. Jetpack Compose Academy kursu toplamda 4 dersten oluşur.

“Scaffold: Ekran İskeleti” dersinde ne öğreneceğim?

Standart uygulama düzeni yuvalarını bağlayın. Jetpack Compose Academy ile uygulamalı kodu tarayıcıda doğrudan çalıştırarak pratik yaparsın ve 7/24 yapay zeka koçu dersi çalışırken sorularını yanıtlar.

Jetpack Compose Academy öğrenmeye başlamak için deneyim gerekli mi?

Önceden deneyim gerekmez. CoddyKit'te Jetpack Compose Academy, başlangıçtan ileri seviyeye kadar yapılandırıldığı için buradan başlayabilir veya başından başlayıp kendi hızında ilerleme yapabilirsin. Bu, 4 dersinin 1. dersidir.

“Scaffold: Ekran İskeleti” dersi ne kadar sürer?

Çoğu CoddyKit dersi yaklaşık 5–10 dakika sürer. Her biri kısa ve etkileşimli olduğu için sabit ilerleme yaparsın ve web ile uygulama arasında tam olarak bıraktığın yerden devam edebilirsin.

Bu Jetpack Compose Academy dersinde kod yazıp çalıştırabilir miyim?

Evet. Her Jetpack Compose Academy dersi yerleşik bir kod editörü içerir, bu sayede tarayıcıda gerçek kod yazıp çalıştırabilir ve anlık yapay zeka geri bildirimi alırsın — yerel kurulum gerekli değildir.

Bu kursun tüm dersleri

  1. Scaffold: Ekran İskeleti
  2. TopAppBar ve Eylem Simgeleri
  3. Alt Çubuklar ve Kayan Eylem Düğmeleri
  4. Snackbars ve SnackbarHostState
← Jetpack Compose Academy Sayfasına Dön