ListView - 滚动列表控件,能将子控件组成可滚动的列表。
import 'package:flutter/material.dart';
void main(){
runApp(new MaterialApp(
title: "flutter控件-ListView",
home: new LayoutDemo(),
));
}
class LayoutDemo extends StatelessWidget{
//ListView的Item
Widget buildItem(BuildContext context, int index){
//设置分割线
if (index.isOdd) return new Divider();
//设置字体样式
TextStyle textStyle =
new TextStyle(fontWeight: FontWeight.bold, fontSize: 14.0);
//设置Padding
return new Padding(
padding: const EdgeInsets.all(8.0),
child: new Text("listview", style: textStyle));
}
@override
Widget build(BuildContext context) {
// TODO: implement build
return new Scaffold(
appBar: new AppBar(
title: new Text("ListView"),
),
body: new ListView.builder(
itemCount: 40,
itemBuilder: buildItem,
),
);
}
}
GridView
import 'package:flutter/material.dart';
void main(){
runApp(new MaterialApp(
title: "flutter控件-GridView",
home: new LayoutDemo(),
));
}
class LayoutDemo extends StatelessWidget{
List<Widget> buildGridTileList(int number) {
List<Widget> widgetList = new List();
for (int i = 0; i < number; i++) {
widgetList.add(getItemWidget());
}
return widgetList;
}
String url =
"https://ss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=495625508,"
"3408544765&fm=27&gp=0.jpg";
Widget getItemWidget() {
//BoxFit 可设置展示图片时 的填充方式
return new Image(image: new NetworkImage(url), fit: BoxFit.cover);
}
@override
Widget build(BuildContext context) {
// TODO: implement build
return new Scaffold(
appBar: new AppBar(
title: new Text("GridView"),
),
body:new GridView.count(
primary: false,
padding: const EdgeInsets.all(20.0),
crossAxisSpacing: 10.0,
crossAxisCount: 2,
children: buildGridTileList(5),
)
);
}
}