GridView构建器中的动态行高(Flutter)

vbopmzt1  于 2023-02-09  发布在  Flutter
关注(0)|答案(2)|浏览(236)

我尝试使用一个GridView.builder,它的动态高度取决于每行中最大的项目。Wrap不适合这个,因为它一次渲染所有项目。构建器只渲染可见的项目。我不会为每行手动计算childAspectRatio
有什么想法吗?

vxbzzdmp

vxbzzdmp1#

我已经创建了一个WrapBuilder,它有点像Wrap,但是使用了一个构建器,但警告是你需要事先知道项目的宽度,如果可以的话,你可以尝试使用这个类:

import 'dart:math';
import 'package:flutter/cupertino.dart';

typedef ValueWidgetBuilder<T> = Widget Function(T value);

class WrapBuilder extends StatelessWidget {
  final double itemWidth;
  final List items;
  final ValueWidgetBuilder itemBuilder;

  const WrapBuilder(
      {Key? key,
      required this.itemWidth,
      required this.items,
      required this.itemBuilder})
      : super(key: key);

  @override
  Widget build(BuildContext context) {
    return LayoutBuilder(builder: (context, constraints) {
      var itemsPerRow = max(1, constraints.maxWidth ~/ itemWidth);
      return ListView.builder(
            shrinkWrap: true,
            controller: ScrollController(),
            itemCount: (items.length / itemsPerRow).ceil(),
            itemBuilder: (BuildContext context, int index) {
              var rowItems = items.sublist(itemsPerRow * index,
                  min(itemsPerRow * (index + 1), items.length));
              return Row(children: [
                for (final item in rowItems)
                  SizedBox(
                      width: itemWidth,
                      child: itemBuilder(item))
              ]);
            },
          );
    });
  }
}

你可能需要根据你的用例调整它。在我的例子中,我有一个包含一些数据的列表,itemBuilder将其中一个数据作为参数。

rmbxnbpk

rmbxnbpk2#

你可以在列表中传递高度作为变量,然后从列表中设置行的高度

相关问题