[英]Hot to center text in ListTile in Card Flutter
I need to move the number to the center of the Card and put the play button at the bottom right of the Card.我需要将数字移动到卡片的中心并将播放按钮放在卡片的右下方。 I hope you can help me.
我希望你能帮助我。 Thank you
谢谢
@override
Widget build(BuildContext context) {
return Card(
color: const Color(0x665050f1),
child: ListTile(
title: Text(
widget.index.toString(),
textAlign: TextAlign.center,
style: const TextStyle(
fontSize: 40.0,
color: Colors.white,
fontWeight: FontWeight.w700,
),
),
trailing: IconButton(
icon: Icon(
Icons.play_arrow,
size: 50.0,
color: _playing
? Theme.of(context).colorScheme.primary
: Theme.of(context).colorScheme.onBackground.withOpacity(.5),
),
onPressed: _playing ? null : _play,
),
),
);
}
}
Use iconSize
instead of size
of Icon on IconButton
.在
IconButton
上使用iconSize
而不是 Icon 的size
。 I think it would be better to use Stack
in this case.我认为在这种情况下使用
Stack
会更好。
SizedBox(
height: 200,
width: 200,
child: Card(
color: const Color(0x665050f1),
child: Stack(
children: [
Align(
alignment: Alignment.center,
child: Text(
"1",
textAlign: TextAlign.center,
style: TextStyle(
fontSize: 40.0,
color: Colors.white,
fontWeight: FontWeight.w700,
),
),
),
Positioned(
right: 0, //changes to have some gap
top: 0,
child: IconButton(
alignment: Alignment.center,
iconSize: 50,
icon: Icon(Icons.play_arrow,
// size: 50.0,
color:
// _playing
// ?
Theme.of(context).colorScheme.primary
// : Theme.of(context).colorScheme.onBackground.withOpacity(.5),
),
onPressed: () {}
// _playing ? null : _play,
),
),
],
),
),
),
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.