Flutter如何设置包裹gridview高度的列

问题描述 投票:0回答:4

我试图动态调整列的高度,因为我拥有的产品越多,我需要更多的列高度,下面是我的代码

Container(
          width: double.infinity,
          height: 1000,
          child: GridView.builder(
            physics: NeverScrollableScrollPhysics(),
            itemCount: productsList.length,
            gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
                crossAxisCount: 2,
                childAspectRatio: 22 / 30,
                mainAxisSpacing: 5,
                crossAxisSpacing: 3),
            itemBuilder: (ctx, i) {
              return ChangeNotifierProvider.value(
                value: productsList[i],
                child: FeedsProduct(),
              );
            },
          ),
        ),

如何动态设置容器高度?

flutter gridview
4个回答
1
投票

GridView 中有一个属性称为:shrinkWrap,请参阅shrinkWrap 属性

在这里你可以找到简单的例子

class SimpleExample extends StatelessWidget {
  const SimpleExample({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Container(
      child: SingleChildScrollView(
        child: Column(
          children: [
            GridView.builder(
              physics: NeverScrollableScrollPhysics(),
              itemCount: 30,
              shrinkWrap: true,
              gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
                  crossAxisCount: 2,
                  childAspectRatio: 22 / 30,
                  mainAxisSpacing: 5,
                  crossAxisSpacing: 3),
              itemBuilder: (ctx, i) {
                return Container(
                  color: Colors.grey,
                  child: Center(
                    child: Text("Item $i"),
                  ),
                );
              },
            ),
          ],
        ),
      ),
    );
  }
}

0
投票

我不知道你的代码是如何工作的,但你可以将 Expanded() 小部件包装在 GridView() 而不是容器上:

 Expanded(
     child: GridView.builder(
        physics: NeverScrollableScrollPhysics(),
        itemCount: productsList.length,
        gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
            crossAxisCount: 2,
            childAspectRatio: 22 / 30,
            mainAxisSpacing: 5,
            crossAxisSpacing: 3),
           itemBuilder: (ctx, i) {
           return ChangeNotifierProvider.value(
            value: productsList[i],
            child: FeedsProduct(),
          );
        },
      ),
);

0
投票

mainAxisExtent
影响瓷砖高度。

我的代码:

  gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
            crossAxisCount: items,
            childAspectRatio: 22/30,
            crossAxisSpacing: 2,
            mainAxisSpacing: 5,
            mainAxisExtent: 176,
          )

来自 silver_grid.dart:

 /// The extent of each tile in the main axis. If provided it would define the
  /// logical pixels taken by each tile in the main-axis.
  ///
  /// If null, [childAspectRatio] is used instead.
  final double? mainAxisExtent;

0
投票

mainAxisExtent 属性怎么样? https://stackoverflow.com/a/69975452/9538518

© www.soinside.com 2019 - 2024. All rights reserved.