flutter - 如何解决 A RenderFlex 底部溢出 8.5 像素。在网格视图中

Question

我需要帮助解决一个让我发疯的问题。

基本上，我想做一个GridView.count显示我不同对象的东西。到目前为止，除了一个问题外，一切都运行良好。

确实，我A RenderFlex overflowed by 8.5 pixels on the bottom.的GridView.count. 我尝试添加一个childAspectRatio，但根据屏幕大小显示不同。我希望我的尺寸GridView.count在每个屏幕上都保持不变。

有人有解决这个难题的方法吗？？

Padding(
      padding: const EdgeInsets.symmetric(horizontal: 16.0),
      child: PreferredSize(
        preferredSize: Size.fromHeight(120.0),
        child: GridView.count(
          shrinkWrap: true,
          physics: NeverScrollableScrollPhysics(),
          crossAxisCount: 2,
          crossAxisSpacing: 10.0,
          mainAxisSpacing: 10.0,
          children: List.generate(
            nearbySpaces.length,
            (index) {
              return Column(
                children: [
                  Container(
                    padding: EdgeInsets.all(10),
                    height: 110,
                    decoration: BoxDecoration(
                      image: DecorationImage(
                        image: AssetImage(nearbySpaces[index]['coverImage']),
                        fit: BoxFit.cover,
                      ),
                      borderRadius: BorderRadius.all(
                        Radius.circular(10.0),
                      ),
                    ),
                    child: Stack(
                      children: [
                        Row(
                          mainAxisAlignment: MainAxisAlignment.end,
                          children: [
                            Icon(
                              CupertinoIcons.heart_fill,
                              color: HexColor('#FF2D55'),
                            )
                          ],
                        ),
                        Column(
                          mainAxisAlignment: MainAxisAlignment.end,
                          children: [
                            Row(
                              mainAxisAlignment: MainAxisAlignment.end,
                              children: [
                                Container(
                                  padding: EdgeInsets.only(
                                      left: 10, right: 10, top: 7, bottom: 7),
                                  decoration: BoxDecoration(
                                      color: Colors.black.withOpacity(0.7),
                                      borderRadius: BorderRadius.circular(5)),
                                  child: Text(
                                    '€ ' +
                                        nearbySpaces[index]['price'] +
                                        '/hr',
                                    style: TextStyle(
                                      fontWeight: FontWeight.w500,
                                      color: Colors.white,
                                      fontSize: 13,
                                    ),
                                  ),
                                ),
                              ],
                            )
                          ],
                        )
                      ],
                    ),
                  ),
                  SizedBox(
                    height: 5,
                  ),
                  Column(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: [
                      Text(
                        nearbySpaces[index]['name'],
                        style: TextStyle(
                            fontSize: 15, fontWeight: FontWeight.w600),
                      ),
                      SizedBox(
                        height: 5,
                      ),
                      Row(
                        children: [
                          SvgPicture.asset(
                            'assets/images/icons/map_marker.svg',
                            width: 12,
                          ),
                          SizedBox(
                            width: 5,
                          ),
                          Text(
                            nearbySpaces[index]['distance'] + ' km away',
                            style:
                                TextStyle(color: Colors.grey, fontSize: 13),
                          )
                        ],
                      ),
                      SizedBox(
                        height: 5,
                      ),
                      Row(
                        children: [
                          SmoothStarRating(
                            rating:
                                double.parse(nearbySpaces[index]['average']),
                            isReadOnly: true,
                            size: 15,
                            filledIconData: Icons.star,
                            color: Colors.amber,
                            borderColor: Colors.grey,
                            halfFilledIconData: Icons.star_half,
                            defaultIconData: Icons.star_border,
                            starCount: 5,
                            allowHalfRating: false,
                            spacing: 1.0,
                            onRated: (value) {
                              print("rating value -> $value");
                              // print("rating value dd -> ${value.truncate()}");
                            },
                          ),
                          SizedBox(
                            width: 5,
                          ),
                          Text(
                            nearbySpaces[index]['average'].toString(),
                            style:
                                TextStyle(color: Colors.grey, fontSize: 13),
                          )
                        ],
                      )
                    ],
                  ),
                ],
              );
            },
          ),
        ),
      ),
    ),

标签： flutterdartflutter-layout

Answer 1

用小部件扭曲孩子的Flexible，检查：https ://www.youtube.com/watch?v=CI7x0mAZiY0 。