I want to remove grey separator when tile is expanded, Used theme divider color but the divider is taking outside color not the line between tile and expansion.
I used to two different ways to remove it but none is working
return Theme(
data: Theme.of(context)
.copyWith(dividerColor: Colors.yellow,),
child: Column(
children: [
ExpansionTile(
shape: Border.all(color: Colors.yellow),
// shape: Border(),
backgroundColor: CoreColor.neutral0,
collapsedBackgroundColor: CoreColor.neutral0,
tilePadding: const EdgeInsets.only(
left: 16, right: 16, bottom: 8),
title: Text(
faq.question!,
style: CoreTextStyle.mRegular
.copyWith(color: CoreColor.neutral900),
),
trailing: state.faq![index].isExpanded
? Assets.coreSvgs.downwardArrow.svg()
: Assets.coreSvgs.forwardArrow.svg(),
onExpansionChanged: (value) {
setState(() {
state.faq![index].isExpanded = value;
});
},
children: [
Padding(
padding: const EdgeInsets.only(
left: 16, right: 16, bottom: 8),
child: Text(
faq.answer!,
style: CoreTextStyle.mRegular
.copyWith(color: CoreColor.neutral600),
),
),
],
),
const Divider(
color: CoreColor.dangerMain,
height: 0,
),
],
),
);
return ExpansionTile(
backgroundColor: CoreColor.neutral0,
collapsedBackgroundColor: CoreColor.neutral0,
tilePadding: const EdgeInsets.symmetric(
vertical: 8,
horizontal: 16,
),
shape: Border.all(color: Colors.red),
onExpansionChanged: (value) {
setState(() {
state.faq![index].isExpanded = value;
});
},
trailing: state.faq![index].isExpanded
? Assets.coreSvgs.downwardArrow.svg()
: Assets.coreSvgs.forwardArrow.svg(),
title: Text(
faq.question!,
style: CoreTextStyle.mRegular
.copyWith(color: CoreColor.neutral900),
),
children: [
Padding(
padding: const EdgeInsets.symmetric(
horizontal: 16,
vertical: 8,
),
child: Text(
faq.answer!,
style: CoreTextStyle.mRegular
.copyWith(color: CoreColor.neutral600),
),
),
],
);
I want to remove grey divider between tile and expansion
Remove Some Dividers from your code like below:
Theme(
data: Theme.of(context).copyWith(
dividerColor: Colors.transparent,
),
child: Column(
children: [
ExpansionTile(
tilePadding:
const EdgeInsets.only(left: 16, right: 16, bottom: 8),
title: Text(
'faq.question!',
),
onExpansionChanged: (value) {},
children: [
Padding(
padding:
const EdgeInsets.only(left: 16, right: 16, bottom: 8),
child: Text(
' faq.answer!',
),
),
],
),
ExpansionTile(
tilePadding: const EdgeInsets.symmetric(
vertical: 8,
horizontal: 16,
),
onExpansionChanged: (value) {},
title: Text(
' faq.question!',
),
children: [
Padding(
padding: const EdgeInsets.symmetric(
horizontal: 16,
vertical: 8,
),
child: Text(
'faq.answer!',
),
),
],
),
],
),
),