Continuing from our basic introduction to Cubits

Cubit in a UI

We build a Cubit with a class and use it in a UI/

Varanasi Software Junction: Cubit in a class.

We make a class for the purpose.

Its a simple class with two variables nooftransctions and balance. We have 2 methods deposit and withdraw The deposit method adds 10 to the state and the withdraw removes 5. Both of them increment the nooftranasctions by 1.









class AccountState {
  int nooftransactions = 0;
  int prevnooftransactions = 0;
  int balance = 0;
  AccountState(this.balance, this.nooftransactions);
  @override
  String toString() {
    return "Amount=$balance, Transactions = $nooftransactions";
  }

  @override
  bool operator ==(Object other) {
    if (other is! AccountState) return false;
    AccountState ac = other;
    print(prevnooftransactions == ac.nooftransactions);
    return prevnooftransactions == ac.nooftransactions;
  }

  @override
  int get hashCode => balance.hashCode ^ nooftransactions.hashCode;
}

The state class must show some difference from the previous object so we redefine the == operator. We have kept two variables previousnooftransactions and nooftransactions for the purpose.

Here is the full code





import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';

void main() {
  //https://api.flutter.dev/flutter/dart-async/runZoned.html
  BlocOverrides.runZoned(() {
    runApp(const VsjApp());
  });
}

class VsjBlocObserver extends BlocObserver {}

class VsjApp extends StatelessWidget {
  const VsjApp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return BlocProvider(
      create: (context) => VsjCubit(),
      child: const VsjCubitView(),
    );
  }
}

class VsjCubitView extends StatelessWidget {
  const VsjCubitView({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return BlocBuilder<VsjCubit, AccountState>(
      builder: (context, account) {
        return MaterialApp(
          debugShowCheckedModeBanner: false,
          home: Scaffold(
            appBar: AppBar(
              title: const Text('Vsj Cubit Demo with a class as state'),
              backgroundColor: Colors.teal,
              centerTitle: true,
            ),
            body: Center(
              child: Text(
                'Account Info: $account',
                style: const TextStyle(fontSize: 32),
              ),
            ),
            floatingActionButton: Column(
              crossAxisAlignment: CrossAxisAlignment.end,
              mainAxisAlignment: MainAxisAlignment.end,
              children: <Widget>[
                Padding(
                  padding: const EdgeInsets.all(8.0),
                  child: ElevatedButton(
                    child: const Text("Deposit   "),
                    onPressed: () {
                      context.read<VsjCubit>().deposit();
                    },
                  ),
                ),
                Padding(
                  padding: const EdgeInsets.all(8.0),
                  child: ElevatedButton(
                    child: const Text("Withdraw"),
                    onPressed: () {
                      context.read<VsjCubit>().withdraw();
                    },
                  ),
                ),
              ],
            ),
          ),
        );
      },
    );
  }
}

class VsjCubit extends Cubit<AccountState> {
  VsjCubit() : super(VsjCubit.account);
  static final AccountState account = AccountState(0, 0);
  @override
  void onChange(Change<AccountState> change) {
    super.onChange(change);
    print(change);
  }

  @override
  void onError(Object error, StackTrace stackTrace) {
    print('$error, $stackTrace');
    super.onError(error, stackTrace);
  }

  void deposit() {
    print("Deposit $state");
    state.prevnooftransactions = state.nooftransactions;
    state.balance += 10;
    state.nooftransactions += 1;
    emit(state);
  }

  void withdraw() {
    print("withdraw $state");
    state.prevnooftransactions = state.nooftransactions;
    state.balance -= 5;
    state.nooftransactions += 1;
    emit(state);
  }
}

class AccountState {
  int nooftransactions = 0;
  int prevnooftransactions = 0;
  int balance = 0;
  AccountState(this.balance, this.nooftransactions);
  @override
  String toString() {
    return "Amount=$balance, Transactions = $nooftransactions";
  }

  @override
  bool operator ==(Object other) {
    if (other is! AccountState) return false;
    AccountState ac = other;
    print(prevnooftransactions == ac.nooftransactions);
    return prevnooftransactions == ac.nooftransactions;
  }

  @override
  int get hashCode => balance.hashCode ^ nooftransactions.hashCode;
}