Как сделать так, чтобы все фильтры не меняли цвет при нажатии на флаттер - PullRequest
Новая
       3

Как сделать так, чтобы все фильтры не меняли цвет при нажатии на флаттер

0 голосов
/ 22 января 2020

Я пытаюсь создать шаблон для фильтра, который принимает один параметр (имя тега) и выделяется при нажатии. Но проблема заключается в том, что при нажатии одного фильтра все они меняют цвет, потому что все они используют одно и то же логическое значение. Извините, я новичок, и я думаю, что я иду по этому пути неправильно 

  class _HomeState extends State<Home> {
  bool filterTap = true;
  GestureDetector filterTemplate(String tag) {
    return GestureDetector(
        onTap: () {
        setState(() {
          filterTap = !filterTap;
        });
      },
      child: Center(
        child: Container(
          margin: const EdgeInsets.only(right: 20.0),
          padding: const EdgeInsets.symmetric(vertical: 5.0, horizontal: 10.0),
          decoration: BoxDecoration(
            border: Border.all(color: Colors.grey),
            borderRadius: BorderRadius.all(Radius.circular(4.0)),
            color: filterTap ? Colors.grey : Colors.transparent,
          ),
          child: Text(
            tag,
            style: TextStyle(
              color: filterTap ? Colors.grey[900] : Colors.grey,
              letterSpacing: 2.0,
            ),
          ),
        ),
      ),
    );
  }

Ответы [ 2 ]

0 голосов
/ 22 января 2020

Используйте List или Map или List<YourClass> для поддержания статуса каждой кнопки.

И попробуйте ChoiceChip, 

import 'package:flutter/material.dart';

void main() {
  runApp(MaterialApp(home: Home()));
}

class Home extends StatefulWidget {
  @override
  _HomeState createState() => _HomeState();
}

class _HomeState extends State<Home> {
  Map<String, bool> tagsList = {
    "Tag1": false,
    "Tag2": false,
    "Tag3": false,
    "Tag4": false,
  };

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: SafeArea(
        child: Row(
          children: tagsList.entries.map((entry) {
            return Padding(
              padding: const EdgeInsets.all(8.0),
              child: ChoiceChip(
                label: Text(entry.key),
                selected: entry.value,
                onSelected: (value) {
                  setState(() {
                    tagsList[entry.key] = value;
                  });
                },
              ),
            );
          }).toList(),
        ),
      ),
    );
  }
}
0 голосов
/ 22 января 2020

Прежде всего определите класс StructFilter с его свойствами. Например, здесь есть опция: 

class StructFilter  {
  StructFilter(this.tag,this.filterTap);

  String tag;

  bool filterTap;
}

Затем соберите всю информацию о вашем фильтре в список StructFilter (т.е. List<StructFilter> filterList).

Например, вы можете попробовать: 

Listview(
  children: filterList.map((item){
      return filterTemplate(item);
  }).toList();
)

  GestureDetector filterTemplate(StructFilter structFilter) {
    return GestureDetector(
        onTap: () {
        setState(() {
          structFilter.filterTap = !structFilter.filterTap;
        });
       },
      ),
    );
  }
...