Scaffold nedir?

Scaffold'ın uygulama ekranının iskeleti olduğunu öğrenirsin.

Scaffold nedir?

Scaffold, bir Material uygulama ekranının iskeletini oluşturan widget'tır. Üst başlık çubuğu (appBar), ana içerik alanı (body), yüzen buton (floatingActionButton) ve yan menü (drawer) gibi bölümleri tanımlamanı sağlar. Çoğu ekranda kök widget olarak Scaffold kullanılır.

Scaffold(
  appBar: AppBar(title: Text('Baslik')),
  body: Center(child: Text('Merhaba')),
)

appBar ve body birlikte

Tipik bir Scaffold hem appBar hem body parametrelerini alır. appBar, üstte sabit bir başlık çubuğu gösterir; body ise geri kalan alanı doldurur. İkisi birlikte ekranda üst başlık ve altında içerik biçiminde görünür.

Scaffold(
  appBar: AppBar(title: Text('Uygulama')),
  body: Center(child: Text('Icerik')),
)

Uygulama Scaffold ile appBar ve body ekle

kur adında bir fonksiyon yaz; çağrılınca Scaffold kuruldu yazdırsın. main içinde kur'u çağır. Scaffold'a hem appBar hem body parametrelerini ver; appBar'da AppBar(title: Text('Baslik')), body'de Center(child: Text('Merhaba')) olsun.

Örnek çözümü göster

import 'package:flutter/material.dart';

void kur() {
  print('Scaffold kuruldu');
}

void main() {
  kur();
  runApp(const Uygulama());
}

class Uygulama extends StatelessWidget {
  const Uygulama({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(title: Text('Baslik')),
        body: Center(child: Text('Merhaba')),
      ),
    );
  }
}

Kendini test et

Scaffold'ın body parametresi ne için kullanılır?
- Üst başlık çubuğunu belirler
- Yan menüyü belirler
- Yüzen butonu belirler
- Ana içerik alanını belirler
Cevabı göster

Ana içerik alanını belirler — body parametresi Scaffold'ın ana içerik alanını belirler; üst başlık appBar, yan menü drawer, yüzen buton floatingActionButton içindir.

body parametresini ekle

Scaffold(
  appBar: AppBar(title: Text('Baslik')),
  ____: Center(child: Text('Merhaba')),
)

Cevabı göster

Scaffold(
  appBar: AppBar(title: Text('Baslik')),
  body: Center(child: Text('Merhaba')),
)

Scaffold parçaları

Scaffold

Ekran iskeletini oluşturur
appBar

Üst başlık çubuğu
body

Ana içerik alanı
MaterialApp

Scaffold'ı sarmalayan kök widget

Sıradaki ders: AppBar

Deneyiminizi Geliştiriyoruz

Çerez Tercihleri

Kesinlikle Gerekli Çerezler

Analitik Çerezler