• flutter-GridView(网格列表)


    import 'package:flutter/material.dart';
    
    void main ()=> runApp(MyApp());
    
    class MyApp extends StatelessWidget{
      @override
      Widget build(BuildContext context){
        return MaterialApp(
          title:"Grid",
          home:Scaffold(
            appBar: AppBar(
              title:Text('Grid')
            ),
            // body:GridView.count(
            //   padding: const EdgeInsets.all(0.0),
            //   // 每行几个
            //   crossAxisCount: 3,
            //   //网格间距离
            //   crossAxisSpacing: 10.0,
            //   children: <Widget>[
            //     Icon(Icons.ac_unit),
            //     Icon(Icons.airport_shuttle),
            //     Icon(Icons.all_inclusive),
            //     Icon(Icons.beach_access),
            //     Icon(Icons.cake),
            //     Icon(Icons.free_breakfast),
            //   ],
            // )
            body: GridView(
              gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
                crossAxisCount: 3,
                mainAxisSpacing: 2.0,
                crossAxisSpacing: 2.0,
                //宽度和高度比
                childAspectRatio: 1,
              ),
              children: <Widget>[
                Image(
                  image: AssetImage('images/2222.png'),
                  fit: BoxFit.cover,
                ),
                Image(
                  image: AssetImage('images/2222.png'),
                ),
                Image(
                  image: AssetImage('images/2222.png'),
                ),
                Image(
                  image: AssetImage('images/2222.png'),
                ),
                Image(
                  image: AssetImage('images/2222.png'),
                ),
                Image(
                  image: AssetImage('images/2222.png'),
                ),
              ],
            ),
          )
        );
      }
    }
    import 'package:flutter/material.dart';

    void main ()=> runApp(MyApp());

    class MyApp extends StatelessWidget{
      @override
      Widget build(BuildContext context){
        return MaterialApp(
          title:"Grid",
          home:Scaffold(
            appBar: AppBar(
              title:Text('Grid')
            ),
            // body:GridView.count(
            //   padding: const EdgeInsets.all(0.0),
            //   // 每行几个
            //   crossAxisCount: 3,
            //   //网格间距离
            //   crossAxisSpacing: 10.0,
            //   children: <Widget>[
            //     Icon(Icons.ac_unit),
            //     Icon(Icons.airport_shuttle),
            //     Icon(Icons.all_inclusive),
            //     Icon(Icons.beach_access),
            //     Icon(Icons.cake),
            //     Icon(Icons.free_breakfast),
            //   ],
            // )
            body: GridView(
              gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
                crossAxisCount: 3,
                mainAxisSpacing: 2.0,
                crossAxisSpacing: 2.0,
                //宽度和高度比
                childAspectRatio: 1,
              ),
              children: <Widget>[
                Image(
                  image: AssetImage('images/2222.png'),
                  fit: BoxFit.cover,
                ),
                Image(
                  image: AssetImage('images/2222.png'),
                ),
                Image(
                  image: AssetImage('images/2222.png'),
                ),
                Image(
                  image: AssetImage('images/2222.png'),
                ),
                Image(
                  image: AssetImage('images/2222.png'),
                ),
                Image(
                  image: AssetImage('images/2222.png'),
                ),
              ],
            ),
          )
        );
      }
    }


  • 相关阅读:
    15 鼠标事件
    09 属性操作
    06 DOM操作之插入节点
    03 如何处理多个库$冲突的问题
    01 jquery引入
    08 千千音乐盒实现全选和反选
    03 衣服相册切换效果
    02 显示和隐藏图片
    01 图片切换
    派生
  • 原文地址:https://www.cnblogs.com/lxz-blogs/p/13225443.html
Copyright © 2020-2023  润新知