How to load data in the body property using flutter + (bloc) Pattern - flutter

Question

Hello friends,
I have been learning to use flutter for weeks, I am creating an app that I develop as I learn to program in flutter.
My idea is to be able to follow the Pattern (BLoC). What I want to do now is like being able to load the movie data list into the home.dart file in the body property
I appreciate your help!
home.dart
import 'package:eva_icons_flutter/eva_icons_flutter.dart';
import 'package:flutter/material.dart';
import 'package:skyshowapp/styles/theme.dart' as Style;
class HomeScreen extends StatefulWidget{
#override
_HomeScreenState createState() => _HomeScreenState();
}
class _HomeScreenState extends State<HomeScreen>{
#override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: Style.Colors.mainColor,
appBar: AppBar(
backgroundColor: Style.Colors.mainColor,
centerTitle: true,
leading: Icon(EvaIcons.menu2Outline , color: Colors.white),
title: Text("SKYSHOW APP"),
actions: <Widget>[
IconButton(icon: Icon(EvaIcons.searchOutline , color: Colors.white,), onPressed: null,)
],
),
body: ListView(
children: <Widget>[
],
),
);
}
}
movie_bloc.dart
import 'package:rxdart/subjects.dart';
import 'package:skyshowapp/model/movie.dart';
import 'package:skyshowapp/repository/repository.dart';
class MovieListBloc{
final MovieRepository _repository = new MovieRepository();
final BehaviorSubject<MovieRootClass> _subject = new BehaviorSubject<MovieRootClass>();
getMovies() async{
MovieRootClass response = await _repository.getMovies();
_subject.sink.add(response);
}
dispose(){
_subject.close();
}
BehaviorSubject<MovieRootClass> get subject => _subject;
}
final movieBloc = new MovieListBloc();
class MovieRootClass {
List<Movies> movies;
MovieRootClass({this.movies});
MovieRootClass.fromJson(Map<String, dynamic> json) {
if (json['movies'] != null) {
movies = new List<Movies>();
json['movies'].forEach((v) {
movies.add(new Movies.fromJson(v));
});
}
}
Map<String, dynamic> toJson() {
final Map<String, dynamic> data = new Map<String, dynamic>();
if (this.movies != null) {
data['movies'] = this.movies.map((v) => v.toJson()).toList();
}
return data;
}
}
class Movies {
String id;
String title;
String sinopsis;
String poster;
String rating;
String quality;
String year;
List<Extra> extra;
Movies(
{this.id,
this.title,
this.sinopsis,
this.poster,
this.rating,
this.quality,
this.year,
this.extra});
Movies.fromJson(Map<String, dynamic> json) {
id = json['id'];
title = json['title'];
sinopsis = json['sinopsis'];
poster = json['poster'];
rating = json['rating'];
quality = json['quality'];
year = json['year'];
if (json['extra'] != null) {
extra = new List<Extra>();
json['extra'].forEach((v) {
extra.add(new Extra.fromJson(v));
});
}
}
Map<String, dynamic> toJson() {
final Map<String, dynamic> data = new Map<String, dynamic>();
data['id'] = this.id;
data['title'] = this.title;
data['sinopsis'] = this.sinopsis;
data['poster'] = this.poster;
data['rating'] = this.rating;
data['quality'] = this.quality;
data['year'] = this.year;
if (this.extra != null) {
data['extra'] = this.extra.map((v) => v.toJson()).toList();
}
return data;
}
}
// Extra class .....

Answer 1

You can use StreamBuilder widget which takes in a stream, and rebuilds itself when ever new data is added to the stream.
StreamBuilder(
stream: subject.stream,
builder: (context, snapshot) {
if (snapshot.hasData) {
return ListView.builder(
itemCount: snapshot.data.movies.length,
itemBuilder: (BuildContext context, int idnex) {
return ListTile(
title: Text(snapshot.data.someProperty),
);
},
);
}
return const CircularProgressIndicator();
},
);