GridView.count 实现一行2张图的列表
class HomeContent extends StatelessWidget { const HomeContent({super.key}); List<Widget> _getListData() { var tempList = listData.map((value) { return Container( child: Column( children: <Widget>[ ClipRRect( borderRadius: BorderRadius.only( topLeft: Radius.circular(10.0), topRight: Radius.circular(10.0), ), child: Image.network( value["imageUrl"], fit: BoxFit.contain, ), ), // Image.network( // value["imageUrl"], // fit: BoxFit.contain, // ), SizedBox(height: 12), Text(value["title"], textAlign: TextAlign.left, style: TextStyle( fontSize: 20, decoration: TextDecoration.lineThrough, decorationStyle: TextDecorationStyle.solid)), ], ), decoration: BoxDecoration( border: Border.all( color: Color.fromRGBO(230, 230, 230, 0.9), width: 1.0), borderRadius: const BorderRadius.all( Radius.circular(15), )), ); }); return tempList.toList(); } @override Widget build(BuildContext context) { return GridView.count( padding: EdgeInsets.all(20), crossAxisCount: 2, crossAxisSpacing: 20, mainAxisSpacing: 20, childAspectRatio: 4 / 5, children: _getListData()); } }
listData:
List listData = [ { "title": 'Candy Shop', "author": 'Mohamed Chahin', "imageUrl": 'https://www.itying.com/images/flutter/1.png', }, { "title": 'Childhood in a picture', "author": 'Google', "imageUrl": 'https://www.itying.com/images/flutter/2.png', }, { "title": 'Alibaba Shop', "author": 'Alibaba', "imageUrl": 'https://www.itying.com/images/flutter/3.png', }, { "title": 'Candy Shop', "author": 'Mohamed Chahin', "imageUrl": 'https://www.itying.com/images/flutter/4.png', }, { "title": 'Tornado', "author": 'Mohamed Chahin', "imageUrl": 'https://www.itying.com/images/flutter/5.png', }, { "title": 'Undo', "author": 'Mohamed Chahin', "imageUrl": 'https://www.itying.com/images/flutter/6.png', }, { "title": 'white-dragon', "author": 'Mohamed Chahin', "imageUrl": 'https://www.itying.com/images/flutter/7.png', } ];