MaterialPageRoute

MaterialPageRoute ile Material geçiş animasyonu yapmayı öğrenirsin.

MaterialPageRoute nedir?

MaterialPageRoute, Material tasarımına uygun geçiş animasyonu sağlayan route sınıfıdır. builder parametresi, açılacak ekranı oluşturan bir fonksiyon alır. Android'de yukarıdan aşağa, iOS'te sağdan sola geçiş animasyonu yapar.

MaterialPageRoute(
  builder: (context) => IkinciEkran(),
)

builder parametresi

builder, bir BuildContext parametresi alan ve bir Widget döndüren callback fonksiyonudur. MaterialPageRoute, bu fonksiyonu çağırarak yeni ekranı oluşturur. Parametre adı genellikle _ olarak yazılır çünkü kullanılmaz; ama istenirse context de verilebilir.

Uygulama MaterialPageRoute ile geçiş yap

gecis adında bir fonksiyon yaz; çağrılınca Gecis yapildi yazdırsın. main içinde gecis'i çağır. Bir ElevatedButton ekle ve onPressed'da MaterialPageRoute kullanarak Scaffold ekranı aç.

Örnek çözümü göster

import 'package:flutter/material.dart';

void gecis() {
  print('Gecis yapildi');
}

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

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: Center(
          child: ElevatedButton(
            onPressed: () {
              Navigator.push(
                context,
                MaterialPageRoute(builder: (_) => Scaffold()),
              );
            },
            child: Text('Gecis'),
          ),
        ),
      ),
    );
  }
}

Kendini test et

MaterialPageRoute'ın builder parametresi ne döndürür?
- int
- bool
- String
- Widget
Cevabı göster

Widget — builder parametresi bir Widget döndüren callback fonksiyonudur; String, int veya bool döndürmez.

builder parametresini ekle

MaterialPageRoute(
  ____: (_) => Scaffold(),
)

Cevabı göster

MaterialPageRoute(
  builder: (_) => Scaffold(),
)

MaterialPageRoute parçaları

MaterialPageRoute

Material geçiş rotası
builder

Ekranı oluşturan callback
transition

Geçiş animasyonu
Navigator

Rotayı çağırır

Sıradaki ders: Navigator.pop

Deneyiminizi Geliştiriyoruz

Çerez Tercihleri

Kesinlikle Gerekli Çerezler

Analitik Çerezler