Aim : Demonstration of SingleChildScrollView, ListView, ListView.builder and
GridView widgets.
SinglechildScrollView:
Code :
body: SingleChildScrollView(
child: Column(children: [
Container(
height: 200,
color: Colors.red,
),
Container(
height: 200,
color: Colors.green,
),
Container(
height: 200,
color: Colors.blue,
),
Container(
height: 200,
color: Colors.black,
),
Container(
height: 200,
color: Colors.grey,
),
]),
),
Output:
ListView:
Code:
body: ListView(
children: [
Text('one'),
Text('two'),
Text('three'),
Text('four'),
Text('five'),
Text('six'),
],
),
ListView.builder:
Code:
@override
Widget build(BuildContext context) {
var arrName = ['fifth', 'first', 'ninth', 'second', 'eight'];
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
),
body: ListView.builder(
itemBuilder: (context, index) {
return Text(arrName[index]);
},
itemCount: arrName.length,
),
);
}
GridView:
Code :
body: GridView.count(
crossAxisCount: 3,
children: [
Container(
height: 200,
color: Colors.red,
),
Container(
height: 200,
color: Colors.green,
),
Container(
height: 200,
color: Colors.blue,
),
Container(
height: 200,
color: Colors.black,
),
Container(
height: 200,
color: Colors.grey,
),
Container(
height: 200,
color: Colors.green,
),
Container(
height: 200,
color: Colors.blue,
),
],
),
Comments
Post a Comment