第二个app

// 做一个列表页
import 'package:flutter/material.dart';
import 'package:english_words/english_words.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title:"我的第二个App",
      theme: ThemeData(
        primaryColor:Colors.blue
      ),
      home: MyHomePage(title:"列表展示")
    );
  }
}

class MyHomePage extends StatefulWidget {

  final String title;
  MyHomePage({Key key,this.title}): super(key:key);

  @override
  _MyHomePageState createState() => _MyHomePageState();
}


List<Widget> makeList() {
  List<Widget> result = List();
  for(int i=0;i<100;i++){
    result.insert(i, new Container(
      padding: EdgeInsets.all(20),
      decoration: new BoxDecoration(border: Border(bottom: BorderSide(
        color: const Color(0xFFEEEEEE),
        width: 1,
        style: BorderStyle.solid
      ))),
      child: Text(new WordPair.random().asPascalCase),
    ));
  }
  return result;
}

class _MyHomePageState extends State<MyHomePage> {

  @override
  Widget build(BuildContext context) {
    //返回一个列表
    return Scaffold(
      appBar: AppBar(title: Text(widget.title)),
      body: new Container(
        child: new ListView(
          children: makeList(),
        ),
      )
    );
  }
}

效果:

3017321-b68735b76139f930.png
image.png

猜你喜欢

转载自blog.csdn.net/weixin_33743703/article/details/86974214