选择后如何在芯片上显示轮廓？

Question

我正在使用“芯片设计”单选按钮，其设计类似于附件中的图像。 当我选择一个时，要突出轮廓并更改背景颜色。

可以用芯片吗？

enter image description here

ChoiceChip(
              labelPadding: EdgeInsets.symmetric(vertical: 4),
              padding: EdgeInsets.only(left: 12, right: 12),
              label: Text(item),
              backgroundColor: Colors.transparent,
              shape: OutlineInputBorder(
                  borderRadius: BorderRadius.circular(8.0)),
              selected: sortPlaceChecked == item,
              onSelected: (selected) {
                setState(() {
                  sortPlaceChecked = item;
                  _inputPlace = false;
                });
              },
            )

Answer 1

您可以简单地使用sortPlaceChecked ==项目条件来应用某种样式；例如，您希望选定芯片的背景为红色，可以按照以下步骤操作，对边框使用相同的原理。

ChoiceChip(
    ...
    backgroundColor: sortPlaceChecked == item ? Colors.red : Colors.transparent,
)