Reproduction Steps:
- Create a
ChipsChoice.multiple widget with multiple choice items using C2Choice.listFrom.
- Define a
style function to dynamically set the style properties of each chip based on its selected state.
- Update the selected state of a chip by changing the value of the
value property.
- Observe that the
style properties specified in the style function do not update unless an avatarText function is provided.
Expected Behavior:
When changing the selected state of a chip, the style properties specified in the style function should update accordingly, regardless of whether an avatarText function is provided.
Actual Behavior:
The style properties specified in the style function do not update unless an avatarText function is provided. Without an avatarText function, the style of the chips remains unchanged, even though the selected state changes.
Impact:
This issue affects applications that use the ChipsChoice widget and rely on dynamically updating the style of chips based on their selected state. It can lead to inconsistencies in the UI and hinder the ability to provide a consistent user experience.
Workaround:
A workaround for this issue is to provide an empty avatarText function even if it's not needed for the specific use case. This forces the ChipsChoice widget to update the style properties specified in the style function.
Environment:
Flutter version: 3.16.9 • channel stable
chips_choice package version: 3.0.1
Platform: All
Code Snippet:
ChipsChoice.multiple(
value: selectedCashier,
alignment: WrapAlignment.start,
wrapCrossAlignment: WrapCrossAlignment.start,
wrapped: true,
padding:
const EdgeInsets.symmetric(horizontal: 20, vertical: 10),
choiceItems: C2Choice.listFrom<String, CashierSummary>(
source: data.data!,
value: (index, item) => item.name,
label: (index, item) => item.name,
style: (index, item) {
final selected = selectedCashier.contains(item.name);
return C2ChipStyle(
borderRadius: const BorderRadius.all(Radius.circular(15)),
borderColor: Theme.of(context).colorScheme.primary,
backgroundColor: selected
? Colors.White
: Colors.Brown,
foregroundColor: selected
? Colors.White
: Colors.Brown,
);
},
avatarText: (index, item) {
bool selected = selectedCashier.contains(item.name);
return Icon(
selected
? Icons.check_circle_outline
: Icons.circle_outlined,
color: !selected
? Colors.White
: Colors.Brown,
size: 20,
);
},
),
choiceStyle: C2ChipStyle(
borderRadius: const BorderRadius.all(Radius.circular(15)),
checkmarkColor: Theme.of(context).colorScheme.primary,
borderWidth: 2,
borderStyle: BorderStyle.solid,
backgroundOpacity: 1,
),
onChanged: (values) {
ref
.read(selectedCashiersProvider.notifier)
.update((state) => state = values);
},
);
Reproduction Steps:
ChipsChoice.multiplewidget with multiple choice items usingC2Choice.listFrom.stylefunction to dynamically set the style properties of each chip based on its selected state.valueproperty.styleproperties specified in the style function do not update unless anavatarTextfunction is provided.Expected Behavior:
When changing the selected state of a chip, the style properties specified in the
stylefunction should update accordingly, regardless of whether anavatarTextfunction is provided.Actual Behavior:
The style properties specified in the
stylefunction do not update unless anavatarTextfunction is provided. Without an avatarText function, the style of the chips remains unchanged, even though the selected state changes.Impact:
This issue affects applications that use the
ChipsChoicewidget and rely on dynamically updating thestyleof chips based on their selected state. It can lead to inconsistencies in the UI and hinder the ability to provide a consistent user experience.Workaround:
A workaround for this issue is to provide an empty avatarText function even if it's not needed for the specific use case. This forces the
ChipsChoicewidget to update the style properties specified in thestylefunction.Environment:
Flutter version: 3.16.9 • channel stable
chips_choice package version: 3.0.1
Platform: All
Code Snippet: