Flutter build Fonksiyonu

Herkese merhaba, Flutter yazılarımıza kaldığımız yerden devam ediyoruz. Bu yazımızda build fonksiyonunu anlatacağım. Hadi başlayalım !

Flutter, Google tarafından geliştirilen bir mobil uygulama geliştirme çerçevesidir. Flutter, hızlı bir şekilde uygulama geliştirmenizi sağlayan birçok özellik sunar. Bu özelliklerden biri de, uygulama arayüzünü oluşturmak için kullanılan build fonksiyonudur.

Kullanım Alanı

build fonksiyonu, Widget sınıfının bir parçasıdır ve her widget’ın bir build fonksiyonu vardır. Bu fonksiyon, uygulama arayüzünün nasıl görüneceğini tanımlar. Herhangi bir değişiklik olduğunda, Flutter otomatik olarak build fonksiyonunu çağırır ve uygulamanın güncellenmiş görünümünü oluşturur.

Tanımı

build fonksiyonu, Widget sınıfı tarafından tanımlanır ve genellikle aşağıdaki şekilde tanımlanır:

@override
Widget build(BuildContext context) {
  // Widget oluşturma kodları
}

build fonksiyonu, Widget sınıfı tarafından tanımlanır ve @override anotasyonu kullanarak geçersiz kılınır. Bu fonksiyon, BuildContext nesnesi alır ve Widget döndürür. BuildContext nesnesi, widget ağacının durumunu, yerleşimini ve daha fazlasını içerir.

Kullanım Örneği

Aşağıdaki örnek, build fonksiyonunun nasıl kullanılabileceğini gösterir:

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      home: Scaffold(
        appBar: AppBar(
          title: Text('Flutter Demo'),
        ),
        body: Center(
          child: Text('Hello, World!'),
        ),
      ),
    );
  }
}

Bu örnekte, MyApp sınıfı, build fonksiyonunu geçersiz kılar ve MaterialApp widget’ını döndürür. MaterialApp widget’ı, uygulama arayüzünün temel widget’ıdır ve uygulama için bir tema ve yönlendirme özellikleri sağlar.

Scaffold widget’ı, uygulama sayfasının iskeletini tanımlar. AppBar widget’ı, sayfanın başlığını ve diğer özelliklerini içerir. body özelliği, sayfanın ana içeriğini belirtir ve Center widget’ı, Text widget’ını ortalamak için kullanılır.

Sonuç olarak, build fonksiyonu, Flutter’da uygulama arayüzünün oluşturulması için önemli bir rol oynar. Bu fonksiyon, widget’ların ağacını oluşturur ve Flutter’ın otomatik olarak yeniden çizim yapmasını sağlar. Bu özelliği sayesinde, Flutter hızlı ve esnek bir şekilde uygulama arayüzlerinin oluşturulmasını sağlar.

Örnekler

Aşağıda, build fonksiyonunun kullanımı hakkında daha fazla örnek gösterilmiştir:

Basit bir Container oluşturma

Widget build(BuildContext context) {
  return Container(
    color: Colors.blue,
    child: Text('Hello, World!'),
  );
}

Bu örnekte, Container widget’ı oluşturulur ve color özelliğiyle arka plan rengi belirlenir. child özelliği, Container widget’ının içindeki diğer widget’ları içerir. Bu örnekte, Text widget’ı kullanılır ve ‘Hello, World!’ metni gösterilir.

ListView oluşturma

Widget build(BuildContext context) {
  return ListView.builder(
    itemCount: 10,
    itemBuilder: (BuildContext context, int index) {
      return ListTile(
        title: Text('Item $index'),
      );
    },
  );
}

Bu örnekte, ListView.builder widget’ı kullanılır ve itemCount özelliğiyle kaç adet öğe olacağı belirlenir. itemBuilder özelliği, her bir öğe için nasıl oluşturulacağını belirler. Bu örnekte, ListTile widget’ı kullanılır ve her öğe için bir başlık belirlenir.

Scaffold ve AppBar kullanımı

Widget build(BuildContext context) {
  return Scaffold(
    appBar: AppBar(
      title: Text('My App'),
    ),
    body: Center(
      child: Text('Hello, World!'),
    ),
  );
}

Bu örnekte, Scaffold widget’ı kullanılır ve appBar özelliğiyle uygulamanın başlığı belirlenir. body özelliği, sayfanın ana içeriğini belirler ve Center widget’ı, Text widget’ını ortalamak için kullanılır.

Conditional Rendering

Widget build(BuildContext context) {
  bool isButtonPressed = true;
  return Container(
    child: isButtonPressed
        ? Text('Button Pressed')
        : Text('Button Not Pressed'),
  );
}

Bu örnekte, isButtonPressed adında bir değişken tanımlanır ve Container widget’ı içinde kullanılır. isButtonPressed değişkeninin değerine göre, Text widget’ının içeriği değiştirilir.

Sonuç

Sonuç olarak, build fonksiyonu, Flutter’da uygulama arayüzünün oluşturulmasında temel bir rol oynar. Bu fonksiyon, uygulamanın güncellenmiş görünümünü oluşturmak için otomatik olarak çağrılır ve Flutter’ın hızlı ve esnek uygulama arayüzleri oluşturmasına yardımcı olur.

Evet build fonksiyonu bu şekilde olmakta. Tüm Flutter yazılarımıza buraya tıklayarak ulaşabilirsiniz. Herkese hayırlı günler.