Государственное управление в трепетании

Question

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

Я создал виджет для отображения в списке. Мой вопрос: как мне управлять пользовательским интерфейсом?

Код:

import 'package:flutter/material.dart';

class TodoList extends StatefulWidget {
  _TodoListState createState() => new _TodoListState();
}

class _TodoListState extends State<TodoList> {
  List _list = new List();

  Widget listTile({String data: '[Empty data]'}) {
    bool _writable = false;
    TextEditingController _textController = new TextEditingController(text: data);
    String _text = _textController.text;
    if(!_writable){
      return new Row(
        children: <Widget>[
          new Expanded(
              child: new Text(data)
          ),
          new IconButton(icon: new Icon(Icons.edit),
              onPressed: () {
//                  setState(() {
                    _writable = ! _writable;
                    print(_writable.toString());
//                    });
                  }),
          new IconButton(icon: new Icon(Icons.remove_circle), onPressed: null),
        ],
      );
    } else {
      return new Row(
        children: <Widget>[
          new Expanded(
              child: new TextField( controller: _textController )
          ),
          new IconButton(icon: new Icon(Icons.done), onPressed: null),
        ],
      );
    }


  }

  void addInList(String string) {
    print(string);
    setState(() {
      _list.add(string);
    });
    print(_list);
  }
  void removeFromList(int index){

  }
  static final TextEditingController _textController = new TextEditingController();
  String get _text => _textController.text;


  @override
  Widget build(BuildContext context) {
    Widget adderTile = new Row(
      children: <Widget>[
        new Expanded(
          child:
          new TextField(
            textAlign: TextAlign.center,
            controller: _textController ,
            decoration: new InputDecoration( hintText: 'New item.!' ),
          ),
        ),
        new IconButton(icon: new Icon(Icons.add), onPressed: (){addInList(_text);}),
      ],
    );

    return new MaterialApp(
      title: 'TodoList',
      home: new Scaffold(
        appBar: new AppBar(title: new Text('TodoList'),),
        body: new Column(
          children: <Widget>[
            adderTile,
            new ListView.builder(
                shrinkWrap: true,
                itemCount: _list.length,
                itemBuilder: (context, int index){
                  return listTile(data: _list[index]);
                }
            ),
          ],
        ),
      ),
    );
  }
}

если я изменяю _writable внутри setState, то он перерисовывает виджет и _writable снова становится ложным. если я делаю это без setState, то _writable становится истинным, но виджет не перерисовывается.

P.S .: я не хочу добавлять другой массив для управления, который доступен для записи, а какой нет. Заранее спасибо.

Answer 1

Переменная

bool _writable = false;

объявлен как локальная переменная в методе listTile(), но должен быть перемещен рядом с List _list = new List();, чтобы стать переменной-членом. Затем используйте setState(), чтобы установить его и перестроить представление.

Edit: Вы должны создать выделенный StatefulWidget (TodoListEntry), имеющий _writable в качестве члена, как предложено выше. Переместите почти все тело метода listTile(...) в build() -метод TodoListEntryState, сделайте параметр String data также членом и передайте значение через конструктор.