增加容器大小

Question

我需要增加 Stack 中容器的高度，以便在底部有更多的文本空间，如下所示：

我的代码：

GridView.count(
    crossAxisCount: 2,
    shrinkWrap: true,
    physics: ScrollPhysics(),
    scrollDirection: Axis.vertical,
    children: List.generate(10, (index) {
        return Container(
            margin: EdgeInsets.all(15.0),
            child: Stack(
                children: < Widget > [
                    Container(
                        margin: EdgeInsets.only(top: 60),
                        alignment: Alignment.center,
                        padding: EdgeInsets.only(top: 35),
                        decoration: BoxDecoration(
                            borderRadius: BorderRadius.circular(10),
                            color: Colors.white,
                            boxShadow: [
                                BoxShadow(color: Colors.black.withOpacity(0.05), offset: Offset(0, 3), blurRadius: 7),
                            ],
                        ),
                        child: Container(
                            padding: EdgeInsets.symmetric(horizontal: 10),
                            child: Text(
                                categoryName[index % categoryName.length],
                                textAlign: TextAlign.center,
                                overflow: TextOverflow.clip,
                                style: TextStyle(
                                    color: const Color(0xFF71768D),
                                        fontSize: 14,
                                        fontFamily: 'Montserrat',
                                        fontWeight: FontWeight.w600,
                                ),
                            ),
                        )
                    ),
                    Positioned(
                        top: 0,
                        left: 0.0,
                        right: 0.0,
                        child: MaterialButton(
                            onPressed: null,
                            textColor: Colors.white,
                            disabledColor: colorList[index % colorList.length],
                            child: SvgPicture.asset(
                                iconList[index % iconList.length],
                                width: 40,
                                height: 40,
                            ),
                            padding: EdgeInsets.all(30),
                            shape: CircleBorder(),
                        )
                    ),
                    Positioned(
                        top: 0,
                        left: 0.0,
                        right: 0.0,
                        child: MaterialButton(
                            onPressed: null,
                            textColor: Colors.white,
                            disabledColor: Colors.white.withOpacity(0.1),
                            child: SvgPicture.asset(
                                iconList[index % iconList.length],
                                width: 40,
                                height: 40,
                            ),
                            padding: EdgeInsets.all(30),
                            shape: CircleBorder(),
                        )
                    )
                ]
            )
        );
    })
),

由于某种原因，文本所在的容器不会超过我网格中的指定值。 在我附上的图片中，这是最大高度，在真正的手机上，这个块甚至更小。

Answer 1

通过将childAspectRatio 0 更改为 1，您可以更改项目的高度

GridView.count(
    crossAxisCount: 2,
    shrinkWrap: true,
    physics: ScrollPhysics(),
    childAspectRatio: 0.6
    scrollDirection: Axis.vertical,
    children: List.generate(10, (index) {
        return Container(
            margin: EdgeInsets.all(15.0),
            child: Stack(
                children: < Widget > [
                    Container(
            child: Text('Sample')
        );
    })
)

Answer 2

您可以尝试使用此参数来控制项目之间的间距： crossAxisSpacing:和mainAxisSpacing:

GridView.count(
          crossAxisSpacing: 2,
          mainAxisSpacing: 6,
          padding: EdgeInsets.fromLTRB(0, 0, 0, 250),
          crossAxisCount: 2,
          shrinkWrap: true,
          physics: ScrollPhysics(),
          scrollDirection: Axis.vertical,
          children: List.generate(10, (index) { ...