Verileri Yeni Bir Ekrana Gönderme
Genellikle, yalnızca yeni bir ekrana gitmekle kalmaz, aynı zamanda verileri ekrana da iletirsiniz. Örneğin, dokunulan öğe hakkında bilgi aktarmak isteyebilirsiniz.
Önemli:
Ekranlar yalnızca widget'lardır. Bu örnekte, yapılacaklar listesini oluşturun. Bir todo öğesine dokunduğunuz zaman, todo hakkında verilecek bilgiyi görüntüleyen yeni bir ekrana gidilmesini sağlar.
Yapılacaklar Sınıfı Tanımlayın
İlk olarak, todolar'ı temsil etmek için bir yola ihtiyacınız var. Bu örnekte, iki veri parçası içeren bir sınıf oluşturun: başlık ve açıklama
Kod:
class Todo {
final String başlık;
final String aciklama;
Todo(this.baslik, this.aciklama);
}Yapılacaklar Listesi Oluşturma
Todo listesini oluştur:
Kod:
final todos = List<Todo>.generate(
20,
(i) => Todo(
'Todo $i',
'Todo $ i için yapılması gerekenler hakkında bir açıklama',
),
);ListView kullanarak yapılacaklar listesini görüntüleme:
Kod:
ListView.builder(
itemCount: todos.length,
itemBuilder: (context, İndex) {
return ListTile(
title: Text(Toros[İndex].başlık),
);
},
);Yapılacak Bilgiler İçin Ekran Oluşturma
Şimdi ikinci ekran oluşturun. Ekran başlığı yapılacak bölümün başlığını içerir ve ekranın gövdesi açıklamayı gösterir. Ayrıntı ekranı normal bir StatelessWidget olduğundan, kullanıcının kullanıcı arayüzüne bir Todo girmesini isteyin. Ardından, verilen todo'yu kullanarak kullanıcı arayüzünü oluşturun.
Kod:
class DetailScreen extends StatelessWidget {
//Yapılacak olan bir alan bildirin.
final Todo todo;
//Yapıcıda, bir Todo gerektirir.
DetailScreen ({key: key);
this.todo}) : super.(key: key);
[USER=931120]Override[/USER]
Widget build(BuildContext context) {
//Kullanıcı arayüzünü oluşturmak için Yapılacaklar'ı kullanın.
return Scaffold(
appBar: AppBar(
title: Text(todo.baslik),
),
body: Padding(
padding: EdgeInsest.all(16.0),
child: Text(todo.aciklama),
),
);
}
}Verileri Ayrıntı Ekranına Gidin Ve Aktarın
Bir DetailScreen takılıyken Gezinme işlemini gerçekleştirmeye hazırsınız. Bu örnekte, kullanıcı listede bir yapılacaklar listesine dokunduğunda DetailScreen'e gidin. Todo'yu DetailScreen'e aktarın. Kullanıcının dokunmasını yakalamak için, ListTile widget'ı için bir onTap () geri çağrısı yazın. OnTap () geri çağrısında Navigator.push () yöntemini kullanın.
Kod:
ListView.builder(
itemCount: todos.length,
itemBuilder: (context, İndex) {
return ListTile(
title: Text(todos[İndex].baslik),
//Bir kullanıcı ListTile öğesine dokunduğunda, DetailScreen'e gidin.
//Sadece bir DetailScreen oluşturmakla kalmayacağınıza dikkat edin,
// mevcut todo'yu ona aktarıyorsunuz.
onTap: () {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) =>
DetailScreen(todo: todos[İndex]),
),
);
},
);
},
);5. Dersimizde bu şekilde bitirdik umarım düzgün bir şekilde anlatıp bir şeyler öğretebilmişimdir. İyi forumlar.
Son düzenleme:
