如何在Flutter中创建轮廓过滤芯片

Question

我正在尝试在 Flutter 中创建一个轮廓过滤器芯片。

我可以使用以下代码创建标准滤波器芯片，但我看不到访问图中所示概述版本的方法。

有没有办法修改标准芯片给出大纲版？

FilterChip(
   label: Text("text"), 
   onSelected: (bool value) {print("selected");},
),

Answer 1

我现在可以使用了。这是代码：

FilterChip(
    label: Text("text"), 
    backgroundColor: Colors.transparent,
    shape: StadiumBorder(side: BorderSide()),
    onSelected: (bool value) {print("selected");},
),

This post 也帮助我发现了 StadiumBorder。

Answer 2

你可以通过这种方式实现

  Chip(
      shape: RoundedRectangleBorder(
        side: BorderSide(color: colorThird, width: 1),
        borderRadius: BorderRadius.circular(10),
      ),
      backgroundColor: colorSecondary,
      deleteIcon: Icon(
        Icons.close,
        color: Colors.white,
        size: 15,
      ),
      label: Text(searchController.recentSearchesList[index], style: TextStyle(color: Colors.white),),
      deleteButtonTooltipMessage: 'erase',
      onDeleted: () {
        print(index);
      },

    );

如何在Flutter中创建轮廓过滤芯片

How to create an outlined filter chip in Flutter

dart

flutter

chips