如何使用flutter+(bloc)Pattern在body属性中加载数据

Question

朋友们好，

我已经学习使用flutter好几个星期了，我正在创建一个应用程序，我在学习用flutter编程的过程中开发这个应用程序

我的想法是能够遵循模式(BLoC(。我现在想做的是能够将电影数据列表加载到body属性中的home.dart文件中

我感谢你的帮助

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_block.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

您可以使用StreamBuilder小部件，它接收流，并在向流中添加新数据时重新构建自己。

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();
},
);