Can't solve problem with FloatingActionButton

Question

I want the dialog to open when a button is clicked, but an error occurs due to BLoC. Previously, there was such an error with the class itself, but I successfully solved it, and in this case, the complexity already arises. I've already tried a couple of options but couldn't solve it. I tried to make the event in onPressed as a separate widget, and the same error did not work either.

home_page

class HomePage extends StatelessWidget {
  final todoRepository = TodoRepository();

  @override
  Widget build(BuildContext context) {
    // final TodoBloc todoBloc = context.read<TodoBloc>();
    return BlocProvider<TodoBloc>(
        create: (context) => TodoBloc(todoRepository),
        child: Scaffold(
          appBar: AppBar(
            title: const Text('Flutter Todos'),
          ),
          // floatingActionButton: FloatingActionButton(
          //   onPressed: () {
          //     // _addTodo(context);
          //     final newTodo = Todo(description: 'Todo 1');
          //     BlocProvider.of<TodoBloc>(context).add(CreateTodos(newTodo));
          //   },
          //   child: const Icon(Icons.add),
          // ),
          body: SingleChildScrollView(
            child: Column(
              // crossAxisAlignment: CrossAxisAlignment.center,
              children: [
                // ActionButton(),
                TodoList(),
              ],
            ),
          ),
          floatingActionButton: FloatingActionButton(
            child: const Icon(Icons.add, size: 32, color: Colors.black),
            onPressed: () {
              // showAddTodoSheet(context);
              //           showAddTodoSheet(BuildContext context) {
              final TodoBloc todoBloc = context.read<TodoBloc>();
              final _todoDescriptionFromController = TextEditingController();
              showModalBottomSheet(
                  context: context,
                  builder: (builder) {
                    return BlocBuilder<TodoBloc, TodoState>(
                        builder: (context, state) {
                      return Padding(
                        padding: EdgeInsets.only(
                            bottom: MediaQuery.of(context).viewInsets.bottom),
                        child: Container(
                          color: Colors.transparent,
                          child: Container(
                            height: 230,
                            decoration: const BoxDecoration(
                                color: Colors.white,
                                borderRadius: BorderRadius.only(
                                    topLeft: Radius.circular(10.0),
                                    topRight: Radius.circular(10.0))),
                            child: Padding(
                              padding: const EdgeInsets.only(
                                  left: 15, top: 25.0, right: 15, bottom: 30),
                              child: ListView(
                                children: <Widget>[
                                  Row(
                                    mainAxisSize: MainAxisSize.min,
                                    crossAxisAlignment:
                                        CrossAxisAlignment.center,
                                    children: <Widget>[
                                      Expanded(
                                        child: TextFormField(
                                          controller:
                                              _todoDescriptionFromController,
                                          textInputAction:
                                              TextInputAction.newline,
                                          maxLines: 4,
                                          style: const TextStyle(
                                              fontSize: 21,
                                              fontWeight: FontWeight.w400),
                                          autofocus: true,
                                          decoration: const InputDecoration(
                                              hintText: 'I have to...',
                                              labelText: 'New Todo',
                                              labelStyle: TextStyle(
                                                  color: Colors.indigoAccent,
                                                  fontWeight: FontWeight.w500)),
                                          validator: (value) {
                                            if (value!.isEmpty) {
                                              return 'Empty description!';
                                            }
                                            return value.contains('')
                                                ? 'Do not use the @ char.'
                                                : null;
                                          },
                                        ),
                                      ),
                                      Padding(
                                        padding: const EdgeInsets.only(
                                            left: 5, top: 15),
                                        child: CircleAvatar(
                                          backgroundColor: Colors.indigoAccent,
                                          radius: 18,
                                          child: IconButton(
                                            icon: const Icon(
                                              Icons.save,
                                              size: 22,
                                              color: Colors.white,
                                            ),
                                            onPressed: () {
                                              final newTodo = Todo(
                                                  description:
                                                      _todoDescriptionFromController
                                                          .value.text);
                                              if (newTodo
                                                  .description.isNotEmpty) {
                                                todoBloc
                                                    .add(CreateTodos(newTodo));
                                                Navigator.pop(context);
                                              }
                                            },
                                          ),
                                        ),
                                      )
                                    ],
                                  ),
                                ],
                              ),
                            ),
                          ),
                        ),
                      );
                    });
                  });
            },
          ),
        ));
  }

Answer 1

You have to use MultiBlocProvider before MaterialApp.

just do like that

@override
  Widget build(BuildContext context) => MultiBlocProvider(
        providers: [
          BlocProvider(create: (_) => TodoBloc()),
        ],
        child: MaterialApp()
      );