Как отключить значок выбранного чипа в чипе Flutter Raw? - PullRequest
Новая
       8

Как отключить значок выбранного чипа в чипе Flutter Raw?

0 голосов
/ 15 января 2019

Я хотел создать TabBar с чипами в виде вкладок:

Код: 

class TabChip extends StatefulWidget{

  final String chipTitle;

  TabChip(this.chipTitle) : assert(chipTitle != null);

  @override
  State<StatefulWidget> createState() {
    return _TabChipState();
  }
}

class _TabChipState extends State<TabChip>{

  bool isSelected = false;

  @override
  Widget build(BuildContext context) {
    return RawChip(
      avatar: CircleAvatar(),
      label: Text(widget.chipTitle,
          style: TextStyle(
            color: isSelected ? Colors.white : Colors.red,
            fontWeight: FontWeight.bold
          ),),
      backgroundColor: isSelected ? Colors.red : Colors.white, // Switch colors if chip is selected
      shape: StadiumBorder(side: BorderSide(color: Colors.red, width: 2.0)),
      selectedColor: Colors.red,
      selected: isSelected,
      onPressed: (){
        setState(() {
          isSelected = isSelected ? false : true;
        });
      },
//      onSelected: (bool value){
//        setState(() {
//          isSelected = true;
//        });
//      },
    );
  }
}

Теперь я смог использовать виджет RawChip, чтобы создать базовую схему этого, но когда выбран чип, в аватаре отображается значок галочки.

Я хочу отключить аватар.

Я также хочу добавить функциональность, которая выбирается за одну вкладку за раз.

Как мне это сделать?

Ответы [ 2 ]

0 голосов
/ 15 января 2019

Я думаю, вы должны взглянуть на виджет ChoiceChip , он допускает только один выбранный вариант и не имеет отметки. 

class TabChips extends StatefulWidget {
  @override
  State<StatefulWidget> createState() => _TabChipsState();
}

class _TabChipsState extends State<TabChips> {
  int _selectedIndex = 0;

  @override
  Widget build(BuildContext context) {
    return Row(
      children: List.generate(3, (index) {
          return ChoiceChip(
            selected: _selectedIndex == index,
            label: Text("$index"),
            onSelected: (selected) {
              if (selected) {
                setState(() {
                  _selectedIndex = index;
                });
              }
            },
          );
        },
      ),
    );
  }
}
0 голосов
/ 15 января 2019

Для того, чтобы скрыть выбранный тик Mark.

В вашем коде необходимо добавить - showCheckmark: false в вашем - RawChip

    RawChip(
        showCheckmark: false,  // Add this Code
      //  avatar: CircleAvatar(),
        label: Text(widget.chipTitle,
          style: TextStyle(
              color: isSelected ? Colors.white : Colors.red,
              fontWeight: FontWeight.bold
          ),),
        backgroundColor: isSelected ? Colors.red : Colors.white, // Switch colors if chip is selected
        shape: StadiumBorder(side: BorderSide(color: Colors.red, width: 2.0)),
        selectedColor: Colors.red,
        selected: isSelected,
        onPressed: (){
          setState(() {
            isSelected = !isSelected;
          });
        },
//      onSelected: (bool value){
//        setState(() {
//          isSelected = true;
//        });
//      },
      ),
...