Flutter ListTile前导图像和标题对齐

Question

在标准ListTile中，是否可以将前导图像和标题对齐在顶部，并对齐？

 child: ListTile(
    leading: FlutterLogo(size: 72.0),
    title: Text('Three-line ListTile'),
    subtitle: Text(
      'A sufficiently long subtitle warrants three lines.'
    ),
    trailing: Icon(Icons.more_vert),
    isThreeLine: true,
  ),

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

Answer 1

[我认为您应该考虑使用Row的小部件，如documentation的ListTile中所述，例如，应使用Row实现复杂的UI。您需要的是Row，其属性为crossAxisAlignment: CrossAxisAlignment.start

Row(
    crossAxisAlignment: CrossAxisAlignment.start,
    children: <Widget>[
      CircleAvatar(
        radius: 20,
        backgroundImage: AssetImage('assets/avatar1.jpg'),
      ),
      Expanded(
        child: Container(
          padding: EdgeInsets.only(left: 5),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: <Widget>[
              RichText(
                text: TextSpan(
                  style: DefaultTextStyle.of(context).style,
                  children: [
                    TextSpan(
                      text: 'hello :  ',
                      style: TextStyle(fontWeight: FontWeight.bold),
                    ),
                    TextSpan(
                      text:
                          'the comment comment the comment comment the comment comment comment comment the comment comment the comment comment',
                    ),
                  ],
                ),
              ),
            ],
          ),
        ),
      ),
    ],
  ),