import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
home: HomePage(),
);
}
} class HomePage extends StatefulWidget {
@override
_HomePageState createState() => _HomePageState();
} class _HomePageState extends State<HomePage> {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Home Page'),
),
body: ListView(
children: <Widget>[
ListTile(
title: Text('data'),
),
ListTile(
title: Text('data'),
),
GridView.count(
primary:
false, // https://api.flutter.dev/flutter/widgets/ScrollView/primary.html
shrinkWrap: true, // 限制约束 https://api.flutter.dev/flutter/widgets/ScrollView/shrinkWrap.html
crossAxisCount: 3,
children: List<Widget>.generate(
7,
(_) => Container(
color: Colors.red,
margin: const EdgeInsets.all(8),
)),
),
ListTile(
title: Text('data'),
),
ListTile(
title: Text('data'),
),
],
),
);
}
}

or use CustomScrollView

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(home: HomePage());
}
} class HomePage extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Home Page'),
),
body: CustomScrollView(
slivers: <Widget>[
SliverList(
delegate: SliverChildListDelegate([
ListTile(title: Text("data")),
ListTile(title: Text("data")),
])),
SliverGrid.count(
crossAxisCount: 3,
children: List<Widget>.generate(
7,
(_) => Container(
color: Colors.red,
margin: const EdgeInsets.all(8),
),
),
),
SliverList(
delegate: SliverChildListDelegate([
ListTile(title: Text("data")),
ListTile(title: Text("data")),
])),
],
),
);
}
}

Flutter 在同一页面显示List和Grid的更多相关文章

  1. 【Flutter学习】页面跳转之路由及导航

    一,概述 移动应用通常通过成为‘屏幕’或者‘页面’的全屏元素显示其内容,在Flutter中,这些元素统称为路由,它们由导航器Navigator组件管理.导航器管理一组路由Route对象,并提供了管理堆 ...

  2. 用struts2标签如何从数据库获取数据并在查询页面显示。最近做一个小项目,需要用到struts2标签从数据库查询数据,并且用迭代器iterator标签在查询页面显示,可是一开始,怎么也获取不到数据,想了许久,最后发现,是自己少定义了一个变量,也就是var变量。

    最近做一个小项目,需要用到struts2标签从数据库查询数据,并且用迭代器iterator标签在查询页面显示,可是一开始,怎么也获取不到数据,想了许久,最后发现,是自己少定义了一个变量,也就是var变 ...

  3. destoon公司搜索页面显示公司类型

    首先找到前台模板文件:/template/default/company/search.htm 看到51行 {template 'list-company', 'tag'} 打开 /template/ ...

  4. HTML5中与页面显示相关的API

    1.HTML5中与页面显示相关的API 在HTML5中,增加了几个与页面显示相关的API,其中一个是Page Visibility API Page Visibility API  是指当页面变为最小 ...

  5. 转:jsp页面显示中文乱码解决方案

    jsp页面显示中文乱码: jsp页面的编码方式有两个地方需要设置: <%@ page language="java" import="java.util.*&quo ...

  6. js控制页面显示和表单提交

    早期的web页面在显示方面一般在后台进行控制,虽然对后台开发来讲是比较容易做到的,但是涉及到一个问题,那就是数据库压力. 因为要控制显示,所以会比较频繁的从数据库中来回调用. 现在的js功能越来越强, ...

  7. 页面显示(pageshow)和页面隐藏(pagehide)事件

    Firefox和Opera有一个新特性,名叫“往返缓存”(back-forward cache,或bfcache),可以在用户使用浏览器的“后退”和“前进”按钮时加快页面的转换速度.这个缓存中不仅保存 ...

  8. jsp页面显示数据库乱码

    如何页面是utf-8,数据库也是的话,页面显示数据库乱码的话,就是数据库的格式有问题

  9. 判断数据库内容,在页面显示自定义数据case when

    判断数据库内容,在页面显示自定义数据 case when...then ...else...end 比如:数据库内容是这样: 通过sql语句判断,数据库的name字段,内容是月桂的,显示嫦娥,其他的显 ...

随机推荐

  1. Java 从Character和char的区别来学习自动拆箱装箱

    本文结构 1.Character和char 的区别: 2.自动拆箱装箱 1.Character和char 的区别: Character是类,char基本数据类型. 在java中有三个类负责对字符的操作 ...

  2. 云原生项目实践DevOps(GitOps)+K8S+BPF+SRE,从0到1使用Golang开发生产级麻将游戏服务器—第1篇

    项目初探 项目地址: 原项目:https://github.com/lonng/nanoserver 调过的:https://github.com/Kirk-Wang/nanoserver 这将是一个 ...

  3. MySql(一)表类型(存储引擎)

    MySql(一)表类型(存储引擎) 一.MYSQL存储引擎概述 二.存储引擎的特性对比 2.1 MyISAM 2.2 InnoDB 2.2.1 自动增长列 2.2.2 外键约束 2.2.3 存储方式 ...

  4. c++面试笔试集锦

    1. char *const p 是指针常量,通俗的解释:指针本身是一个常量 也就是不能改变该指针的指向性,可以改变指向的量的值 const char *p 是常量指针,解释:指向常量的指针,指针指向 ...

  5. .Net微服务实战之必须得面对的分布式问题

    系列文章 .Net微服务实战之技术选型篇 .Net微服务实战之技术架构分层篇 .Net微服务实战之DevOps篇 .Net微服务实战之负载均衡(上) .Net微服务实战之CI/CD .Net微服务实战 ...

  6. WPS Excel启用正则表达式

    WPS Excel启用正则表达式 新建一个空白表格文件 进入VB编辑器 插入模块 工具-引用-勾选正则表达式 (Microsoft VBScript Regular Express 5.5) 复制代码 ...

  7. Flink-v1.12官方网站翻译-P025-Queryable State Beta

    可查询的状态 注意:可查询状态的客户端API目前处于不断发展的状态,对所提供接口的稳定性不做保证.在即将到来的Flink版本中,客户端的API很可能会有突破性的变化. 简而言之,该功能将Flink的托 ...

  8. Educational Codeforces Round 91 (Rated for Div. 2) A. Three Indices

    题目链接:https://codeforces.com/contest/1380/problem/A 题意 给出一个大小为 $n$ 的排列,找出是否有三个元素满足 $p_i < p_j\ and ...

  9. P2762 太空飞行计划问题 (最小割)

    题意:n个实验 每个实验可获利ai元 做每个实验需要几个仪器 购买每个仪器有不同的花费 不同实验可能会用到同一个仪器 只用购买一次 求最大收益 题解:......................... ...

  10. Codeforces Round #646 (Div. 2) A. Odd Selection(数学)

    题目链接:https://codeforces.com/contest/1363/problem/A 题意 判断是否能从 $n$ 个数中选 $x$ 个数加起来和为奇数. 题解 首先 $n$ 个数中至少 ...