首页 > 解决方案 > 打开卡片上的特定页面

问题描述

我正在尝试用卡片创建一个网格,但我无法链接到特定页面。

如果他们能以任何其他方式做到这一点,我会很高兴。

    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),
                ),
              ),
            ],
          ),
        ),

有人可以帮助我吗?

标签: flutterdart

解决方案


您应该用 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),
                ),
              ),
            ),

推荐阅读