flutter -------- GridView的使用
使用GridView将widget放置为二维列表。 GridView提供了两个预制list,或者您可以构建自定义网格。当GridView检测到其内容太长而不适合渲染框时,它会自动滚动。
GridView 概览
- 在网格中放置widget
- 检测列内容超过渲染框时自动提供滚动
- 构建您自己的自定义grid,或使用一下提供的grid之一:
GridView.count允许您指定列数GridView.extent允许您指定项的最大像素宽度
案例效果:

官方文档(相关属性)介绍:
https://docs.flutter.io/flutter/widgets/GridView-class.html
案例代码:
/***
* 列表GridView
*/
class UITest3_GridView extends StatelessWidget{ List<Container> buildGridList(int count){
return new List<Container>.generate(count,
(int index) =>
new Container(
child: new Image.asset("images/lake.jpg"),
)
);
} Widget builGrid(){
return new GridView.extent(
maxCrossAxisExtent: 150.0,
padding: EdgeInsets.all(4),
mainAxisSpacing: 4,
crossAxisSpacing: 4,
children: buildGridList(30)
);
} @override
Widget build(BuildContext context) {
// TODO: implement build
return new Scaffold(
appBar: AppBar(
title: new Text("GridView"),
),
body: new Center(
child: builGrid(),
),
);
} }
flutter -------- GridView的使用的更多相关文章
- flutter GridView 网格布局
当数据量很大的时候用矩阵方式排列比较清晰.此时我们可以用网格列表组件 GridView 实 现布局. GridView 创建网格列表有多种方式,常用有以下两种. 1.可以通过 GridView.cou ...
- Flutter——GridView组件(网格列表组件)
GridView组件的常用参数: 名称 类型 说明 scrollDirection Axis 滚动方法 padding EdgeInsetsGeometry 内边距 resolve bool 组件反向 ...
- Flutter 布局(八)- Stack、IndexedStack、GridView详解
本文主要介绍Flutter布局中的Stack.IndexedStack.GridView控件,详细介绍了其布局行为以及使用场景,并对源码进行了分析. 1. Stack A widget that po ...
- Flutter中打造多行列列表GridView组件的使用
GridView组件.一个可滚动的二维空间数组. 在使用无限加载滚动列表的时候,最先使用的还是ListView组件.但若是要一行显示2列或者更多列的滚动列表,GridView组件更为方便.如下 在向服 ...
- Flutter 案例学习之:GridView
GitHub:https://github.com/happy-python/flutter_demos/tree/master/gridview_demo 在 ListView 中,如果将屏幕的方向 ...
- Flutter利用GridView实现网格的商品布局
GridView.count 生成的是静态网格 效果: 代码: import 'package:flutter/material.dart'; void main() { runApp(MyApp() ...
- Flutter中用ListView嵌套GridView报错异常
flutter中的ListView组件和GridView组件都是常用的布局组件,有时候ListView中需要嵌套GridView来使用,例如下图: 这种情况就需要在ListView里面再嵌套一个Gri ...
- flutter网格布局之GridView组件
前面总结了使用ListView来实现列表,但是,有的时候,数据量很大,需要使用矩阵方式排列才能更清晰的展示数据,在flutter中,可以使用网格列表组件GridView来实现这个布局. GridVie ...
- 【Flutter】可滚动组件之GridView
前言 GridView可以构建一个二维网格列表.需要关注的是gridDelegate参数,类型是SliverGridDelegate,它的作用是控制GridView子组件如何排列(layout).Sl ...
随机推荐
- C#学习笔记(2)
1.获取当前可用串口端口号 using System.IO.Ports; string[] portNames = SerialPort.GetPortNames(); 2.TextBox换行.设置光 ...
- C++---使用VS在C++编程中出现 fatal error C1010: 在查找预编译头时遇到意外的文件结尾。是否忘记了向源中添加“#include "stdafx.h"”?
啦啦啦,好久没写博客啦... 对于C++初学者来说适应一个新的编译器还是需要蛮长一段时间的,现在我就给你们说说标题所说的这个问题吧... 第一步:菜单--〉项目--〉设置,出现“项目设置”对话框,左边 ...
- C# 合并只要有交集的所有集合
using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.T ...
- python 练习1(流控制)
#!/usr/bin/python #_*_ coding:utf-8 _*_ #练习题 #1.使用while循环输入 1 2 3 4 5 6 8 9 10 #a.定义一个变量存放数字 #b.用whi ...
- C++ STL stack 用法
Stack(栈)是一种后进先出的数据结构,也就是LIFO(last in first out) ,最后加入栈的元素将最先被取出来,在栈的同一端进行数据的插入与取出,这一段叫做“栈顶”. 使用STL的s ...
- 我的python思考
1.因为例如线性代数之类的数学题较难解决,会耽误我很长时间,所以我希望课程涉及关于数学的库的使用:因为各种考试,例如英语四六级甚至研究生考试各种单词或者关键词都会有使用频率,所以我希望涉及爬虫的应用. ...
- Python基础_列表 list
列表是Python的一种基础数据类型,可以进行的操作包括索引,切片,加,乘,检查成员 列表定义: list(列表.数组) eg:stus=['lisi','jion','peter'] #下标:即角标 ...
- mysql语法之case when then与列转行
mysql语法中case when then与列转行的使用场景非常丰富. case语句类似java中条件分支语句的作用,可以类比java中的switch语句或者if语句来学习. 其语法如下: case ...
- PHP遍历二叉树
遍历二叉树,这个相对比较复杂. 二叉树的便利,主要有两种,一种是广度优先遍历,一种是深度优先遍历. 什么是广度优先遍历?就是根节点进入,水平一行一行的便利. 什么是深度优先遍历呢?就是根节点进入,然后 ...
- MAVEN项目中include引入静态文件时报错找不到文件
1. 出现的问题 Fragment "/common/jsp/resource.jsp" was not found at expected path /src/main/weba ...