Menu
CoddyTech

Geri Ok

Coddy'nin Flutter Journey'sinin Listeler ve Ekranlar bölümünün bir parçası. Ders 19 / 33.

Yığına ittiğin bir ekranın geri dönmek için bir yolu olmalı. Bir AppBar bunu sana ücretsiz olarak sağlar: yığında onun altında bir ekran varsa, uygulama çubuğu başlangıcında bir geri ok gösterir.

Scaffold(
  appBar: AppBar(title: const Text('Details')),
  body: ...,
)

Oka dokunmak, en üstteki ekranı yığından çıkarır ve altındaki ekran daha önceki hâliyle yeniden görünür. Telefonun kendi geri hareketi ve Android geri düğmesi de aynı işi yapar.

Uygulamanın ilk ekranının altında başka bir ekran yoktur, bu nedenle uygulama çubuğunda ok görünmez.

challenge icon

Görev

Kolay

Telefonda ayrıntıları aç: geri dönmenin bir yolu yok. Geri okunun görünmesi için DetailScreen'e başlığı Details olan bir AppBar ekle.

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 const MaterialApp(
      debugShowCheckedModeBanner: false,
      home: HomeScreen(),
    );
  }
}

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

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text('Home')),
      body: Center(
        child: ElevatedButton(
          onPressed: () {
            Navigator.push(
              context,
              MaterialPageRoute(builder: (context) => const DetailScreen()),
            );
          },
          child: const Text('Open details'),
        ),
      ),
    );
  }
}

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

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: const Center(
        child: Text('Here are the details'),
      ),
    );
  }
}
quiz iconKendini test et

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

Listeler ve Ekranlar bölümündeki tüm dersler

Kendi başına pratik yap: Online Flutter derleyicisi