gpt4 book ai didi

flutter - 如何在 Flutter 中将圆角边框应用于扩展的 ExpansionTile?

转载 作者:行者123 更新时间:2023-12-04 00:52:41 24 4
gpt4 key购买 nike

我想要做的是将圆角边缘应用到整个瓷砖,即使是在 child 内部的容器打开时,就像它折叠时一样。
我尝试使用 BoxDecoration 通过其容器应用样式,但它给了我错误。我不知道如何继续,因为与 ListTile 不同的 ExpansionTile 没有形状的属性。
Collapsed tile with rounded bordes
Expanded tile with right angles borders

class DocumentTile extends StatelessWidget {
final Document document;

const DocumentTile({Key key, this.document}) : super(key: key);
@override
Widget build(BuildContext context) {
return Card(
margin: const EdgeInsets.only(top: 12, right: 30),
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(8.0),
),
color: AppColors.lbBlue.materialColor,
child: Container(
width: MediaQuery.of(context).size.width * 0.83,
child: ExpansionTile(
tilePadding: const EdgeInsets.only(left: 40.0, right: 30.0),
backgroundColor: AppColors.nsIconGrey.materialColor,
trailing: Container(
width: MediaQuery.of(context).size.width * 0.49,
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Row(
children: [
Container(
width: 0.5,
height: 50,
color: Colors.white,
margin: const EdgeInsets.only(right: 16.0),
),
Text(
'${DateTime.fromMicrosecondsSinceEpoch(document.creationDate * 1000)}',
style: tileDate),
],
),
Row(
children: [
Container(
margin: const EdgeInsets.only(right: 6),
height: 35,
width: 35,
decoration: BoxDecoration(
color: AppColors.tagIcon.materialColor,
borderRadius: BorderRadius.circular(4),
),
child: Center(
child: Text(
'${document.tags[0].acronym}',
style: documentTag,
),
)),
Container(
height: 35,
width: 35,
decoration: BoxDecoration(
color: AppColors.addTagIcon.materialColor,
borderRadius: BorderRadius.circular(4),
),
child: IconButton(
icon: Icon(Icons.add, color: Colors.white),
iconSize: 25,
padding: const EdgeInsets.all(5.5),
onPressed: () {},
)),
],
),
Row(
children: [
Container(
margin: const EdgeInsets.only(right: 6),
height: 35,
width: 35,
decoration: BoxDecoration(
color: AppColors.sPdIcon.materialColor,
borderRadius: BorderRadius.circular(4),
),
child: IconButton(
icon: Icon(Icons.more_vert, color: Colors.white),
iconSize: 25,
padding: const EdgeInsets.all(5.5),
onPressed: () {},
)),
Container(
margin: const EdgeInsets.only(right: 6),
height: 35,
width: 35,
decoration: BoxDecoration(
color: AppColors.sPdIcon.materialColor,
borderRadius: BorderRadius.circular(4),
),
child: IconButton(
icon: Icon(Icons.share_outlined, color: Colors.white),
iconSize: 20,
padding: const EdgeInsets.all(5.5),
onPressed: () {},
)),
Container(
height: 35,
width: 35,
decoration: BoxDecoration(
color: AppColors.sPdIcon.materialColor,
borderRadius: BorderRadius.circular(4),
),
child: IconButton(
icon: Icon(Icons.arrow_forward, color: Colors.white),
iconSize: 25,
padding: const EdgeInsets.all(5.5),
onPressed: () {
Navigator.pushNamed(context, '/documentDetail',
arguments: document.id);
},
)),
],
),
],
),
),
subtitle: Text(
'${document.abstract0}',
style: tileDescription,
overflow: TextOverflow.ellipsis,
maxLines: 1,
),
title: Text(
'${document.title}',
style: tileTitle,
overflow: TextOverflow.ellipsis,
maxLines: 1,
),
children: [
Container(
width: double.maxFinite,
padding: const EdgeInsets.only(
left: 40.0, right: 30.0, top: 20, bottom: 20),
color: Color(0xFF2A3141),
child: Text(
'${document.content}',
style: TextStyle(
color: AppColors.darkerText2.materialColor,
fontSize: 10,
fontWeight: FontWeight.w300),
maxLines: 3,
overflow: TextOverflow.ellipsis,
),
)
],
),
),
);
}
}

最佳答案

只需用 ClipRRect 包裹它小部件,它允许您为任何小部件设置边框半径。

关于flutter - 如何在 Flutter 中将圆角边框应用于扩展的 ExpansionTile?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/65331151/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com