avi*_*orp 12 flutter flutter-layout
我想将两个图标并排放置在ListTile的“尾随”侧。我尝试添加带有两个图标的Row小部件,但是它完全弄乱了整个ListTile的布局,使其无法使用。有什么方法可以扩展为尾部分配的空间吗?
这是代码:
import 'package:flutter/material.dart';
void main() => runApp(new MyApp());
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Welcome to Flutter',
home: Scaffold(
appBar: AppBar(
title: Text('Welcome to Flutter'),
),
body: ListView(
children: <Widget>[
ListTile(
leading: Icon(Icons.play_arrow,),
title: Text("This is a title"),
subtitle: Text("This is subtitle"),
trailing: Row(
children: <Widget>[
Icon(Icons.flight),
Icon(Icons.flight_land)
]),
)
]
),
),
);
}
}
Run Code Online (Sandbox Code Playgroud)
它是这样的:

Cop*_*oad 59
你可以简单地使用Wrap在trailing
ListTile(
title: Text("This is my ListTile"),
trailing: Wrap(
spacing: 12, // space between two icons
children: <Widget>[
Icon(Icons.call), // icon-1
Icon(Icons.message), // icon-2
],
),
)
Run Code Online (Sandbox Code Playgroud)
avi*_*orp 34
添加mainAxisSize: MainAxisSize.min到Row()实例可解决此问题。

Tip*_*sor 10
试试这个代码。我认为这是正确的:
trailing: FittedBox(
fit: BoxFit.fill,
child: Row(
children: <Widget>[
Icon(Icons.flight),
Icon(Icons.flight_land),
],
),
),
Run Code Online (Sandbox Code Playgroud)
| 归档时间: |
|
| 查看次数: |
4235 次 |
| 最近记录: |