Использование FilterChip во Flutter с примерами кода

FilterChip — это компонент, используемый в среде Flutter для создания интерактивных чипов с функциями фильтра. Ниже я расскажу вам несколько методов работы с FilterChip во Flutter вместе с примерами кода:

Метод 1. Создание базового чипа фильтра

FilterChip(
  label: Text('Example Chip'),
  onSelected: (isSelected) {
    // Handle chip selection
  },
)

Метод 2. Настройка внешнего вида FilterChip

FilterChip(
  label: Text('Custom Chip'),
  avatar: Icon(Icons.tag),
  selected: true,
  selectedColor: Colors.blue,
  onSelected: (isSelected) {
    // Handle chip selection
  },
)

Метод 3: обработка выбора FilterChip с использованием управления состоянием (с помощью StatefulWidget)

class FilterChipExample extends StatefulWidget {
  @override
  _FilterChipExampleState createState() => _FilterChipExampleState();
}
class _FilterChipExampleState extends State<FilterChipExample> {
  bool isSelected = false;
  @override
  Widget build(BuildContext context) {
    return FilterChip(
      label: Text('Selectable Chip'),
      selected: isSelected,
      onSelected: (bool selected) {
        setState(() {
          isSelected = selected;
        });
      },
    );
  }
}

Метод 4. Работа со списком чипов-фильтров

List<String> filterOptions = ['Option 1', 'Option 2', 'Option 3'];
List<String> selectedFilters = [];
Wrap(
  children: filterOptions.map((option) {
    return FilterChip(
      label: Text(option),
      selected: selectedFilters.contains(option),
      onSelected: (isSelected) {
        setState(() {
          if (isSelected) {
            selectedFilters.add(option);
          } else {
            selectedFilters.remove(option);
          }
        });
      },
    );
  }).toList(),
)