dart - Flutter 布局问题(ListView 和 GridView)
问题描述
我是 Flutter 的新手,我在使用 ListView 构建布局时遇到了困难。
顶部运行良好,带有水平滚动。但我想要一个 GridView 滚动整个页面,而不是单独滚动。只有当我在边缘滚动时它才有效。
有人可以帮助我吗?这是代码。
这是我遇到麻烦的小部件
import 'package:flutter/material.dart';
import 'package:ubaia/components/titulo.dart';
class Categorias extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Column(
children: <Widget>[
Padding(
padding: const EdgeInsets.all(8.0),
child: Titulo(title: "Categorias"),
),
GridView.count(
shrinkWrap: true,
crossAxisCount: 2,
scrollDirection: Axis.vertical,
children: List.generate(8, (index) {
return Center(
child: Container(
height: 130,
width: 130,
color: Colors.brown,
),
);
}),
)
],
);
}
}
这是我登陆小部件的页面
//Homepage
import 'package:flutter/material.dart';
import 'package:ubaia/components/comprados_rencentemente.dart';
import 'package:ubaia/components/categorias.dart';
class MyHomePage extends StatefulWidget {
MyHomePage({Key key, this.title}) : super(key: key);
final String title;
@override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
actions: <Widget>[
Padding(
padding: const EdgeInsets.only(right: 16.0),
child: Icon(Icons.person),
),
],
),
body: Container(
child: ListView(
padding: EdgeInsets.all(16.0),
children: <Widget>[
CompradosRecentemente(), //This is the widget that works nice
Categorias(),
],
),
),
bottomSheet: Container(
height: 50,
color: Colors.brown,
child: Center(
child: Text(
"Minha Cesta",
style: TextStyle(color: Colors.white),
)),
));
}
}
解决方案
在您的代码physics: ClampingScrollPhysics()
中- 添加 -GridView.count
GridView.count(
shrinkWrap: true,
crossAxisCount: 2,
physics: ClampingScrollPhysics(), // Add this line
推荐阅读
- reactjs - React Ant Design Modal Method 更新状态变化
- windows - 如何为同一服务器实例上的多个 Visual Studio 实例创建多个 IIS 实例?
- java - Socket.io 发出和侦听器函数在 Android 上不起作用
- python - 文件的Python列表理解
- php - 使用 WP ALL IMPORT 时如何将数据插入数据库上的特定表
- swift - 如何创建具有多种颜色的 Apple Watch 复杂功能?
- javascript - 与 Iframe 交互后,如何防止 Iframe 弄乱浏览器的历史记录?
- javascript - GET http://localhost:8080/index.js net::ERR_ABORTED 404(未找到)
- python - 无法使用 exec (Python) 从另一个文件访问外部变量
- reactjs - 反应路由器重复的 URL 参数