🙂 İNSANLARIN EN HAYIRLISI INSANLARA FAYDALI OLANDIR 🙂

Ramazan HABER / FLUTTER / sayfalar arası geçiş metot ve veri aktarma vs

1-) FLUTTER - sayfalar arası geçiş metot ve veri aktarma  vs

 

*** EN SON HALİNİ EN ÜSTTE YANİ BURAYA YAZIYORUM ***

  Navigator.of(context).push(MaterialPageRoute(builder: (context) => RedPage()));

 

Navigator.of(context).pushAndRemoveUntil(MaterialPageRoute(builder: (context) =>
    LoginScreen()), (
Route<dynamic> route) => false);

 

 

onGenerateRoute aşağıdaki gibi kullanılır.

 

return MaterialApp(
  onGenerateRoute:RouteGenerator.routeGenerator , // parametre göndermezsen çalıştığı anda gider
  
debugShowCheckedModeBanner: false,
  title:
"Başlık",
  theme:
ThemeData(primarySwatch: Colors.purple),
  builder:
EasyLoading.init(), // toast mesajlar için kütüphane
);

 

RouteGenerator.dart

 

import 'package:derslerim_hepsi/Ders3/greenpage.dart';
import 'package:derslerim_hepsi/Ders3/ogrenci_listesi.dart';
import 'package:derslerim_hepsi/Ders3/redpage.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';

import '../main.dart';

class RouteGenerator {
  
static Route<dynamic>? _routeOlustur(Widget gidilecekWidget,RouteSettings settings){
    
if(defaultTargetPlatform==TargetPlatform.iOS){ // ios ise slaytı yan kullan dedik
      
return CupertinoPageRoute(
          settings: settings,
          builder: (context) => gidilecekWidget);
    }
else if(defaultTargetPlatform==TargetPlatform.android){
      
return MaterialPageRoute(
          settings: settings,
          builder: (context) => gidilecekWidget);
    }
else{
      
return MaterialPageRoute(
          settings: settings,
          builder: (context) => gidilecekWidget);
    }
  }


  
static Route<dynamic>? routeGenerator(RouteSettings settings) {
    
switch (settings.name) {
      
case "/":
        
return _routeOlustur(AnaSayfaPage(),settings);
      
case "/redPage":
        
return _routeOlustur(RedPage(),settings);
      
case "/greenpage":
        
return _routeOlustur(GreenPage(),settings);
      
case "/OgrenciListesi":
        
return _routeOlustur(OgrenciListesi(),settings);
      
default:
        
return MaterialPageRoute(
            builder: (context) =>
Scaffold(
                  appBar:
AppBar(
                    title:
Text("404"),
                  ),
                  body:
Center(
                    child:
Text("Sayfa bulunamadı"),
                  ),
                ));
    }
  }
}

 

sayfaya veri göndererek gitmek için bu kullanılır ->

 

Navigator.of(context).pushNamed("/OgrenciListesi",arguments:60);//argumentsdaki değer bir objedir istediğin objeyi gönderebilirsin

sayfaya gelen veriyi bu şekilde alırsın

 

@override
Widget build(BuildContext context) {
  
var elemanSayisi = ModalRoute.of(context)!.settings.arguments;
if(elemanSayisi!=null){
  print(
"eleman sayısı2 "+elemanSayisi.toString());
}

else{
  
return Scaffold(
    appBar:
AppBar(
      title:
Text("Ogrenci Listesi"),
    ),
    body:
Container()
  );
}

 

return Scaffold(
  appBar:
AppBar(
    title:
Text("Ogrenci Listesi"),
  ),
  body:
Container(child: ListView.builder( itemCount : countum,itemBuilder: (context, index) {
    
return ListTile(
      leading:
CircleAvatar(
        child:
Text("id : " + index.toString(),textAlign: TextAlign.center,),
      ),
      title:
Text("tittle : " + index.toString()),
      subtitle:
Text("subtitle : " + index.toString()),
    );
  })),
);

}

 

*************** VERİ AKTARMAK İÇİN 2. YOL CONSTRUCTER İLE*********************

 

Navigator.popUntil(context, (route) => route.isFirst); // ilk sayfaya kadar pop yap demek

Navigator.popUntil(context, (route) => route.settings.name=="/greenpage"); // greenpage a kadar pop yap demek

Navigator.of(context).pushNamedAndRemoveUntil("/greenpage", (route) => route.isFirst);// ilk sayfaya kadar pop yap ardından greenpage e git demek

 

KULLANIMI

Navigator.pushNamed(context, "/OgrenciDetay",arguments: secilenOgrenci);

Classım

class OgrenciDetay extends StatelessWidget {
  
final Ogrencim secilenOgrenci;
  
const OgrenciDetay({required this.secilenOgrenci, Key? key})
      :
super(key: key);

 

Route

case "/OgrenciDetay":
  
var secilenOgrenci  = settings.arguments as Ogrencim;
  
return _routeOlustur(OgrenciDetay(secilenOgrenci:  secilenOgrenci),settings);

constructer kullanmadan veri gönderip build dede alabilirsin bu şekilde

@override
Widget build(BuildContext context) {
  
var secilen = ModalRoute.of(context)!.settings.arguments as Ogrencim;
  print(
"seçilen ogrenci "+secilen.isim);

 

 

**************** DİĞERLERİ BUNLARA BAKMASANDA OLUR ********************

 

  Navigator.of(context).push(MaterialPageRoute(builder: (context) => RedPage()));

 

İSİM İLE GİTMEK İÇİN materialApp'a route tanımlanır ve pushnamed ile gidilir. ilk sayfa "/" ile tanımlanandır ve home kısmındakini silersin bu direk uygulama başlar başlamaz açılır

return MaterialApp(
  routes: {
    
"/redPage": (context) => RedPage(),
    
"/": (context) => AnaSayfaPage(context: context)
  },
  debugShowCheckedModeBanner:
false,
  title:
"Başlık",
  theme:
ThemeData(primarySwatch: Colors.purple),
  builder:
EasyLoading.init(),
);

KULLANIMI -> Navigator.of(context).pushNamed("/redPage");

 

onUnknownRoute nedir ? olmayan bir sayfaya gidilmeye çalışıldığında verilecek kod bloğudur . aşağıda kullanımı vardır. "/olmayanpage" yani kullanımı yitirmiş de olabilir ..

 

return MaterialApp(
  routes: {
    
"/redPage": (context) => RedPage(),
    
"/": (context) => AnaSayfaPage(context: context)
  },
  onUnknownRoute: (settings) =>
MaterialPageRoute(
      builder: (context) =>
Scaffold(
            appBar:
AppBar(
              title:
Text("Error"),
            ),
            body:
Center(
              child:
Text(
                
"Sayfa Bulunamadı 404",
                style:
TextStyle(fontSize: 24),
              ),
            ),
          )),
  debugShowCheckedModeBanner:
false,
  title:
"Başlık",
  theme:
ThemeData(primarySwatch: Colors.purple),
  builder:
EasyLoading.init(),
);

 

 

 

ÖRNEK 1

 

main.dart

 

return MaterialApp(
  debugShowCheckedModeBanner:
false,
  title:
"Başlık",
  theme:
ThemeData(primarySwatch: Colors.purple),
  home:
AnaSayfaPage(context: context),
  builder:
EasyLoading.init(),
);

 

 

class AnaSayfaPage extends StatelessWidget {
  
const AnaSayfaPage({
    
Key? key,
    
required this.context,
  }) :
super(key: key);

  
final BuildContext context;

  
@override
  
Widget build(BuildContext context) {
    
return Scaffold(
        appBar:
AppBar(
          title:
Text("Main Page"),
        ),
        body:
Container(
          alignment:
Alignment.center,
          child:
Column(
            children: [
              
ElevatedButton(
                onPressed: ()
async {
                  
int? sayi = await Navigator.of(context)
                      .push(
MaterialPageRoute(builder: (context) => RedPage()));

                  
EasyLoading.showToast(sayi.toString());
                },
                child:
Text("Red Page"),
              ),
              
ElevatedButton(
                onPressed: () {
                  
Navigator.of(context).push(
                  
CupertinoPageRoute(builder: (context) => RedPage())).then((value) => EasyLoading.showToast(value.toString()));

                },
                child:
Text("Red Page IOS style"),
              ),
            ],
          ),
        ));
  }
}

açıklama gelen değeri async await ile yazmaktansa then ile de yazabilirsin aynı şey demek

 

redpage.dart gidilecek sayfa

 

import 'dart:math';

import 'package:flutter/material.dart';
class RedPage extends StatefulWidget {
  
const RedPage({Key? key}) : super(key: key);
  
@override
  
_RedPageState createState() => _RedPageState();
}
class _RedPageState extends State<RedPage> {
  
@override
  
Widget build(BuildContext context) {
    
return Scaffold(
      body:
Container(
        color:
Colors.red,
        child:
ElevatedButton(
          onPressed: () {
            
int rastgeleSayi = Random().nextInt(100);
            
Navigator.of(context).pop(rastgeleSayi);
          },
          child:
Text("Geri Git"),
        ),
      ),
      appBar:
AppBar(
        automaticallyImplyLeading:
false,
        title:
Text("Red Page"),
      ),
    );
  }
}

 

açıklama appBar'a automaticallyImplyLeading: false dersen geri tuşunu kapatır

 

ÖRNEK 2

 

Container(
  child:
ElevatedButton(
    onPressed: () {
      
Navigator.push(
        context,
        
MaterialPageRoute(
          builder: (context) =>
deneme(
            gelenveri:
'rambo',
          ),
        ),
      );
    },
    child:
Text('deneme'),
  ),
),

 

 

DİĞER SAYFA

 

import 'package:flutter/material.dart';

class deneme extends StatefulWidget {
  
var gelenveri="";
   
deneme({required this.gelenveri,Key? key}) : super(key: key);

  
@override
  
_denemeState createState() => _denemeState();
}

class _denemeState extends State<deneme> {
  
@override
  
Widget build(BuildContext context) {
    
return Scaffold(
      appBar:
AppBar(title: Text('test'),),
      body:
Container(
        child:
Text(widget.gelenveri),

      ),
    );
  }
}

 

AÇIKLAMA

 

geçiş için : Navigator.push(context,MaterialPageRoute(builder: (context) => deneme(gelenveri: 'murat',),),);

 

veri aktarım için

 

var gelenveri="";
 
deneme({required this.gelenveri,Key? key}) : super(key: key);

...

child: Text(widget.gelenveri),

 

pop ile değil de maybePop() ile geri gitmek istersen son sayfadan geriye gelmez

 

ElevatedButton(
  onPressed: () {
   
if( !Navigator.of(context).canPop()){ // canpop son stack elemanı mı diye bakar
     
EasyLoading.showToast("Uygulamadan çıkmak istediğine emin misin ? ");
   }
  },
  child:
Text("Geri git"),
),

 

pushReplacement aşağıda kullanımı peki nedir : kendini yok ederek o sayfaya git demektir

 

ElevatedButton(
  onPressed: () {
    
Navigator.of(context).pushReplacement(
        
MaterialPageRoute(builder: (context) => RedPage()));
  },
  child:
Text("kendini yok ederek o sayfaya git"),
),

 

 

 2023 Ağustos 21 Pazartesi
 737