替换main.dart即可查看效果，效果如下图片所示：
Simulator Screen Shot - iPhone 8 - 2019-10-10 at 17.27.59.png
main.dart源码入下：
import 'dart:convert';
import 'dart:io';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
void main() => runApp(MyApp());
class MyAppextends StatelessWidget {
// This widget is the root of your application.
@override
Widgetbuild(BuildContext context) {
return MaterialApp(
title:'Flutter Demo',
theme:ThemeData(
// This is the theme of your application.
//
// Try running your application with "flutter run". You'll see the
// application has a blue toolbar. Then, without quitting the app, try
// changing the primarySwatch below to Colors.green and then invoke
// "hot reload" (press "r" in the console where you ran "flutter run",
// or simply save your changes to "hot reload" in a Flutter IDE).
// Notice that the counter didn't reset back to zero; the application
// is not restarted.
primarySwatch: Colors.blue,
),
home:DouBanListView(),
);
}
}
class DouBanListViewextends StatefulWidget {
@override
StatecreateState() {
// TODO: implement createState
return DouBanState();
}
}
class DouBanStateextends State {
var subjects = [];
var itemHeight =150.0;
// 请求数据
requestMovieTop()async {
var httpClient =HttpClient();
// http://douban.uieee.com/v2/movie/top250?start=25&count=10
var uri =Uri.http('douban.uieee.com', '/v2/movie/top250', {'start':'0', 'count':'150'});
var request =await httpClient.getUrl(uri);
var response =await request.close();
var responseBody =await response.transform(utf8.decoder).join();
Map data = jsonDecode(responseBody);
setState(() {
subjects = data['subjects'];
});
}
@override
void initState() {
super.initState();
requestMovieTop();
}
@override
Widgetbuild(BuildContext context) {
// TODO: implement build
return Scaffold(
appBar:AppBar(
title:Text(
'豆瓣电影Top150'
),
),
body:Container(
child: getListViewContainer(),
),
);
}
getListViewContainer() {
if (subjects.length ==0) {
return Center(
child:CupertinoActivityIndicator(),
);
}
return ListView.builder(
itemCount:subjects.length,
itemBuilder: (BuildContext context, int index) {
return GestureDetector(
child:Container(
color: Colors.transparent,
child:Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
numberWidget(index +1),
getItemContainerView(subjects[index]),
// 下面的灰色分割线线
Container(
height:10,
color:Color.fromARGB(255, 234, 233, 234),
),
],
),
),
onTap: () {
// 监听点击事件
print("click item index = $index");
},
);
},
);
}
// 图标
WidgetnumberWidget(var no) {
return Container(
child:Text(
'No.$no',
style:TextStyle(
color:Color.fromARGB(255, 133, 66, 0),
),
),
decoration:BoxDecoration(
color:Color.fromARGB(255, 255, 201, 129),
borderRadius:BorderRadius.all(Radius.circular(5.0)),
),
padding:EdgeInsets.fromLTRB(8, 4, 8, 4),
margin:EdgeInsets.only(left:12, top:10),
);
}
WidgetgetItemContainerView(var subject) {
var imgUrl = subject['images']['medium'];
return Container(
width: double.infinity,
padding:EdgeInsets.all(5.0),
child:Row(
children: [
getImage(imgUrl),
Expanded(
child: getMovieInfoView(subject),
flex:1,
),
],
),
);
}
// 圆角图片
WidgetgetImage(var imgUrl) {
return Container(
decoration:BoxDecoration(
image:DecorationImage(image:NetworkImage(imgUrl), fit: BoxFit.cover),
borderRadius:BorderRadius.all(Radius.circular(5.0)),
),
margin:EdgeInsets.only(left:8, top:3, right:8, bottom:3),
height:itemHeight,
width:100.0,
);
}
// 电影标题，星标评分，演员简介Container
WidgetgetMovieInfoView(var subject) {
var start = subject['rating']['average'];
return Container(
height:itemHeight,
alignment: Alignment.topLeft,
child:Column(
children: [
getTitleView(subject),
RatingBar(start),
DescWidget(subject),
],
),
);
}
// 肖申克的救赎（1993）View
WidgetgetTitleView(var subject) {
var title = subject['title'];
var year = subject['year'];
return Container(
child:Row(
children: [
Icon(
Icons.play_circle_outline,
color: Colors.redAccent,
),
Text(
title,
style:TextStyle(
fontSize:18,
fontWeight: FontWeight.bold,
color: Colors.black,
),
),
Text(
'($year)',
style:TextStyle(
fontSize:16,
fontWeight: FontWeight.bold,
color: Colors.grey,
),
),
],
),
);
}
}
class RatingBarextends StatelessWidget {
doublestars;
RatingBar(this.stars);
@override
Widgetbuild(BuildContext context) {
List startList = [];
// 实心星星
var startNumber =stars ~/2;
// 半实心星星
var startHalf =0;
if (stars.toString().contains('.')) {
int tmp = int.parse(stars.toString().split('.')[1]);
if (tmp >=5) {
startHalf =1;
}
}
// 实心星星
var startEmpty =5 - startNumber - startHalf;
for (var i =0; i < startNumber; i++) {
startList.add(Icon(
Icons.star,
color: Colors.amberAccent,
size:18,
));
}
if (startHalf >0) {
startList.add(Icon(
Icons.star_half,
color: Colors.amberAccent,
size:18,
));
}
for (var i =0; i < startEmpty; i++) {
startList.add(Icon(
Icons.star_border,
color: Colors.grey,
size:18,
));
}
startList.add(Text(
'$stars',
style:TextStyle(
color: Colors.grey,
),
));
return Container(
alignment: Alignment.topLeft,
padding:const EdgeInsets.only(left:0, top:8, right:0, bottom:8),
child:Row(
children: startList,
),
);
}
}
// 类别、演员介绍
class DescWidgetextends StatelessWidget {
var subject;
DescWidget(this.subject);
@override
Widgetbuild(BuildContext context) {
List casts =subject['casts'];
var sb =StringBuffer();
List genres =subject['genres'];
for (var i =0; i < genres.length; i++) {
sb.write('${genres[i]}');
}
sb.write("/ ");
List list =List.generate(casts.length, (int index) => casts[index]['name'].toString());
for (var i =0; i < list.length; i++) {
sb.write('${list[i]}');
}
return Container(
child:Text(
sb.toString(),
softWrap:true,
textDirection: TextDirection.ltr,
style:TextStyle(
fontSize:16,
color:Color.fromARGB(255, 118, 117, 118),
),
),
);
}
}
pubspec.yaml中添加如下依赖：
http: ^0.12.0