Menu
CoddyTech

Widget Ağacı

Coddy'nin Flutter Journey'sinin İlk Uygulamanız bölümünün bir parçası. Ders 3 / 32.

Widget'lar başka widget'ların içine yerleştirilir. Başka bir widget'ı içinde barındıran bir widget, onu child: özelliğine verir; örneğin şu Center gibi:

Center(
  child: Text('Hello'),
)

Center kendi başına hiçbir şey çizmez. İçindeki widget'ı alır ve sahip olduğu alanın ortasına yerleştirir. O olmadan metin sol üst köşede durur.

İç içe geçmiş widget'lar bir widget ağacı oluşturur. Uygulamanızdaki ağaç MaterialApp, ardından Scaffold ve sonra da body: özelliğine koyduğunuz her şeyden oluşur. Her widget'ın içindeki widget, parantezlerinin içine yazılır; böylece parantezler ağacı gösterir. Her satırın sonundaki virgüller kodu düzenli tutar.

challenge icon

Görev

Kolay

Metin sol üst köşeye sıkışmış. Ekranın ortasında yer alması için onu bir Center içine sar:

  • body: Text('Right in the middle'), ifadesini, child: özelliği bu Text olan bir Center ile değiştir

Kendin dene

import 'package:flutter/material.dart';

void main() {
  runApp(const MyApp());
}

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        body: Text('Right in the middle'),
      ),
    );
  }
}
quiz iconKendini test et

Bu ders kısa bir quiz içerir. Soruları yanıtlamak ve ilerlemeni kaydetmek için derse başla.

İlk Uygulamanız bölümündeki tüm dersler

Kendi başına pratik yap: Online Flutter derleyicisi