Bloc: [Inquiry] BlocListener in AppBar with Shoppingcart Badges number not listening to state change

Created on 31 Aug 2020  路  6Comments  路  Source: felangel/bloc

Hi @felangel ,

I have tried many ways to either use cubit or bloc to trigger state like NewItemAdded so Buildlistener in AppBar when received state change from bloc or cubit it should show badges numbers ( example add item into cart, so App bar in the shopping cart will show badges number of how many items inside) but seem, it didn't work as usual in AppBar. do you have any advice?

question

Most helpful comment

hi @felangel
Thanks for your time. I think I figure out the issue already. It was due to that, there are two bloc providers in 2 parts.
One at Navigator by route name and another provider at the destinated page. I didn't notice there are set 2 providers there. when I moving or simulate code for you to review. I saw that.

All 6 comments

  • Note: I have tried with BlocListener too and this is last tried method, was with BlocBuilder

Hi @yk-theapps 馃憢
Thanks for opening an issue!

Can you please share a link to a sample app which illustrates the issue? I'm not sure I understand the question because you mention BlocListener but have a snippet using BlocBuilder. Is your bloc properly yielding/emitting states? I would recommend checking out the FAQs as well.

Let me know if that helps and if not please share a link to a sample app 馃憤

@felangel
here some sample, I can yield event and received state change but when I try on AppBar, it doesn't work duno yet, at mean time I will see at ur FAQ too.

sample with blocListener

image

class ShoppingCartBloc extends Bloc {
CatalogRepository _catalogRepository;
StoreRepository _storeRepository;
ShoppingCartBloc({@required CatalogRepository catalogRepository}) :assert(catalogRepository != null), _catalogRepository = catalogRepository
, super(ShoppingCartInitial());

@override
Stream mapEventToState(
ShoppingCartEvent event,
) async* {
//TODO:load shopping cart

if(event is LoadShoppingCart)
{
  //todo:
}
if (event is AddItemToCart) {
  yield* _mapAddItemToCartToState(event);
}
if (event is RemoveItemFromCart) {

}

}

// TODO: implement mapEventToState

Stream _mapAddItemToCartToState(
AddItemToCart event) async* {
int total = 0;
try{
total = await _catalogRepository.addItemToShoppingCart(
"XDrhHyEaWGj9FmoW2hf4", event.userId, event.product);
yield ItemAdded(total);
}catch(ex)
{
print(ex);
}

}
}

part of 'shopping_cart_bloc.dart';
abstract class ShoppingCartEvent extends Equatable {
const ShoppingCartEvent();
}
class LoadShoppingCart extends ShoppingCartEvent{

@override
List get props => [];
}

class AddItemToCart extends ShoppingCartEvent {

final String userId;
final ShoppingCartProduct product;
AddItemToCart(this.userId, this.product);

@override
List get props => [];

}

class RemoveItemFromCart extends ShoppingCartEvent {
@override
List get props => [];

}

part of 'shopping_cart_bloc.dart';

abstract class ShoppingCartState extends Equatable {
const ShoppingCartState();
}

class ShoppingCartInitial extends ShoppingCartState {
@override
List get props => [];
}

class ItemAdded extends ShoppingCartState {
final int totalItems;
ItemAdded(this.totalItems);

@override
List get props => [totalItems];

@override
String toString() => 'ShoppingCartState =>ItemAdded { totalItems: $totalItems }';
}

class ItemRemoved extends ShoppingCartState {
@override
List get props => [];
}

some log:
I/flutter (25662): LoadShoppingCart
I/flutter (25662): AddItemToCart
I/flutter (25662): ShoppingCartBadgeCubit Change { currentState: ShoppingCartBadgeInitial, nextState: CartBadgeIncreased }
I/flutter (25662): ShoppingCartBloc Transition { currentState: ShoppingCartInitial, event: LoadShoppingCart, nextState: ShoppingCartState =>ItemAdded { totalItems: 2 } }
I/flutter (25662): ShoppingCartBloc Change { currentState: ShoppingCartInitial, nextState: ShoppingCartState =>ItemAdded { totalItems: 2 } }
I/flutter (25662): Fruit
I/flutter (25662): ShoppingCartBloc Transition { currentState: ShoppingCartState =>ItemAdded { totalItems: 2 }, event: AddItemToCart, nextState: ShoppingCartState =>ItemAdded { totalItems: 20 } }
I/flutter (25662): ShoppingCartBloc Change { currentState: ShoppingCartState =>ItemAdded { totalItems: 2 }, nextState: ShoppingCartState =>ItemAdded { totalItems: 20 } }

@yk-theapps can you please provide a link to a complete sample app on github or a gist? It's hard to help without seeing the complete source code and in the most recent snippet I don't see use of an appBar at all.

okay, but I need time to split the project. as it quite big couldn't directly share due to the project not manage directly by me. I will try to create a sample project for that. thanks

hi @felangel
Thanks for your time. I think I figure out the issue already. It was due to that, there are two bloc providers in 2 parts.
One at Navigator by route name and another provider at the destinated page. I didn't notice there are set 2 providers there. when I moving or simulate code for you to review. I saw that.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

ricktotec picture ricktotec  路  3Comments

krusek picture krusek  路  3Comments

tigranhov picture tigranhov  路  3Comments

shawnchan2014 picture shawnchan2014  路  3Comments

timtraversy picture timtraversy  路  3Comments