Блог

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

Как изменить цвет текста при развевании карточки

#flutter #colors #card

#flutter #Цвет #карточка

Вопрос:

Я начинаю с Flutter я пытаюсь улучшить приложение Todo, и мне нужно изменить цвет текста в моей дочерней карточке, чтобы его можно было прочитать. Не нашел никаких решений, которые мне удалось внедрить в свой код. Вот часть, в которой реализованы карточки с текстом.

  Widget _buildTodoList() {
return new ListView.builder(
  itemBuilder: (context, index) {
    if (index < _todoItems.length) {
      //return  _buildTodoItem(_todoItems[index], index);
      final item = _todoItems[index];
      return Dismissible(
          key: Key(item),
          onDismissed: (direction) {
            setState(() {
              _todoItems.removeAt(index);
            });
            Scaffold.of(context).showSnackBar(
                SnackBar(content: Text("$item  a été supprimé")));
          },
          background: Container(color: Colors.red),
          child: Container(
              margin: const EdgeInsets.all(7.0),
              child: Card(
                  child: ListTile(title: Text("$item")),
                  color: Colors.blueGrey[900],
                  shape: RoundedRectangleBorder(
                    borderRadius: BorderRadius.circular(10.0),
                  ))));
    }
  },
);

}
Я хотел бы сделать текст элемента белым. Заранее благодарю вас!

Ответ №1:

Вы можете установить цвет текста, указав свойство color для style в текстовом виджете. Пожалуйста, ознакомьтесь с кодом

 Card(
                  child: ListTile(title: Text("$item", style:TextStyle(color: Colors.white)),
                  color: Colors.blueGrey[900],
                  shape: RoundedRectangleBorder(
                    borderRadius: BorderRadius.circular(10.0),
                  ))));

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

1. большое вам спасибо @bluenile, но я не знаю, куда его поместить

2. Пожалуйста, замените код вашей карточки кодом, обновленным мной.

3. Пожалуйста, примите любой ответ, который помог вам и решил вашу проблему. Спасибо.

Ответ №2:

вам просто нужно добавить стиль в текстовый виджет вот так:

 
Widget _buildTodoList() {
return new ListView.builder(
 itemBuilder: (context, index) {
   if (index < _todoItems.length) {
     //return  _buildTodoItem(_todoItems[index], index);
     final item = _todoItems[index];
     return Dismissible(
         key: Key(item),
         onDismissed: (direction) {
           setState(() {
             _todoItems.removeAt(index);
           });
           Scaffold.of(context).showSnackBar(
               SnackBar(content: Text("$item  a été supprimé")));
         },
         background: Container(color: Colors.red),
         child: Container(
             margin: const EdgeInsets.all(7.0),
             child: Card(
                 child: ListTile(title: Text("$item", style:TextStyle(color: Colors.red))),
                 color: Colors.blueGrey[900],
                 shape: RoundedRectangleBorder(
                   borderRadius: BorderRadius.circular(10.0),
                 ))));
   }
 },
);