flutter – State in bloc is not updating

Im learning flutter and bloc and I build simple app in flutter. Math quiz on time. I have a model with math operation. When I press event get numbers i get calcState with random numbers so it works fine all times but when i want press answer my calcState is not updating but on terminal my model result it’s changing.

This is my bloc

class CalcBloc extends Bloc<CalcEvent, CalcState> {
  CalcBloc() : super(const CalcInitial()) {
    on<CalcResult>(_onGetNumbers);
    on<NumberPressed>(_onNumberPressed);
  }

  Random random = Random();
  var list = ['+', '-'];
  bool check = false;

  void _onGetNumbers(CalcResult event, Emitter<CalcState> emit) {
    int randomNumber1 = random.nextInt(100);
    int randomNumber2 = random.nextInt(100);
    var element = list[random.nextInt(list.length)];
    bool check = true;
    if (check) {
      print('true');
    }
    CalcModel model = state.calcModel.copyWith(
        firstOperand: randomNumber1,
        firstOperator: element,
        secondOperand: randomNumber2,
        result: null);
    emit(CalcState(calcModel: model));
    print(model);
  }

  void _onNumberPressed(NumberPressed event, Emitter<CalcState> emit) {
    final state = this.state;
    CalcModel model = state.calcModel.copyWith(
        firstOperand: state.calcModel.firstOperand,
        firstOperator: state.calcModel.firstOperator,
        secondOperand: state.calcModel.secondOperand,
        result: event.number);
    emit(CalcState(calcModel: model));
    print(model);
  }
}

This is my State

class CalcState extends Equatable {
  final CalcModel calcModel;
  const CalcState({this.calcModel = const CalcModel()});

  @override
  List<Object> get props => [calcModel];
}

class CalcInitial extends CalcState {
  const CalcInitial() : super(calcModel: const CalcModel());
}

Event

abstract class CalcEvent extends Equatable {
  const CalcEvent();

  @override
  List<Object> get props => [];
}

class CalcResult extends CalcEvent {
  @override
  List<Object> get props => [];
}

class NumberPressed extends CalcEvent {
  final int number;

  const NumberPressed({required this.number});

  @override
  List<Object> get props => [number];
}

And Screen

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

  @override
  State<TestingScreen> createState() => _TestingScreenState();
}

class _TestingScreenState extends State<TestingScreen> {
  @override

  @override
  Widget build(BuildContext context) {
    return BlocBuilder<CalcBloc, CalcState>(
      builder: (context, state) {
        return Scaffold(
          body: Column(
            children: [
              const SizedBox(
                height: 100,
              ),
              Center(child: state.calcModel.firstOperand == null ? const Text('') : Text(state.calcModel.toString())),
              const SizedBox(
                height: 100,
              ),
              Padding(
                padding:
                    const EdgeInsets.symmetric(horizontal: 80, vertical: 40),
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                    _numberbutton(text: '7', onTap: () => numberPressed(7)),
                    _numberbutton(text: '8', onTap: () => numberPressed(8)),
                    _numberbutton(text: '9', onTap: () => numberPressed(9)),
                  ],
                ),
              ),
              Padding(
                padding:
                    const EdgeInsets.symmetric(horizontal: 80, vertical: 40),
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                    _numberbutton(text: '4', onTap: () => numberPressed(4)),
                    _numberbutton(text: '5', onTap: () => numberPressed(5)),
                    _numberbutton(text: '6', onTap: () => numberPressed(6)),
                  ],
                ),
              ),
              Padding(
                padding:
                    const EdgeInsets.symmetric(horizontal: 80, vertical: 40),
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                    _numberbutton(text: '1', onTap: () => numberPressed(1)),
                    _numberbutton(text: '2', onTap: () => numberPressed(2)),
                    _numberbutton(text: '3', onTap: () => numberPressed(3)),
                  ],
                ),
              ),
              Padding(
                padding:
                    const EdgeInsets.symmetric(horizontal: 80, vertical: 40),
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                    _numberbutton(text: '0', onTap: () => numberPressed(0)),
                    _numberbutton(
                        text: '=',
                        onTap: () {
                          context.read<CalcBloc>().add(CalcResult());
                        }),
                  ],
                ),
              ),
            ],
          ),
        );
      },
    );
  }

  Widget _numberbutton({
    required String text,
    required VoidCallback onTap,
  }) {
    return InkWell(
      onTap: onTap,
      child: Text(text),
    );
  }

  void numberPressed(int number) {
    context.read<CalcBloc>().add(NumberPressed(number: number));
  }
}

I have

  • flutter_bloc: ^8.0.1,
  • bloc: ^8.0.3,
  • equatable: ^2.0.3

There is CalcModel

import 'package:equatable/equatable.dart';

class CalcModel extends Equatable {
  final int? firstOperand;
  final String? firstOperator;
  final int? secondOperand;
  final String? secondOperator;
  final int? thirdOperand;
  final String? thirdOperator;
  final int? fourthOperand;
  final int? result;
  const CalcModel(
      {this.firstOperand,
      this.firstOperator,
      this.secondOperand,
      this.secondOperator,
      this.thirdOperand,
      this.thirdOperator,
      this.fourthOperand,
      this.result});

  CalcModel copyWith({
    int? firstOperand,
    String? firstOperator,
    int? secondOperand,
    String? secondOperator,
    int? thirdOperand,
    String? thirdOperator,
    int? fourthOperand,
    int? result,
  }) {
    return CalcModel(
        firstOperand: firstOperand ?? this.firstOperand,
        firstOperator: firstOperator ?? this.firstOperator,
        secondOperand: secondOperand ?? this.secondOperand,
        secondOperator: secondOperator ?? this.secondOperator,
        thirdOperand: thirdOperand ?? this.thirdOperand,
        thirdOperator: thirdOperator ?? this.thirdOperator,
        fourthOperand: fourthOperand ?? this.fourthOperand,
        result: result ?? this.result);
  }

  CalcModel.fromJson(Map<String, dynamic> json)
      : firstOperand = json['firstOperand'] as int?,
        firstOperator = json['firstOperator'] as String?,
        secondOperand = json['secondOperand'] as int?,
        secondOperator = json['secondOperator'] as String?,
        thirdOperand = json['thirdOperand'] as int?,
        thirdOperator = json['thirdOperator'] as String?,
        fourthOperand = json['fourthOperand'] as int?,
        result = json['result'] as int?;

  Map<String, dynamic> toJson() => {
        'firstOperand': firstOperand,
        'firstOperator': firstOperator,
        'secondOperand': secondOperand,
        'secondOperator': secondOperator,
        'thirdOperand': thirdOperand,
        'thirdOperator': thirdOperator,
        'fourthOperand': fourthOperand,
        'result': result,
      };

  @override
  String toString() {
    return '$firstOperand $firstOperator $secondOperand = $result';
  }

  @override
  List<Object?> get props => [
        firstOperand,
        firstOperator,
        secondOperand,
        secondOperator,
        thirdOperand,
        thirdOperator,
        fourthOperand
      ];
}

Leave a Comment