Блог

Главная - Вопросы по программированию - Изменить цвет списка строк — Flutter

Изменить цвет списка строк — Flutter

#android #ios #flutter #dart #gesturedetector

#Android #iOS #flutter #dart #gesturedetector

Вопрос:

У меня есть список строк, и я хочу изменить цвет при нажатии на одну из них, вот мой код на данный момент :

   var list = ["name", "city", "country", "email"];


appBar: AppBar(
    title:Row(
          mainAxisAlignment: MainAxisAlignment.end,
          children: List.generate(4, (index) {
            return GestureDetector(
              child: Container(
                margin: EdgeInsets.all(8),
                child: Text(
                  list[index],
                  style: TextStyle(color: Colors.red),
                ),
              ),
              onTap: () {},
            );
          }),
        ),
      
  ),

Комментарии:

1. Ваш вопрос совершенно неясен. Не могли бы вы, пожалуйста, сказать, используете ли вы виджет с отслеживанием состояния или виджет без состояния?

2. виджет с отслеживанием состояния

Ответ №1:

Учитывая, что это виджет с отслеживанием состояния, вы можете сделать это следующим образом:

 var list = ["name", "city", "country", "email"];
List <int>tapped = [];

appBar: AppBar(
    title:Row(
          mainAxisAlignment: MainAxisAlignment.end,
          children: List.generate(4, (index) {
            return GestureDetector(
              child: Container(
                margin: EdgeInsets.all(8),
                child: Text(
                  list[index],
                  style: TextStyle(color: tapped.contains(index) ? Colors.red : Colors.black),
                ),
              ),
              onTap: () {
                if(tapped.contains(index)){
                  this.setState(() {tapped.remove(index);});
                } else {
                  this.setState(() {tapped.add(index);});
                }
              },
            );
          }),
        ),
      
  ),

Комментарии:

1. Это то, что я сделал, и это работает для меня, добавьте переменную int SelectedIndex; затем int TextStyle(цвет : SelectedIndex == индекс ? Цвета.красный : Colors.blue и setState ((){ SelectedIndex = index; })

2. Да. Я думал, что цвета выбранных текстов должны оставаться выбранными до тех пор, пока они не будут отменены. Но если вы хотите, чтобы они автоматически отменялись, если выбран другой цвет, тогда все в порядке! Это просто вопрос того, чего вы хотите. Поскольку это не было упомянуто в вопросе, я сделал то, что, по-видимому, вы хотели.