Flutter FilterChip Avatar Selected Style

user_2204722 0
Viewed 2522

I'm using FilterChip with a CircleAvatar for avatar, but the selected state has a nasty rectangle that I can't seem to find any reference for. How do I remove it?

Code:

child: FilterChip(
        avatar: CircleAvatar(
          backgroundColor: category.color
        ),
        label: Text(category.name),
        selected: badCategoryIds.contains(category.id),
        onSelected: (bool value) {
          if (value) {
            badCategoryIds.add(category.id);
          }
          else {
            badCategoryIds.remove(category.id);
          }
          categoryChoiceCallback(badCategoryIds);
        },
      )

Result:

enter image description here

How I want it to appear (taken from material.io documentation):

enter image description here

FilterChip documentation.

material-design material-ui flutter
1 Answers

You can try to adapt this solution for a Circle Image for your Chip Circle as well

new Container(
  width: 190.0,
  height: 190.0,
  decoration: new BoxDecoration(
      shape: BoxShape.circle,
      image: new DecorationImage(
      fit: BoxFit.fill,
      image: new NetworkImage(
             "https://i.imgur.com/BoN9kdC.png")
             )
)),

from this Medium Post https://medium.com/@boldijar.paul/circle-image-view-in-flutter-965963c46cf5

user_68000060
Related