class CardDemo extends StatefulWidget {
@override
_CardDemoState createState() => _CardDemoState();
}
class _CardDemoState extends State<CardDemo> {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: Text('CardlDemo'), elevation: 0.0,),
body: Container(
padding: EdgeInsets.all(16.0),
child: ListView(
children: items.map((item) {
return Card(
child: Column(
children: <Widget>[
AspectRatio(
aspectRatio: 1/1,
child: ClipRRect( // 给图片上面添加圆角效果
borderRadius: BorderRadius.only(topLeft: Radius.circular(4.0), topRight: Radius.circular(4.0)),
child: Image.network(item.imageUrl, fit: BoxFit.cover,),
),
),
ListTile(
leading: CircleAvatar(backgroundImage: NetworkImage(item.imageUrl),),
title: Text(item.title),
subtitle: Text(item.subTitle),
),
Container(padding: EdgeInsets.all(16.0),child: Text(item.description,maxLines: 2, overflow: TextOverflow.ellipsis,),),
ButtonTheme.bar(
child: ButtonBar(
children: <Widget>[
FlatButton(onPressed: () {}, child: Text('收藏')),
FlatButton(onPressed: () {}, child: Text('赞'))
],
),
),
],
),
);
}).toList(),
),
)
);
}
}
其中items数据源是这样的
class listItemModel {
listItemModel ({
this.title,
this.subTitle,
this.imageUrl,
this.description,
});
final String title;
final String subTitle;
final String imageUrl;
final String description;
bool selected = false;
}
final List<listItemModel> items = [
listItemModel(
title: '大耳朵图图',
subTitle: '突然想到的',
imageUrl: 'https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1559384010222&di=f4a0b36f7466387d6a0b909186ad0c86&imgtype=0&src=http%3A%2F%2Fimage.biaobaiju.com%2Fuploads%2F20180707%2F05%2F1530911272-gKxRVwjmpN.jpg',
description: '圆圆的脑袋，大大耳朵，笨手又笨脚，跑步像陀螺，一动小脑筋总是出错，想要做好事，但总闯祸。爸爸说我是个，是个机灵鬼，妈妈摇头叫我，叫我淘气包！图图，我是爸爸妈妈心爱的小孩，图图，这世界有了我生活少不了，图图，图图。我的小肚皮，圆圆鼓鼓，里面装满了，冰激凌蛋糕，老师你可知道，乖小孩的苦恼，我最爱在阳光下，蹦蹦跳跳，图图，我是爸爸妈妈心爱的小孩，图图，这世界有了我生活少不了，图图，图图...(妈妈：图图，我刚买的巧克力呢？）'
),
listItemModel(
title: '哆啦a梦',
subTitle: '机器猫！！',
imageUrl: 'https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=2390044523,1847392963&fm=26&gp=0.jpg',
description: '每天过的都一样，偶尔会突发奇想，只要有了哆啦A梦，幻想就会无限延长，快乐时与我分享，难过时陪在身旁，滔滔它的神奇口袋，就会把烦恼遗忘，找传说的宝藏，冒险跑到远方，看我的，任意门，昂昂昂，哆啦A梦和我一起，让梦想发光。。'
),
listItemModel(
title: '一休哥',
subTitle: '我在思考问题',
imageUrl: 'https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1559384450492&di=c410bbebf7e2974897affb2e1ebdfff8&imgtype=0&src=http%3A%2F%2Fwww.dadou.com%2FUpload%2FFckEditImage%2FQQ%25BD%25D8%25CD%25BC20131217160957.png',
description: '格叽格叽格叽格叽格叽格叽，我们爱你，格叽格叽格叽格叽格叽格叽，聪明伶俐，机智啊那个也比不过小机灵，大风大雨什么都不畏惧小机灵，淘气顽皮顽皮淘气数第一，骂人打架却从来没有你小机灵，啊～啊～开动脑筋呀，困难重重，困难重重，你毫不介意'
),
listItemModel(
title: '忍者神龟',
subTitle: '忍者神龟。。。。',
imageUrl: 'http://images.ali213.net/picfile/pic/2010-03-24/500_12565963760.jpg',
description: 'teenage mutant ninja turtles，teenage mutant ninja turtles，teenage mutant ninja turtles，heroes in a half-shell，turtle power!'
),
listItemModel(
title: '光头强',
subTitle: '我是光头强。。',
imageUrl: 'http://img08.oneniceapp.com/upload/avatar/2017/12/07/e5521550e7dc656645c07f1efb0bac58.jpg',
description: '冬眠假期刚刚结束，我还有点糊涂，鸟儿在头顶把森林叫醒，春天空气让我很舒服，天上太阳已红扑扑，看起来很模糊，远处山坡有几棵小树，去年冬眠前我没记住'
),
listItemModel(
title: '熊二',
subTitle: '俺是熊二！！',
imageUrl: 'http://i3.qhmsg.com/t01f0a5906f7c201806.jpg',
description: '青草香 浆果甜 喝着露水靠着树，抬起头 垫脚尖 加快我长大的脚步，吹口哨 哼着歌 摇摇晃晃找到路，晃脑袋 揉眼睛 长大的我还有点小糊涂'
),
listItemModel(
title: '超级飞侠',
subTitle: '超级飞侠。。。',
imageUrl: 'http://f3.rednet.cn/data/attachment/wq_wechatcollecting/article/201704/18/434415/5073156839010a8885f5ab8fc181e4ba.jpg',
description: '一飞冲天 到世界各地，新的任务 新的挑战，超级飞侠 在身边，神奇世界 千变万化，一起发现'
),
listItemModel(
title: '樱桃小丸子',
subTitle: '你好，我是樱桃小丸子！',
imageUrl: 'http://b-ssl.duitang.com/uploads/item/201606/23/20160623110825_adyLj.thumb.700_0.jpeg',
description: '抠牙齿书没背晚回家，人人多少都有些坏习惯，今天这样明天一样怎么办，我总不能永远这样会完蛋，下定决心把缺点打倒，不怕跌倒信心最重要，我们都是这样长大，稍息立正站好!霹雳啪啦呼噜哗啦铅笔找不到，铿铿锵锵乒乒乓乓上课又迟到呜吗吗呼呼哈哈做事不能一团糟，稍息立正站好'
)
];
