Bloc Consumer is not listening to states

user_16051716 0
Viewed 556

when i press the add or minus button the number doesn't change and the bloc consumer doesn't listen to states i don't know the reason i tried every thing but nothing worked with me i want to know how to listen to changes and make the number change when i press the buttons add or minus

`

class HomeScreen extends StatefulWidget {
  const HomeScreen({Key? key}) : super(key: key);

  @override
  State<HomeScreen> createState() => _HomeScreenState();
}

class _HomeScreenState extends State<HomeScreen> {
  ColorsCubit cubit = ColorsCubit();
 
  @override
  Widget build(BuildContext context) {
    return BlocProvider(
        create: (context) => ColorsCubit(),
        child: BlocConsumer<ColorsCubit, ColorsStates>(
          listener: (context,ColorsStates state) {
            if (state is InitialState) print("in initial state");
            if(state is AddState)print('add state');
          },
          builder: (context,ColorsStates state) {
            return Scaffold(
              body: Center(
                child: Row(
                  crossAxisAlignment: CrossAxisAlignment.center,
                  children: [
                    TextButton(onPressed: ()=>cubit.add(), child: Text("add")),
                    Text(cubit.count.toString()),
                    TextButton(onPressed: ()=>cubit.minus(), child: Text("minus")),
                  ],
                ),
              ),
            );
          },
        ));
  }
}

// this is cubit class


class ColorsCubit extends Cubit<ColorsStates>{
  ColorsCubit() : super(InitialState());

  static ColorsCubit get(context)=>BlocProvider.of(context);

  int count=0;

  void add(){
    count++;
    emit(AddState());
  }

  void minus(){
    count++;
    emit(MinusState());
 }

}

// this is states class


abstract class ColorsStates{}

class InitialState extends ColorsStates{}

class AddState extends ColorsStates{}

class MinusState extends ColorsStates{}

`

flutter-dependencies flutter-layout dart flutter
1 Answers

This ColorsCubit cubit = ColorsCubit(); is different from the cubit instance you're listening to.

You could do this:

  • ColorsCubit? cubit;

  • Then inside the BlocConsumer method assign your cubit

  • And finally, call the methods you want.

Your code would look like this now:

class _HomeScreenState extends State<HomeScreen> {
  ColorsCubit? cubit;
 
  @override
  Widget build(BuildContext context) {
    return BlocProvider(
        create: (context) => ColorsCubit(),
        child: BlocConsumer<ColorsCubit, ColorsStates>(
          listener: (context,ColorsStates state) {
            if (state is InitialState) print("in initial state");
            if(state is AddState)print('add state');
          },
          builder: (context,ColorsStates state) {

cubit??= context.read<ColorsCubit>(); // assign cubit if it's not already assigned

            return Scaffold(
              body: Center(
                child: Row(
                  crossAxisAlignment: CrossAxisAlignment.center,
                  children: [
                    TextButton(onPressed: ()=>cubit.add(), child: Text("add")),
                    Text(cubit.count.toString()),
                    TextButton(onPressed: ()=>cubit.minus(), child: Text("minus")),
                  ],
                ),
              ),
            );
          },
        ));
  }
}

You could also consider this approach: Instead of using BlocProvider, use BlocProvider.value, and put your cubit as the value. This way you don't need to do what I did in the above code

user_111034930
Related