详情页,直接上代码:
class GankDetailPage extends StatefulWidget {
GankDetailPage({Key key, this.gankBean}) : super(key: key);
final GankBean gankBean;
@override
_GankDetailPageState createState() => new _GankDetailPageState(gankBean);
}
class _GankDetailPageState extends State<GankDetailPage> {
final GankBean gankBean;
_GankDetailPageState(this.gankBean);
Widget detail(GankBean gankBean) {
if (gankBean.images != null && gankBean.images.length > 0) {
return new Scaffold(
appBar: new AppBar(),
body: ListView(
children: <Widget>[
Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Padding(
padding: EdgeInsets.only(
left: 10.0, right: 10.0, top: 5.0, bottom: 5.0),
child: Text("who:${gankBean.who}")),
Padding(
padding: EdgeInsets.only(
left: 10.0, right: 10.0, top: 5.0, bottom: 5.0),
child: Text("type:${gankBean.type}")),
Padding(
padding: EdgeInsets.only(
left: 10.0, right: 10.0, top: 5.0, bottom: 5.0),
child: Text("description:${gankBean.desc}")),
Padding(
padding: EdgeInsets.only(
left: 10.0, right: 10.0, top: 5.0, bottom: 5.0),
child: Text("published:${gankBean.publishedAt}")),
Padding(
padding: EdgeInsets.only(left: 10.0, right: 10.0),
child: CachedNetworkImage(
key: new ValueKey<String>(gankBean.images[0]),
imageUrl: gankBean.images[0],
placeholder: (context, url) =>
new CircularProgressIndicator(),
),
),
],
),
],
),
);
} else {
return new Scaffold(
appBar: new AppBar(),
body: ListView(
children: <Widget>[
Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Padding(
padding: EdgeInsets.only(
left: 10.0, right: 10.0, top: 5.0, bottom: 5.0),
child: Text("who:${gankBean.who}")),
Padding(
padding: EdgeInsets.only(
left: 10.0, right: 10.0, top: 5.0, bottom: 5.0),
child: Text("type:${gankBean.type}")),
Padding(
padding: EdgeInsets.only(
left: 10.0, right: 10.0, top: 5.0, bottom: 5.0),
child: Text("description:${gankBean.desc}")),
Padding(
padding: EdgeInsets.only(
left: 10.0, right: 10.0, top: 5.0, bottom: 5.0),
child: Text("published:${gankBean.publishedAt}")),
],
),
],
),
);
}
}
@override
Widget build(BuildContext context) {
return detail(gankBean);
}
}
这里用listview来展示详情页的内容.
可以看出一些问题来, 比如,我有图,与无图的情况,就需要构造两个widget, 不能像android/ios那样, 我隐藏一个,显示一个.暂时我还没有找到一个可行的方案.
如果没有的话,那么,一个复杂页面,由于控件的展示与不展示,这种导致的结果,会有非常多的类型出现.