Home > Enterprise >  value of the title and description repeats every time a new todo is made
value of the title and description repeats every time a new todo is made

Time:11-02

I just started learning flutter and am trying to create a todo app, but every time a new todo is made the value of the title and the description remains the same for all the todos, I have tried every method but no difference pls tell me what's wrong with the code and how do I save the value of the title and description for each todo? My code:

class _HomePageState extends State<HomePage> {
  TextEditingController _titleController = TextEditingController();
  TextEditingController _detailController = TextEditingController();
  List todos = [];

  @override
  void initState() {
    super.initState();
    todos.add('');
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: SafeArea(
        child: Container(
          width: double.infinity,
          padding: const EdgeInsets.symmetric(
            horizontal: 24.0,
          ),
          color: const Color(0xfff6f6f6f6),
          child: Stack(
            children: [
              Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Container(
                    margin: const EdgeInsets.only(bottom: 32.0, top: 32.0),
                    child: const Text(
                      "Reminders",
                      style: TextStyle(
                        fontSize: 25.0,
                        fontWeight: FontWeight.bold
                      ),
                    ),
                  ),
                  Expanded(
                    child: ListView.builder(
                      itemCount: todos.length,
                      physics: const BouncingScrollPhysics(),
                      itemBuilder: (BuildContext context, int index) {
                        return Dismissible(
                          key: Key(todos[index]),
                          child: Container(
                            width: double.infinity,
                            padding: const EdgeInsets.symmetric(
                                vertical: 20.0,
                                horizontal: 24.0
                            ),
                            margin: const EdgeInsets.only(
                              bottom: 20.0,
                            ),
                            child: Column(
                              crossAxisAlignment: CrossAxisAlignment.start,
                              children: [
                                TextField(
                                  cursorColor: Colors.black,
                                  autofocus: true,
                                  controller: _titleController,
                                  style: const TextStyle(
                                      fontSize: 22.0,
                                      fontWeight: FontWeight.bold
                                  ),
                                  decoration: const InputDecoration(
                                    hintText: "Enter a title",
                                    border: InputBorder.none,
                                  ),
                                ),
                                const Divider(
                                  color: Colors.black,
                                ),
                                Padding(
                                  padding: const EdgeInsets.only(top: 0.0),
                                  child: TextField(
                                    controller: _detailController,
                                    style: TextStyle(
                                      fontSize: 20.0,
                                      color: Colors.grey[900],
                                    ),
                                    cursorColor: Colors.black,
                                    maxLines: null,
                                    decoration: const InputDecoration(
                                        hintText: "Enter the description",
                                        label: Text("description"),
                                        border: InputBorder.none
                                    ),
                                  ),
                                ),
                              ],
                            ),
                            decoration: BoxDecoration(
                                color: Colors.white,
                                borderRadius: BorderRadius.circular(20.0)
                            ),
                          ),
                        );
                      },
                    ),
                  )
                ],
              ),
              Positioned(
                bottom: 24.0,
                right: 0.0,
                child: GestureDetector(
                  onTap: () {
                    setState(() {
                      todos.add('');
                    });
                  },
                  child: Container(
                  width: 60.0,
                  height: 60.0,
                  decoration: BoxDecoration(
                    color: Colors.black87,
                    borderRadius: BorderRadius.circular(20.0),
                  ),
                  child: const Icon(Icons.add, color: Colors.white, size: 35.0),
              ),
                ),
              )
            ],
          ),
        ),
      ),
    );
  }
}

CodePudding user response:

Hello and welcome to the world of flutter,

like you do for title and detail, every textfield needs it's own TextEditingController. So you could add a list of controllers for title and description.

List<TextEditingController> _titleController = [];
List<TextEditingController> _detailController = [];

and add an entry to both, when you add todo.

todo.add('')
_titleController.add(TextEditingController())
_detailController.add(TextEditingController())

At the TextFields you should reference by index:

 ...
 child: TextField(controller: _detailController[index],
 ...

This should help with your problem.

I would recommend you to look at some tutorials and try to rebuild them.

Have fun!

  • Related