Flutter BLoC and Provider: A Shopping Cart Example

main_page.dart

// This is a pseudo code to show the overall structure 
// of a main page of a shopping cart app built with Flutter.
// For the complete app, please see https://github.com/junjizhi/flutter-shopping-cart

Widget build(BuildContext context) {
  var bloc = Provider.of<CartBloc>(context);
  int totalCount = 0;
    if (bloc.cart.length > 0) {
      totalCount = bloc.cart.values.reduce((a, b) => a + b);
  }
  return Scaffold(
    appBar: AppBar(
      title: Text(widget.title),
      actions: <Widget>[
          Container(
              child: GestureDetector(
                onTap: () {
                  Navigator.push(
                    context,
                    MaterialPageRoute(
                      builder: (context) => CartPage(),
                    ),
                  );
                },
                child: _buildCartIcon(totalCount)  // icon with text overlay
              )
            ),
        )
      ],
    body: GridView.count(
      crossAxisCount: 2,
      children: List.generate(6, (index) {
        return GestureDetector(
            onTap: () {
              bloc.addToCart(index);
            },
            child: Container(
              decoration: BoxDecoration(
                image: DecorationImage(
                  image: AssetImage("assets/${index + 1}.jpg"),
                  fit: BoxFit.fitWidth,
                ),
                borderRadius: BorderRadius.circular(12),
              ),
            ));
      }),
    ),
  );
}