Advertisements
I am using Icons.verified in flutter and I can change the background color fine, but cannot change the inner tick color.
Any way to do that ?
const verifiedBadge = Icon(
Icons.verified,
color: Color(0xFF27aae1),
size: 28,
);
I looked into the available properties but do not see any secondary, highlightColor or something that might get the job done.
If I can’t do this with the Icons any other way to achieve it ?
PS: I tried a stack in which i used the component above and a tick trying to cover the tick and use new color but looked ugly
>Solution :
There aren’t any direct option to resolve this.
You may try putting it in a stack and place a coloured container below the icon instead putting it on the top
Stack(
children: [
Positioned.fill(
child: Align(
alignment: Alignment.center,
child: Container(
width: 20,
decoration: const BoxDecoration(
color: Colors.yellow,
shape: BoxShape.circle,
),
),
),
),
Icon(
Icons.verified,
color: Color(0xFF27aae1),
size: 38,
),
],
),