Menu
Is it possible to alter the expansion tile in flutter? Specifically I want to remove the dividers it creates when it expands. Also I want to adjust its padding. Is that possible? Thanks!
521
To change the ExpansionTile color, you can wrap it with a Container and give it a color. This will change the entire color of the ExpansionTile, both collapsed and expanded. But if you want a different color for the children, you can also wrap them with a Container and set another color there.
the only way to do it is by editing the ExpansionPanel source code. I added a new property called hasIcon and set it by default to true (to make sure it will not break the code).
From the source of ExpansionTile
https://github.com/flutter/flutter/blob/d927c9331005f81157fa39dff7b5dab415ad330b/packages/flutter/lib/src/material/expansion_tile.dart#L176-L184
Widget build(BuildContext context) {
final ThemeData theme = Theme.of(context);
_borderColor.end = theme.dividerColor;
_headerColor
..begin = theme.textTheme.subhead.color
..end = theme.accentColor;
_iconColor
..begin = theme.unselectedWidgetColor
..end = theme.accentColor;
_backgroundColor.end = widget.backgroundColor;
you can derive what you can influence by wrapping the element in a Theme for example by modifying dividerColor
_borderColor.end = theme.dividerColor;
final theme = Theme.of(context).copyWith(dividerColor: Colors.yellow);
return Theme(data: theme, child: ExpansionTile(...));
similar with _headerColor, _iconColor, _backgroundColor.
If you need more customization, you can always copy the source and customize it to your liking.
103
For remove dividers simply warp with Theme widget and make divider color transparent.
final theme = Theme.of(context).copyWith(dividerColor: Colors.transparent);
return Theme(data: theme, child: ExpansionTile(...));
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
