如何在 Flutter 中创建轮廓滤波器芯片答案

【问题标题】：How to create an outlined filter chip in Flutter如何在 Flutter 中创建轮廓滤波器芯片
【发布时间】：2019-04-23 23:53:18
【问题描述】：

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

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

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

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

【问题讨论】：

Background
还有ShapeBorder
@SnakeyHips 谢谢。欣赏它。
@AbSin 谢谢。欣赏它。

标签： flutter dart chips

【解决方案1】：

我现在可以正常工作了。代码如下：

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

This post 也帮助我发现了 StadiumBorder。

【讨论】：

我觉得不错的颜色BorderSide(color: Colors.black12)。

【解决方案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);
      },

    );

【讨论】：