Flutter增加ListTile高度

Bis*_*ret 3 tile flutter

我想要一个列表图块,其中包含尺寸合适的主图像,然后是项目的描述和图标。

尽管在网上搜索答案,我发现无论主图像的高度是多少,我都无法增加列表图块的高度。

代码:

          ListTile(
            leading: ConstrainedBox(
              constraints: BoxConstraints(
                minWidth: 100,
                minHeight: 260,
                maxWidth: 104,
                maxHeight: 264,
              ),
              child: Image.asset('lib/images/burger_texas_angus.jpg', fit: BoxFit.fill),
            ),
            title: Text('Texas Angus Burger'),
            subtitle: Text('With fries and coke.'),
            trailing: Icon(
              Icons.menu,
            ),
            onTap: () {},
            onLongPress: () {},
            dense: false,
          ),
Run Code Online (Sandbox Code Playgroud)

希望它最终看起来像这样,他们有一个漂亮的大方形引导图标,它似乎决定了列表图块的高度,而我所做的一切都将图像塞进了一个狭窄的图块中。

期望的结果类型

Bis*_*ret 14

好吧,答案是这是不可能的。ListTile 是一个非常非常基本的内置小部件,它只能是特定的高度,并且您对此无能为力。

如果您想做任何视觉上很酷的事情,例如我在问题中显示的图片等,您必须创建一个自定义卡片。

我将展示基本卡片布局的生成代码,该代码将给出与我发布的图像类似的结果,以防有人需要一些帮助:

              Container(
                  width: MediaQuery.of(context).size.width * 0.94,
                  child: Card(
                    shape: RoundedRectangleBorder(
                      borderRadius: BorderRadius.circular(0.0),
                    ),
                    color: Colors.white70,
                    elevation: 10,
                    child: Row(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: <Widget>[
                        Padding(
                          padding: const EdgeInsets.all(2.0),
                          child: ConstrainedBox(
                            constraints: BoxConstraints(
                              maxWidth: MediaQuery.of(context).size.width * 0.28,
                              maxHeight: MediaQuery.of(context).size.width * 0.28,
                            ),
                            child: Image.asset(
                                'lib/images/burger_texas_angus.jpg',
                                fit: BoxFit.fill
                            ),
                          ),
                        ),
                        Column(
                          crossAxisAlignment: CrossAxisAlignment.start,
                          children: <Widget>[
                            Container(
                              width: MediaQuery.of(context).size.width * 0.5,
                              child: Padding(
                                padding: const EdgeInsets.fromLTRB(10, 10, 0, 0),
                                child: Text(
                                  'Texas Angus Burger',
                                  style: TextStyle(
                                    fontWeight: FontWeight.bold,
                                    fontSize: 18,
                                  ),
                                ),
                              ),
                            ),
                            Container(
                              width: MediaQuery.of(context).size.width * 0.5,
                              child: Padding(
                                padding: const EdgeInsets.fromLTRB(5, 10, 0, 0),
                                child: Text(
                                  '100% Australian Angus grain-fed beef with cheese and pickles.  Served with fries.',
                                  style: TextStyle(
                                    fontSize: 12,
                                  ),
                                ),
                              ),
                            ),
                          ],
                        ),
                        Column(
                          children: <Widget>[
                            Padding(
                              padding: const EdgeInsets.fromLTRB(5, 40, 0, 0),
                              child: Text(
                                '\$ 24.00',
                                style: TextStyle(
                                  fontSize: 14,
                                ),
                              ),
                            ),
                          ],
                        ),
                      ],
                    ),
                  ),
                ),
              ],
            ),
          ),
Run Code Online (Sandbox Code Playgroud)