What is ListView?
- Flutter course
- Beginner
- Lesson 46/99
- 4 min
Learn to build a scrollable list with ListView.
What is ListView?
ListView is a widget that arranges its children vertically and makes them scrollable. It resembles Column but automatically allows scrolling when content does not fit on screen. Its children parameter takes a list of widgets.
ListView(
children: [
Text('Birinci'),
Text('İkinci'),
Text('Üçüncü'),
],
)ListView and scroll
ListView automatically provides scrolling when content does not fit on screen. Using ListView instead of a Column + SingleChildScrollView combination is more efficient because ListView only renders the visible children. The scroll direction can be changed with scrollDirection; the default is Axis.vertical.
ListView(
scrollDirection: Axis.vertical,
children: [
ListTile(title: Text('Öğe 1')),
ListTile(title: Text('Öğe 2')),
ListTile(title: Text('Öğe 3')),
],
)
// Horizontal scrolling
ListView(
scrollDirection: Axis.horizontal,
children: [
Container(width: 100, color: Colors.red),
Container(width: 100, color: Colors.blue),
],
)Practice Print ListView info
In main, print two lines with print: listview kaydir and scroll dikey.
Starter code
void main() {
// iki satır yazdır:
// listview kaydir
// scroll dikey
}Sample solution
void main() {
print('listview kaydir');
print('scroll dikey');
}Expected output
listview kaydir scroll dikey
Questions and answers
Review the lesson questions together with their answers. To test yourself, solve the lesson interactively.
1 How does ListView differ from Column?
- ListView is scrollable, Column is not Correct answer
- ListView gives color, Column does not
- ListView arranges horizontally, Column vertically
- ListView takes one child, Column takes a list
Explanation: ListView provides a scrollable list; Column lays out at fixed height and adds no scrolling.
2 Scroll direction
ListView(
____: Axis.horizontal,
children: [...],
)ListView(
scrollDirection: Axis.horizontal,
children: [...],
)Explanation: The scrollDirection parameter sets the scroll direction of ListView.
3 ListView concepts
| Term | Meaning |
|---|---|
ListView |
Scrollable list |
scroll |
Scrolling content |
scrollDirection |
Scroll direction |
Axis.vertical |
Vertical scrolling |