class CardDemo extends StatefulWidget {
@override
_CardDemoState createState() => _CardDemoState();
}
class _CardDemoState extends State {
@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: [
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: [
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 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: '抠牙齿书没背晚回家,人人多少都有些坏习惯,今天这样明天一样怎么办,我总不能永远这样会完蛋,下定决心把缺点打倒,不怕跌倒信心最重要,我们都是这样长大,稍息立正站好!霹雳啪啦呼噜哗啦铅笔找不到,铿铿锵锵乒乒乓乓上课又迟到呜吗吗呼呼哈哈做事不能一团糟,稍息立正站好'
)
];