# 15. Hafta — Sayfalar Arası Geçiş

## Bu hafta ne yapacağız?

Ürün listesinden seçilen ürünün ayrıntı sayfasına geçeceğiz. Seçilen nesneyi yeni sayfanın constructor’ına aktaracak, ayrıntı ekranında adet ve favori durumunu yönetecek, sistemin geri düğmesiyle listeye döneceğiz. Ardından aynı gezinme desenini özgün bir gezi rehberinde uygulayacağız.

## Kazanımlar

- `Navigator.push` ile yeni rota açma
- `MaterialPageRoute` kullanarak hedef widget oluşturma
- Constructor üzerinden tür güvenli veri taşıma
- `Navigator.pop` ve sistem geri davranışını anlama
- Liste ve ayrıntı sayfalarının sorumluluklarını ayırma

## Uygulama 15 — Ürün Detayı

### 1. Veriyi modellemek

```dart
class Urun {
  const Urun(this.ad, this.aciklama, this.fiyat, this.simge, this.renk);
  final String ad, aciklama;
  final double fiyat;
  final IconData simge;
  final Color renk;
}
```

Liste ve ayrıntı aynı ürün nesnesini kullanır; alanlar yeniden kopyalanmaz.

### 2. Karttan ayrıntıya geçmek

```dart
onTap: () => Navigator.push(
  context,
  MaterialPageRoute(
    builder: (context) => UrunDetayi(urun: urun),
  ),
)
```

`push`, yeni rotayı gezinme yığınının üstüne ekler. Constructor parametresi, hangi ürünün açıldığını açık ve tür güvenli biçimde taşır.

### 3. Ayrıntı sayfasında veriyi almak

```dart
class UrunDetayi extends StatefulWidget {
  const UrunDetayi({super.key, required this.urun});
  final Urun urun;
}
```

Ürün değişmez; adet ve favori yalnız ayrıntı sayfasının durumudur. Adet değişince toplam fiyat yeniden hesaplanır:

```dart
Text('₺${(widget.urun.fiyat * adet).toStringAsFixed(2)}')
```

Testte Kablosuz Kulaklık ayrıntısı açıldı, adet 2 yapıldı, ürün favorilendi ve `₺2598.00` doğrulandı. Ardından geri dönülüp liste başlığı kontrol edildi.

![İki adet seçilmiş favori Kablosuz Kulaklık ayrıntısı](../../screenshots/week-15-adapted.png)

## Özgün proje — Gezi Rehberi

Gezi listesi de seçilen `Rota` nesnesini ayrıntıya aktarır:

```dart
onTap: () => Navigator.push(
  context,
  MaterialPageRoute(
    builder: (_) => RotaDetayi(rota: rota),
  ),
)
```

Ayrıntı sayfası şehir, yer, süre, açıklama, simge ve renk bilgilerini aynı nesneden gösterir. Favori durumu bu sayfada değişir; “Planıma ekle” işlemi kullanıcıya `SnackBar` geri bildirimi verir.

### Geri dönüş nasıl çalışır?

`Scaffold` içindeki `AppBar`, rota yığınının altında başka sayfa olduğunu algılar ve geri okunu otomatik ekler. Ok, aşağıdaki işlemi gerçekleştirir:

```dart
Navigator.pop(context);
```

Testte Odunpazarı Evleri açıldı, favori simgesi değiştirildi ve gerçek ayrıntı ekranı alındı; sonra geri dönülerek “Hafta Sonu Rotaları” sayfasına ulaşıldığı doğrulandı.

![Favorilenmiş Odunpazarı Evleri rota ayrıntısı](../../screenshots/week-15-original.png)

## Sıra sende

1. Kolay: Ürün ayrıntısına stok bilgisi ekle.
2. Orta: Gezi ayrıntısından listeye “plana eklendi” sonucunu geri döndür ve kartta göster.
3. İleri: Liste, ayrıntı ve paylaşılabilir bağlantıyı destekleyen adlandırılmış ya da bildirimsel rota yapısı kur.

Çözümünü gönderdikten ve geri bildirim aldıktan sonra Gezi Rehberi’nin gerçek Dart kodu ile çalışan proje paketi açılacaktır. İpucu hangi verinin constructor ile taşınacağını belirlemene yardım edecek; çözüm düğmesi eksiksiz `lib/main.dart` kodunu gösterecektir.

## Kontrol listesi

- Ayrıntı sayfası seçilen model nesnesini constructor’dan alıyor.
- Liste ve ayrıntı sorumlulukları ayrıldı.
- Gezinme yığınına yeni sayfa ekleniyor ve geri dönülebiliyor.
- Ayrıntıdaki durum değişiklikleri doğru sayfada tutuluyor.
- İki proje Flutter widget testinde ileri/geri gezinmeyle doğrulandı ve gerçek ayrıntı ekranları görsel olarak incelendi.
