首页 > 解决方案 > Flutter 滚动行

问题描述

我在列表视图中有一个行,它不会与我想要滚动的列表视图内容的其余部分一起滚动,因为列表视图中的卡滚动正常但不是行,我试图将它放在 Stack 中,但仍然同样的问题

这是我的代码

    return Scaffold(
  backgroundColor: Colors.white,
  appBar: AppBar()
  body: ListView(
    scrollDirection: Axis.vertical,
    shrinkWrap: true,
    children: [
      Row(
        mainAxisAlignment: MainAxisAlignment.spaceEvenly,
        children: [
          GestureDetector(
            onTap: () {
              Navigator.pushNamed(context, route.Prochaines_route);
            },
            child: Container(
              padding: EdgeInsets.all(17.0),
              decoration: BoxDecoration(
                shape: BoxShape.circle,
                color: Color(0xFFe0f2f1),
              ),
              child: Container(
                child: Text(
                  "Prochianes",
                  style: TextStyle(
                    color: Color(0xFF30a6ca),
                  ),
                ),
              ),
            ),
          ),
          GestureDetector(
            onTap: () {
              Navigator.pushNamed(context, route.EnCours_route);
            },
            child: Container(
              padding: EdgeInsets.all(17.0),
              decoration: BoxDecoration(
                shape: BoxShape.circle,
                color: Colors.white,
              ),
              child: Text("En cours"),
            ),
          ),
          GestureDetector(
            onTap: () {
              Navigator.pushNamed(context, route.Termines_route);
            },
            child: Container(
              padding: EdgeInsets.all(17.0),
              decoration: BoxDecoration(
                shape: BoxShape.circle,
                color: Colors.white,
              ),
              child: Text("Terminés"),
            ),
          ),
        ],
      ),
      Container(width: 300, height: 200, color: Colors.black),
      SizedBox(
        height: 30,
      ),
      Container(width: 300, height: 200, color: Colors.red),
      SizedBox(
        height: 30,
      ),
      Container(width: 300, height: 200, color: Colors.yellow),
      SizedBox(
        height: 30,
      ),
      Container(width: 300, height: 200, color: Colors.green),
      SizedBox(
        height: 30,
      ),
      Container(width: 300, height: 200, color: Colors.brown),
      SizedBox(
        height: 30,
      ),
      Container(width: 300, height: 200, color: Colors.red),
    ],
  ),
);

我在列表视图中有一个行,它不会与我想要滚动的列表视图内容的其余部分一起滚动,因为列表视图中的卡滚动正常但不是行,我试图将它放在 Stack 中,但仍然同样的问题

谢谢你的帮助。

标签: flutterscroll

解决方案


请试试这个:

Column(
    children: [
      Row(
        mainAxisAlignment: MainAxisAlignment.spaceEvenly,
        children: [
          GestureDetector(
            onTap: () {
              // Navigator.pushNamed(context, route.Prochaines_route);
            },
            child: Container(
              padding: EdgeInsets.all(17.0),
              decoration: BoxDecoration(
                shape: BoxShape.circle,
                color: Color(0xFFe0f2f1),
              ),
              child: Container(
                child: Text(
                  "Prochianes",
                  style: TextStyle(
                    color: Color(0xFF30a6ca),
                  ),
                ),
              ),
            ),
          ),
          GestureDetector(
            onTap: () {
              // Navigator.pushNamed(context, route.EnCours_route);
            },
            child: Container(
              padding: EdgeInsets.all(17.0),
              decoration: BoxDecoration(
                shape: BoxShape.circle,
                color: Colors.white,
              ),
              child: Text("En cours"),
            ),
          ),
          GestureDetector(
            onTap: () {
              // Navigator.pushNamed(context, route.Termines_route);
            },
            child: Container(
              padding: EdgeInsets.all(17.0),
              decoration: BoxDecoration(
                shape: BoxShape.circle,
                color: Colors.white,
              ),
              child: Text("Terminés"),
            ),
          ),
        ],
      ),
      Expanded(
        child: ListView(
        scrollDirection: Axis.vertical,
        shrinkWrap: true,
        children: [
          Container(width: 300, height: 200, color: Colors.black),
          SizedBox(
            height: 30,
          ),
          Container(width: 300, height: 200, color: Colors.red),
          SizedBox(
            height: 30,
          ),
          Container(width: 300, height: 200, color: Colors.yellow),
          SizedBox(
            height: 30,
          ),
          Container(width: 300, height: 200, color: Colors.green),
          SizedBox(
            height: 30,
          ),
          Container(width: 300, height: 200, color: Colors.brown),
          SizedBox(
            height: 30,
          ),
          Container(width: 300, height: 200, color: Colors.red),
        ],
),
      ),
    ],
  ),

推荐阅读