Question

在这段代码中，我试图在页面的顶部列出按钮或图块的列表，“因为按钮对我而言不合适”。因此，当单击一个时，它将在页面的其余部分返回一个值。

问题是：此处的图块在页面的一半以上扭曲，使其看上去不一致。我想限制瓷砖的高度，我尝试将它们放在一个行和一个容器中，但它不起作用。任何帮助将不胜感激。

运行代码后的结果是：

这是运行代码后的错误：

temp2

Answer 1

将此itemExtent添加到您的ListView属性中，itemExtent定义每个孩子的大小。像这样⬇️

 ListView.builder(
  scrollDirection: Axis.vertical,
  shrinkWrap: true,
  itemCount: 5,
  itemExtent: 50,
  itemBuilder: (context, index) { 
    return TistTile()
  }
 )

然后在您的dense:true属性中实现这一个ListTile，dense参数使文本变小并将所有内容打包在一起。像这样⬇️

  ListTile(
   title: Text("Tony Stark"),
   subtitle: Text("list[index].name",
        style: TextStyle(fontSize: 14.0),),
   contentPadding: EdgeInsets.symmetric(vertical: 0.0, horizontal: 
        16.0),
   dense:true,
   );

您可以通过设置contentPadding来更改左侧和右侧（而不是顶部或底部）插入的内容量。默认值为16.0，但此处我们将设置为0.0：

Answer 2

只需移除Expanded小部件，以避免填充可用空间并使用具有固定高度（与itemExtent值相同）的父容器：

    Column(
                  children: <Widget>[
                    Container(
                      height: 100.0,
                      child: ListView.builder(
                          scrollDirection: Axis.horizontal,
                          itemExtent: 100.0,
                          itemCount: temp.length,
                          itemBuilder: (BuildContext context, int index) {
                            return ListTile(
                                title: Text(temp[index]),
                                onTap: () {
                                  print(temp[index]);
                                });
                          }),
                    ),
                    Container(
                      child: Text('data'),
                    )
                  ],
                ),

Answer 3

如果需要更多自定义，则应使用容器或填充而不是ListTile。

您不能设置高度，但是可以通过将 dense 属性设置为true来减小高度：

ListView.builder(
          scrollDirection: Axis.vertical,
          shrinkWrap: true,
          itemCount: list.length,
          itemBuilder: (context, index) {
            return ListTile(
              title: Text(list[index].name,style: TextStyle(fontSize: 20.0),),
              contentPadding: EdgeInsets.symmetric(vertical: 0.0, horizontal: 16.0),
              dense:true,                  
            );
          },
        );

ListTile：

一个固定高度的行，通常包含一些文本以及前导或尾随图标。

要访问，必须将可点击的前导和尾随小部件放在尺寸至少为48x48。但是，为了遵守材料规范，单行ListTiles中的领先小部件在视觉上最多应高度为32（密集：正确）或40（密集：错误），可能会发生冲突并具有可访问性要求。

因此，单行ListTile允许前导和尾随小部件受ListTile的高度限制。这个允许创建可点击的前导和尾随窗口小部件足够大，但要由开发人员来确保小部件遵循材料规范。

https://api.flutter.dev/flutter/material/ListTile-class.html

Answer 4

由于 ListTile 中没有 height 属性，您可以通过将其放置在 SizedBox 中来限制图块的大小：

          SizedBox(
              height: 32,
              child: ListTile(..))

颤动：指定列表标题高度

4 个答案: