Flutter ListView长列表布局

import 'package:flutter/material.dart';
void main() =>runApp(
  new MyApp()
);
// 在外部定义数据
const CITY_Names =['北京','田径','上海','北京','田径','上海','北京','田径','上海','北京','田径','上海','北京','田径','上海','北京','田径','上海','北京','田径','上海',];

class MyApp extends StatelessWidget {

  @override
  Widget build(BuildContext context) {
    final title = 'Basic List';
    return MaterialApp(
      title: title,
      home: Scaffold(
        appBar: AppBar(
          title: Text('title'),
        ),
        body: ListView(
          children: _buildList(),
        ),
      ),
    );
  }
  /把城市的名字 传入下面的小部件  转化为数组 
  List<Widget> _buildList(){
    return CITY_Names.map((city) =>_item(city)).toList();
  }
//写的是list 的样式
  Widget _item(String city){
    return Container(
      height: 80,
      margin: EdgeInsets.only(bottom:5),
      alignment: Alignment.center,
      decoration: BoxDecoration(
        color: Colors.teal
      ),
      child: Text(
        city,
        style:TextStyle(color:Colors.white,fontSize:20)
      ),
    );
  }
}

这段是flutter 实在携程网的代码,我在bilili 上看到的,初学者学习

已标记关键词 清除标记
相关推荐
©️2020 CSDN 皮肤主题: 数字20 设计师:CSDN官方博客 返回首页