【问题标题】:How to set the padding between leading and title from Flutter ListTile?如何在 Flutter ListTile 中设置前导和标题之间的填充?
【发布时间】:2019-12-24 03:06:15
【问题描述】:

我有一个折衷的解决方案,但我不满意。

final int padding=10; //the padding you wanna set.
ListTile(
    leading: Icon(icon),
    title:  Container(
                  height: 30,
                  child: Stack(
                    alignment: Alignment.centerLeft,
                    overflow: Overflow.visible,
                    children: <Widget>[
                      Positioned(
                        child: title,
                        left: padding-35,
                      ),
                    ],
                  ),
                ),
 );

是的。您可以使用负边距。这绝对有效。但它并不完美。所以有人能提供更好的解决方案吗?

========= 附加===========

我在下面看到了一些答案。但您似乎没有得到我的观点。

Flutter ListTile 中的前导和标题之间的默认填充对我来说太大了。我想自己调整填充。并且仅用 Padding 小部件包装标题无法达到目标。

========= 我找到了一个更好的解决方案 ===========

final int padding = 10; //the padding you wanna set.
ListTile(
  leading: Icon(icon),
  title: Container(
    transform: Matrix4.translationValues(padding - 35, 0.0, 0.0),
    child: title,
  ),
);

【问题讨论】:

  • 这是唯一对我有用的答案。谢谢!
  • @RayLi 感谢您的回复。这让我感觉很好。哈哈
  • 感谢您的回答!材料对硬编码值非常令人沮丧,比如到处都是地雷。

标签: flutter


【解决方案1】:

使用 Padding 小部件,例如:

                ListTile(
                  leading: Icon(Icons.location_on),
                  title: Padding(
                    // change left : 
                    padding: const EdgeInsets.only(left: 30),
                    child: Text('hello world'),
                  ),
                ),

【讨论】:

    【解决方案2】:

    您可以为此向标题小部件添加填充。

    将您的代码替换为:

    final double padding=10; //the padding you wanna set.
    ListTile(
        leading: Icon(icon),
        title: Padding(
                 padding: const EdgeInsets.all(padding),
                 child:Container(
                 height: 30,
                 child: Stack(
                   alignment: Alignment.centerLeft,
                   overflow: Overflow.visible,
                   children: <Widget>[
                     Positioned(
                       child: title,
                       left: padding-35,
                     ),
                   ],
                 ),
               ),
             ),
     );
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 2018-10-05
      • 1970-01-01
      • 1970-01-01
      • 2019-09-03
      • 2018-04-16
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多