Flutter基础（ListvView，GridView）- 七

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),
      )
    );

  }
}