Download as pdf or txt
Download as pdf or txt
You are on page 1of 11

Flutter

BLoC
What is Flutter BLoC?
BLoC stands for Business Logic
Components.

BLoC is one of the state management


for Flutter applications.

You can use it to handle all the


possible states of your application in
an easy way.
Pros Of BLoC Pattern

Easy seperate UI from logic

Easy to test code

Easy to reuse code

Good Performance

Large Community
Understanding BLoC
Concepts: Events and States
Events: events are an application’s
inputs (like button_press to load
images, text inputs).

States: States are simply the


application’s state, which can be
changed in response to the event
received.
Understanding BLoC
Concepts: BLoC and UI
BLoC: It is a class that takes in
events, processes them, and
produces a new state.
It is in charge of controlling the
application’s state and responding
to user input.

UI: When the bloc emits a new


state, UI layer listens to the bloc
and updates the UI widgets.
BLoC Diagram
Bloc Widgets: BlocProvider
It's typically placed at the root of your
widget tree to make the bloc accessible to
all child widgets that need it.
Bloc Widgets: BlocBuilder
It is used to rebuild a part of the UI in
response to changes in the state of a bloc.
It takes a Bloc and a builder function and
automatically rebuilds the UI when the
state of the bloc changes.
Bloc Widgets: BlocListener
The BlocListener widget is used to
perform side-effects in response to state
changes in a bloc.
It does not rebuild the UI but allows you
to execute code based on the bloc's state.
Bloc Widgets: BlocConsumer
The BlocConsumer widget combines the
functionality of BlocBuilder and
BlocListener.
It rebuilds the UI and executes side-effects
based on the bloc's state.
From Where you can learn
BLoC?
You can refer the official document of
BLoC

Pub Dev

That’s It.
Thank You For Your
Support.

You might also like