Bloc: Blocprovider.of() called with a context that does not contain a block of type

Created on 31 Aug 2019 · 29Comments · Source: felangel/bloc

I had a problem with getting Bloc from child widget and I have no idea what I'm doing wrong.
I'm using flutter_bloc v.0.21.0.

Here is my main.dart:

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

import './pages/splashPage.dart';
import './pages/loginPage.dart';
import './pages/homePage.dart';

import "./blocs/authenticationBloc.dart";

void main() => runApp(WeatherApp());

class WeatherApp extends StatefulWidget {
  @override
  State<StatefulWidget> createState() => _WeatherAppState();
}

class _WeatherAppState extends State<WeatherApp> {
  AuthenticationBloc _authenticationBloc;

  @override
  void initState() {
    _authenticationBloc = AuthenticationBloc();
    _authenticationBloc.dispatch(AppStarted());

    super.initState();
  }

  @override
  void dispose() {
    _authenticationBloc.dispose();

    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return BlocProvider<AuthenticationBloc>(
      builder: (context) => _authenticationBloc,
      child: MaterialApp(
        debugShowCheckedModeBanner: true,
        home: BlocBuilder(
          bloc: _authenticationBloc,
          builder: (context, state) {
            if (state is AuthenticationUninitialized) {
              return SplashPage();
            } else if (state is AuthenticationAuthenticated) {
              return HomePage();
            } else if (state is AuthenticationUnauthenticated) {
              return LoginPage();
            }
          },
        ),
      ),
    );
  }
}

And here in LoginPage widget I'm getting my authenticationBloc using BlocProvider.of method (in initState method):

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

import "../blocs//authenticationBloc.dart";

class LoginPage extends StatefulWidget {
  @override
  _LoginPageState createState() => _LoginPageState();
}

class _LoginPageState extends State<LoginPage> {
  AuthenticationBloc _authenticationBloc;

  @override
  void initState() {
    _authenticationBloc = BlocProvider.of<AuthenticationBloc>(context);
    super.initState();
  }

  @override
  Widget build(BuildContext context) {

    return Scaffold(
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Text('This is login page'),
            RaisedButton(
              child: Text('Login'),
              onPressed: () => {},
            )
          ],
        ),
      ),
    );
  }
}

but instead of receiving bloc I got this error:

flutter: ══╡ EXCEPTION CAUGHT BY WIDGETS LIBRARY ╞═══════════════════════════════════════════════════════════
flutter: The following assertion was thrown building BlocBuilder<AuthenticationBloc, dynamic>(state:
flutter: _BlocBuilderBaseState<AuthenticationBloc, dynamic>#5b9f4):
flutter:         BlocProvider.of() called with a context that does not contain a Bloc of type
flutter: AuthenticationBloc.
flutter:         No ancestor could be found starting from the context that was passed to
flutter: BlocProvider.of<AuthenticationBloc>().
flutter:
flutter:         This can happen if:
flutter:         1. The context you used comes from a widget above the BlocProvider.
flutter:         2. You used MultiBlocProvider and didn't explicity provide the BlocProvider types.
flutter:
flutter:         Good: BlocProvider<AuthenticationBloc>(builder: (context) => AuthenticationBloc())
flutter:         Bad: BlocProvider(builder: (context) => AuthenticationBloc()).
flutter:
flutter:         The context used was: LoginPage(dirty, state: _LoginPageState#2cea8(lifecycle state:
flutter: created))

Can someone tell me what I'm doing wrong?

Here is my Flutter doctor output:

Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel stable, v1.7.8+hotfix.3, on Mac OS X 10.14.6 18G95, locale
    en-PL)

[✓] Android toolchain - develop for Android devices (Android SDK version 29.0.0)
[✓] Xcode - develop for iOS and macOS (Xcode 10.3)
[✓] iOS tools - develop for iOS devices
[✓] Android Studio (version 3.4)
[✓] VS Code (version 1.37.1)
[✓] Connected device (1 available)

• No issues found!

question

Source

mariaszek9003

Most helpful comment

Hello! Can you please explain what was that mistake? Or share code of this project. Project page is currently unavailable, but it interesting)

ViktorJasch on 18 Sep 2019

👍6

All 29 comments

Hi @mariaszek9003 👋
Thanks for opening an issue!

Can you please share the link to an example app which illustrates the issue you're having so I can run and debug it locally?

Also, you can eliminate a lot of boilerplate code by refactoring your StatefulWidgets into StatelessWidgets. This is because BlocProvider will automatically dispose the blocs for you and BlocBuilder will automatically do the bloc lookup for you.

I've put together a gist with an updated version of the code you've provided. Let me know if that helps and if you're still having trouble please provide a link to a sample app 👍

Thanks!

felangel on 1 Sep 2019

🎉2

Hi @felangel, thank you for response.

I checked your gist if changing StatefulWidgets to StatelessWidgets help with the problem but unfortunately it doesn't.

Here is the repo: https://github.com/mariaszek9003/WeatherApp

mariaszek9003 on 1 Sep 2019

👍1

Hi @mariaszek9003 thanks for the link! I took a look and opened 2 pull requests.

fix imports - fixes the issue you were seeing
other improvements - other things I noticed that you might want to improve

Hope that helps and sorry for the delayed response! 👍

felangel on 3 Sep 2019

Hi @felangel thank you for fixing the issue - that was stupid mistake. Also thank you for code improvement suggestions.

mariaszek9003 on 3 Sep 2019

❤1 👍1

Hello! Can you please explain what was that mistake? Or share code of this project. Project page is currently unavailable, but it interesting)

ViktorJasch on 18 Sep 2019

👍6

@ViktorJasch Hi! Sorry for late response. The cause of the problem was double slash that I made in importing statement in LoginPage file:

import "../blocs//authenticationBloc.dart";

it should be:

import "../blocs/authenticationBloc.dart";

mariaszek9003 on 23 Sep 2019

👍1

Ola tenho um problema, esta aparecendo essa mensagem quando vou prover uma estancia
BlocProvider.of() called with a context that does not contain a Bloc of type ProcessoBloc.

import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:legale/blocs/processo/processo.dart';
import 'package:legale/core/config/style.dart';
import 'package:legale/core/models/processo-model.dart';

// void main() {
// runApp(new MaterialApp(
// home:
// new ProcessoCardsScreen(),
// ));
// }

class ProcessoCardsScreen extends StatefulWidget {
final Processo processo;

const ProcessoCardsScreen({Key key, this.processo}) : super(key: key);
@override
_ProcessoCardsScreen createState() => _ProcessoCardsScreen();

}

class _ProcessoCardsScreen extends State {
ProcessoBloc _processoBloc;

@override
void initialState(){
_processoBloc = BlocProvider.of(context);
super.initState();
}

@override
Widget build(BuildContext context) {
BlocProvider.of(context); // linha do erro
return BlocBuilder(
bloc: _processoBloc,
condition: (previousState, state) {
return previousState is DetalhesProcessoCarregado ||
state is DetalhesProcessoCarregado;
},
builder: (context, state) {
DetalhesProcessoCarregado currentState =
(state as DetalhesProcessoCarregado);
return new Scaffold(
appBar: AppBar(
title: Text('Processo'),
backgroundColor: LegaleStyle.colorPrimary,
),
body: ListView(
children: [

Rodrigossff91 on 12 Nov 2019

@Rodrigossff91 you need to provide the ProcessoBloc using BlocProvider somewhere in the widget tree

void main() {
  runApp(
    BlocProvider<ProcessoBloc>(
      builder: (_) => ProcessoBloc(),
      child: MaterialApp(
        home: ProcessoCardsScreen(),
      ),
    ),
  );
}

Then when you use BlocProvider.of you need to provide the bloc type so instead of

_processoBloc = BlocProvider.of(context);

you should do

_processoBloc = BlocProvider.of<ProcessoBloc>(context);

Hope that helps 👍

felangel on 14 Nov 2019

👍3

tnks

Rodrigossff91 on 28 Feb 2020

👍1

Hi, I have the same issue @felangel ,
here is my code :
`import 'dart:async';

import 'package:meta/meta.dart';
import 'package:bloc/bloc.dart';

import '../repositories/user_repository.dart';
import './authentication.dart';

class AuthenticationBloc
extends Bloc {
final UserRepository userRepository;

AuthenticationBloc({@required this.userRepository})
: assert(userRepository != null);

@override
AuthenticationState get initialState => AuthenticationUninitialized();

@override
Stream mapEventToState(
AuthenticationEvent event,
) async* {
if (event is AppStarted) {
final bool hasToken = await userRepository.hasToken();

  if (hasToken) {
    yield AuthenticationAuthenticated();
  } else {
    yield AuthenticationUnauthenticated();
  }
}

if (event is LoggedIn) {
  yield AuthenticationLoading();
  await userRepository.persistToken(event.token);
  yield AuthenticationAuthenticated();
}

if (event is LoggedOut) {
  yield AuthenticationLoading();
  await userRepository.logout();
  yield AuthenticationUnauthenticated();
}

}
}`

and i called it like this :
InkWell(child: Text('logout'),onTap: ()=> BlocProvider.of(context).mapEventToState(LoggedOut()))