Menü Kapat

Flutter’da Farklı Bir Sayfaya Geçiş Yapma (Navigator Push Kullanımı)

Merhaba arkadaşlar, bu yazımda Flutter’da bir sayfadan başka bir sayfaya Navigator.push ile geçiş yapmayı anlatacağım. Öncelikle farklı sayfalarda appBar gibi özellikler farklı olabilir. Bunun için bir tane farklı bir dart dosyası oluşturup bir class tanımlayacağız. Daha sonra main.dart sayfamıza tanımladığımız class’ı çağıracağız. Dolayısıyla scaffold ve body yeni tanımladığımız class içinde olacak. Buradan tam olarak ne olacağını belki tam anlamamış olabilirsiniz ama aşağıda örnek üzerinden daha iyi anlayacaksınızdır.

main.dart dosyamızın içeriği aşağıdaki gibi olacaktır. Ben nextpage.dart isimli bir dosya oluşturdum ve içine “navigatorKullanimi” adında bir class tanımladım.

import 'package:flutter/material.dart';
import 'package:isa/nextpage.dart';

void main() {
  runApp(
    MaterialApp(
      home: navigatorKullanimi(),
    ),
  );
}

Şimdi gelelim nextpage.dart dosyamızın içeriğine. Bu dosyamızda navigatorKullanimi ve ikinciSayfa adında iki tane class’ım var. navigatorKullanimi class’ın içinde eklemiş olduğum butona tıklayınca ikinciSayfa adlı class’ımın içeriğine gideceğiz.

Yani “İkinci Sayfaya Git” butonuna tıkladığımızda onPressed kısmı tetiklenecek ve buradaki Navigator.push komutumuz çalışacak, buradan da ikinciSayfa class’ına gidecek ve içeriğini çalıştıracak. nextpage.dart dosyamızın içeriği aşağıdaki gibi olacaktır.

import 'package:flutter/material.dart';

class navigatorKullanimi extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("Navigator Kullanımı"),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            RaisedButton(
              child: Text("İkinci Sayfaya Git"),
              onPressed: (){
                Navigator.push(context, MaterialPageRoute(builder: (context)=>ikinciSayfa()),);
              },
              ),
          ],
        ),
      ),
    );
  }
}
______________________________________________________
class ikinciSayfa extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("İkinci Sayfa"),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Text("İkinci Sayfaya Hoş Geldiniz!", style: TextStyle(fontSize: 20),)
          ],
        ),
      ),
    );
  }
}

Bir cevap yazın

E-posta hesabınız yayımlanmayacak.