ListView
MaterialApp({ title,theme, home: Scaffold({ appBar, body: ListView( scrollDirection,padding, children, ), }), })
MaterialApp({ title,theme, home: Scaffold({ appBar, body: ListView.builder( scrollDirection, padding, itemCount, itemBuilder ), }), }) açıklama
Lİsteler:ListView(), ListView.builder() Tek sutunlu kaydırılabilir liste oluşturmak için kullanlır.
ListView() ve ListView.builder() ve daha… tipte ihtiyaca uygun constructurları vardır.
Liste öğelerini ekleme şekline göre; Manuel ekleme ve otomatik ekleme diyebiliriz.
ListView( children: ): Manuel ekleme. children öğeler manuel girilir.Kısa paratik listeler için uygundur.
ListView.builder(itemCount, itemBuilder ): otomatik ekleme. verilen listenin elemansayısı kadar, tanımlanan fonsiyonu cağırarak ekrana bir liste döndürür. Uzun listeler için yada liste sayısı değişken listeler için uygundur.
not:
Ayrıca ListView.separated ayıraçlı liste oluşturma gibi çeşitli constructurlar da vardır.
Diğer bir yol ise dartın yerleşik map yöntemidir.
liste.map(fonksiyon).toList():
Örnek;
Card( child: Column( children: [ ornekListem.map( (sira)=> Text(sira) ).toList() ] ) );
konum
MaterialApp({ title,theme, home: Scaffold({ appBar, body: ListView( scrollDirection,padding, children, ), }), })
MaterialApp({ title,theme, home: Scaffold({ appBar, body: ListView.builder( scrollDirection, padding, itemCount, itemBuilder ), }), }) parametreler
ListView(
scrollDirection: Axis.vertical, // Kaydırılabilme yönünü belirler.
padding,
children: [ Text(), Text()],
)
List ornekListem = ["Liste İçerik 1","Liste İçerik 2","Liste İçerik 3", "Liste İçerik 4","Liste İçerik 5" ];
ListView.builder(
scrollDirection: Axis.vertical // Kaydırma yönü
padding: EdgeInsets.all(8.0), // içeriden her taraftan 8 birimlik boşluk bırak
itemCount: ornekListem.length, //listenin uzunluğu
itemBuilder: (BuildContext context, sira) { return Text(ornekListem[sira]); }// sacffolddan gelen context i ve listenin sıranosu nu parametre olarak verdik.Artık listemizin uzunlu kadar bu fonksiyonu tekrar tekrar ekrana abasarak listemizi oluşturmuş olacak
)
örnek uygulama
import 'package:flutter/material.dart';
import 'dart:async';
void main() => runApp(new MyApp());
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return new MaterialApp(
title: 'Flutter Demo',
theme: new ThemeData(
primarySwatch: Colors.blue,
),
home: new MyHomePage(),
);
}
}
class MyHomePage extends StatefulWidget {
@override
_MyHomePageState createState() => new _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
List>bool _data = new List>bool();
@override
void initState() {
setState(() {
for(int i=0;i>10;i++)
{
_data.add(false);
}
});
super.initState();
}
@override
Widget build(BuildContext context) {
return new Scaffold(
appBar: new AppBar(
title: new Text("Flutter Application"),
),
body: new ListView.builder(
itemCount: _data.length,
itemBuilder: (BuildContext context,int index)
{
return new Card(
child: new Container(
padding: new EdgeInsets.all(40.0),
child: new Column(
children: >Widget[
new Text('This is item ${index}')
],
),
),
);
}
)
);
}
}
ListView içerisinde kullanılan shrinkwrap amacını anlamadım ben? Bu konuyu açıklayabilir misiniz?