我有一个 ListView
在 flutter 中,与 ListTile
作为项目在里面。前导小部件是圆形头像,标题是短文本,副标题是长文本。我希望字幕的文本在圆形头像下方的区域中展开,换句话说,我不想将圆形头像下方的阅读内容设为空白。检查下面的图片:
这是我的 ListTile 代码:
class _MessagesListTile extends StatefulWidget {
_MessagesListTile({
Key key,
this.index,
}) : super(key: key);
final int index;
bool isTapped = false;
@override
__MessagesListTileState createState() => __MessagesListTileState();
}
class __MessagesListTileState extends State<_MessagesListTile> {
@override
Widget build(BuildContext context) {
return ListTile(
leading: CircleAvatar(
child: Image(image: AssetImage("assets/ic_female.png")),
radius: 30.0,
),
title: Text(
"Sender ${widget.index}",
style: TextStyle(fontWeight: FontWeight.bold, fontSize: 16.0),
),
subtitle: Text(
"A very long message cropped to fit just this area and not overflow so"
" much to take more and more and more and more and more and more"
" and more and more and more and more and more and more and more "
"and more and more and more and more and more and more and more space ",
overflow: widget.isTapped ? TextOverflow.visible : TextOverflow.ellipsis,
),
trailing: Icon(
widget. isTapped ? Icons.keyboard_arrow_down : Icons.keyboard_arrow_right),
isThreeLine: widget.isTapped,
onTap: () {
setState(() {
widget.isTapped = !widget.isTapped;
});
},
);
}
}
关于如何实现这一目标的任何提示?我对所有解决方案持开放态度,只要该解决方案在关闭和打开时保持项目的相同布局。
最佳答案
我不确定这是否正是您要查找的内容,或者它是否对您有帮助,但是我找到了一个包,在 ListTile 中实现它需要一些工作,但这是以后的问题,这里是它的样子:
这是 pub.dev 上软件包的链接:
drop_cap_text 1.0.7
关于Flutter:使字幕文本扩展到前导widget下的空白区域,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/63748420/