Flutter
Liste ve ekleme
ListView ve FloatingActionButton ile ekleme akışı yazarsın.
ListView ile not listesi
Notları ekranda listelemek için ListView.builder kullanırsın. itemCount notların sayısını, itemBuilder ise her sıra için gösterilecek widget'ı üretir. Her not için genellikle bir ListTile gösterirsin.
ListView.builder(
itemCount: notlar.length,
itemBuilder: (context, index) {
final n = notlar[index];
return ListTile(title: Text(n.baslik));
},
)
FloatingActionButton ile ekleme
Yeni not ekleme akışını başlatmak için FloatingActionButton kullanırsın. onPressed içinde Navigator.push ile ekleme ekranına geçersin; bu ekran geri döndüğünde yeni notu listeye eklersin.
FloatingActionButton(
onPressed: () async {
final yeniNot = await Navigator.push(
context,
MaterialPageRoute(builder: (_) => EklemeEkrani()),
);
if (yeniNot != null) {
// listeye ekle
}
},
child: const Icon(Icons.add),
)
Uygulama ListView ile notları listele
NotlarEkrani adında bir StatelessWidget tanımla. final List<Note> notlar alanı required olsun. build metodu bir Scaffold döndürsün; gövdesi ListView.builder olsun ve itemCount notlar.length, itemBuilder her satırda ListTile(title: Text(n.baslik)) döndürsün. main içinde 'hazir' yazdır.
Örnek çözümü göster
import 'package:flutter/material.dart';
class Note {
final String id;
final String baslik;
final String icerik;
Note(this.id, this.baslik, this.icerik);
}
class NotlarEkrani extends StatelessWidget {
final List<Note> notlar;
const NotlarEkrani({super.key, required this.notlar});
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: const Text('Notlar')),
body: ListView.builder(
itemCount: notlar.length,
itemBuilder: (context, index) {
final n = notlar[index];
return ListTile(title: Text(n.baslik));
},
),
);
}
}
void main() {
print('hazir');
}
Kendini test et
-
ListView.builder'ın itemCount parametresi neyi belirtir?
- Her satırın yazı boyutunu
- Animasyon süresini
- Notların sayısını
- Listenin yüksekliğini
Cevabı göster
Notların sayısını — itemCount, listede kaç satır gösterileceğini belirtir. Yükseklik, yazı boyutu ve animasyon süresi itemCount ile ilgili değildir.
-
Navigator.push çağrısı
final sonuc = await Navigator.____(
context,
MaterialPageRoute(builder: (_) => EklemeEkrani()),
);
Cevabı göster
final sonuc = await Navigator.push(
context,
MaterialPageRoute(builder: (_) => EklemeEkrani()),
);
-
Liste ve ekleme parçaları
- ListView.builder
- not listesi
- itemCount
- satır sayısı
- FloatingActionButton
- ekleme butonu
- Navigator.push
- yeni ekran açma
Sıradaki ders: Düzenleme ekranı
