{"id":990,"date":"2022-05-21T16:23:00","date_gmt":"2022-05-21T08:23:00","guid":{"rendered":"http:\/\/blog.xrhoujie.com\/?p=990"},"modified":"2022-06-15T16:20:47","modified_gmt":"2022-06-15T08:20:47","slug":"flutter%e5%9f%ba%e7%a1%80%e6%95%99%e7%a8%8bgirdview","status":"publish","type":"post","link":"http:\/\/blog.xrhoujie.com\/?p=990","title":{"rendered":"flutter\u57fa\u7840\u6559\u7a0b(GirdView)"},"content":{"rendered":"\n

\u5206\u4eab\u51e0\u4e2a\u5b66\u4e60flutter\u7684\u5b66\u4e60\u7f51\u7ad9\u4e0e\u8d44\u6e90<\/p>\n\n\n\n

flutter\u5b9e\u6218\u7b2c\u4e8c\u7248https:\/\/book.flutterchina.club\/chapter6\/gridview.html#_6-6-1-%E9%BB%98%E8%AE%A4%E6%9E%84%E9%80%A0%E5%87%BD%E6%95%B0<\/a><\/p>\n\n\n\n

flutter\u4e2d\u6587\u6587\u6863https:\/\/flutter.cn\/docs\/get-started\/flutter-for\/web-devs<\/a><\/p>\n\n\n\n

main_GirdView1.dart<\/strong><\/p>\n\n\n\n

import 'package:flutter\/material.dart';\nvoid main () => runApp(MyApp());\n\nclass MyApp extends StatelessWidget{\n  @override\n  Widget build(BuildContext context ){\n      return MaterialApp(\n        title:'ListView widget',\n        home:Scaffold(\n          body:GridView.count(\n            \/\/padding:\u8868\u793a\u5185\u8fb9\u8ddd\uff0c\u8fd9\u4e2a\u5c0f\u4f19\u4f34\u4eec\u5e94\u8be5\u5f88\u719f\u6089\u3002\n            padding:const EdgeInsets.all(20.0),\n             \/\/crossAxisSpacing:\u7f51\u683c\u95f4\u7684\u7a7a\u5f53\uff0c\u76f8\u5f53\u4e8e\u6bcf\u4e2a\u7f51\u683c\u4e4b\u95f4\u7684\u95f4\u8ddd\u3002\n            crossAxisSpacing: 10.0,\n            \/\/crossAxisCount:\u7f51\u683c\u7684\u5217\u6570\uff0c\u76f8\u5f53\u4e8e\u4e00\u884c\u653e\u7f6e\u7684\u7f51\u683c\u6570\u91cf\u3002\n            crossAxisCount: 3,\n            children: <Widget>[\n              const Text('I am Jspang'),\n              const Text('I love Web'),\n              const Text('jspang.com'),\n              const Text('\u6211\u559c\u6b22\u73a9\u6e38\u620f'),\n              const Text('\u6211\u559c\u6b22\u770b\u4e66'),\n              const Text('\u6211\u559c\u6b22\u5403\u706b\u9505')\n            ],\n          )\n        ),\n      );\n  }\n}<\/code><\/pre>\n\n\n\n
main_GirdView2.dart<\/strong><\/p>\n\n\n\n
import 'package:flutter\/material.dart';\nvoid main () => runApp(MyApp());\n\nclass MyApp extends StatelessWidget{\n  @override\n  Widget build(BuildContext context ){\n      return MaterialApp(\n        title:'ListView widget',\n        home:Scaffold(\n          body:GridView(\n            gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(\n            crossAxisCount: 3,\n              mainAxisSpacing: 2.0,\n              crossAxisSpacing: 2.0,\n              \/\/childAspectRatio:\u5bbd\u9ad8\u6bd4\uff0c\u8fd9\u4e2a\u503c\u7684\u610f\u601d\u662f\u5bbd\u662f\u9ad8\u7684\u591a\u5c11\u500d\uff0c\u5982\u679c\u5bbd\u662f\u9ad8\u76842\u500d\uff0c\u90a3\u6211\u4eec\u5c31\u51992.0\uff0c\u5982\u679c\u9ad8\u662f\u5bbd\u76842\u500d\uff0c\u6211\u4eec\u5c31\u51990.5\u3002\u5e0c\u671b\u5c0f\u4f19\u4f34\u4eec\u7406\u89e3\u4e00\u4e0b\u3002\n              childAspectRatio: 0.7\n            ),\n            children: <Widget>[\n             new Image.network('http:\/\/img5.mtime.cn\/mt\/2018\/10\/22\/104316.77318635_180X260X4.jpg',fit: BoxFit.cover),\n             new Image.network('http:\/\/img5.mtime.cn\/mt\/2018\/10\/10\/112514.30587089_180X260X4.jpg',fit: BoxFit.cover),\n             new Image.network('http:\/\/img5.mtime.cn\/mt\/2018\/11\/13\/093605.61422332_180X260X4.jpg',fit: BoxFit.cover),\n             new Image.network('http:\/\/img5.mtime.cn\/mt\/2018\/11\/07\/092515.55805319_180X260X4.jpg',fit: BoxFit.cover),\n             new Image.network('http:\/\/img5.mtime.cn\/mt\/2018\/11\/21\/090246.16772408_135X190X4.jpg',fit: BoxFit.cover),\n             new Image.network('http:\/\/img5.mtime.cn\/mt\/2018\/11\/17\/162028.94879602_135X190X4.jpg',fit: BoxFit.cover),\n             new Image.network('http:\/\/img5.mtime.cn\/mt\/2018\/11\/19\/165350.52237320_135X190X4.jpg',fit: BoxFit.cover),\n             new Image.network('http:\/\/img5.mtime.cn\/mt\/2018\/11\/16\/115256.24365160_180X260X4.jpg',fit: BoxFit.cover),\n             new Image.network('http:\/\/img5.mtime.cn\/mt\/2018\/11\/20\/141608.71613590_135X190X4.jpg',fit: BoxFit.cover),\n\n            ],\n          )\n        ),\n      );\n  }\n}<\/code><\/pre>\n","protected":false},"excerpt":{"rendered":"
\u5206\u4eab\u51e0\u4e2a\u5b66\u4e60flutter\u7684\u5b66\u4e60\u7f51\u7ad9\u4e0e\u8d44\u6e90 flutter\u5b9e\u6218\u7b2c\u4e8c\u7248https:\/\/book.flutterc […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[43,1],"tags":[42],"_links":{"self":[{"href":"http:\/\/blog.xrhoujie.com\/index.php?rest_route=\/wp\/v2\/posts\/990"}],"collection":[{"href":"http:\/\/blog.xrhoujie.com\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/blog.xrhoujie.com\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/blog.xrhoujie.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/blog.xrhoujie.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=990"}],"version-history":[{"count":1,"href":"http:\/\/blog.xrhoujie.com\/index.php?rest_route=\/wp\/v2\/posts\/990\/revisions"}],"predecessor-version":[{"id":991,"href":"http:\/\/blog.xrhoujie.com\/index.php?rest_route=\/wp\/v2\/posts\/990\/revisions\/991"}],"wp:attachment":[{"href":"http:\/\/blog.xrhoujie.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=990"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/blog.xrhoujie.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=990"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/blog.xrhoujie.com\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=990"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}