flutter - 打开卡片上的特定页面
问题描述
我正在尝试用卡片创建一个网格,但我无法链接到特定页面。
如果他们能以任何其他方式做到这一点,我会很高兴。
body: Container(
child: GridView(
gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
crossAxisCount: 2,mainAxisSpacing: 2,crossAxisSpacing: 0,
childAspectRatio: 1.5),
scrollDirection: Axis.vertical,
children: [
Card(
child: Container(
child: Center(
child: Text('Breakfast',textAlign: TextAlign.center,
style: TextStyle(fontSize: 18,color: Colors.white,fontWeight: FontWeight.bold),
),
),
decoration: BoxDecoration(
image: DecorationImage(
image: AssetImage('assets/images/breakfast.jpg'),
fit: BoxFit.fitWidth,
),
),
padding: EdgeInsets.all(45.0),
),
),
Card(
child: Container(
child: Center(
child: Text('Breakfast',textAlign: TextAlign.center,
style: TextStyle(fontSize: 18,color: Colors.white,fontWeight: FontWeight.bold),
),
),
decoration: BoxDecoration(
image: DecorationImage(
image: AssetImage('assets/images/lunch.jpg'),
fit: BoxFit.fitWidth,
),
),
padding: EdgeInsets.all(45.0),
),
),
],
),
),
有人可以帮助我吗?
解决方案
您应该用 a 包装每张卡片GestureDetector
并使用 将onTap:
其推送到您的特定页面。
GestureDetector(
onTap: () {
Navigator.push(context,
MaterialPageRoute(builder: (context) => YourRoute());},
child: Card(
child: Container(
child: Center(
child: Text(
'Breakfast',
textAlign: TextAlign.center,
style: TextStyle(
fontSize: 18,
color: Colors.white,
fontWeight: FontWeight.bold),
),
),
decoration: BoxDecoration(
image: DecorationImage(
image: AssetImage('assets/images/breakfast.jpg'),
fit: BoxFit.fitWidth,
),
),
padding: EdgeInsets.all(45.0),
),
),
),
推荐阅读
- ios - 我无法在文件管理器中创建目录
- angular - Ionic 3 - 类型“{}”上不存在属性“数据” - 尝试在设备上运行时
- apache-spark - 如何为结构化查询的不同代码部分指定分区数?
- python - 如何在 Django 中使用 rest_framework.authtoken 而不创建表 authtoken_token
- html - 如何在 Angular 中实现不同的视图?
- javascript - 如何保护我的 laravel 应用免受跨站脚本攻击?
- java - 给一些类添加main方法,方便测试
- java - 如何在春季使用 JPA 存储库从服务器检索 blob
- excel - 如何 SUMIFS 动态列?
- javascript - 获取图像宽度和高度而不将其保留在页面上