Flutter 使用ListView实现类似物流的时间轴（详细）

前言

本文部分代码参考了Flutter 类似物流的 时间轴 ListView 时间轴 - 简书 ，前排感谢。
使用的接口是阿里云的：易源数据-快递物流查询API接口，具体使用和一些细节打算专门再写一个博客。

效果图

先上效果图，手机截图略大，见谅

具体代码

直接看代码吧，讲解啥的都写在注释里了，有点啰嗦，想尽量讲的详细一点，莫怪莫怪
（吐槽一下CSDN居然没有dart语言的代码块，用Java将就看下吧）

import 'dart:convert';

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';

class DeliverInfoPage extends StatefulWidget{
   

  //从上一个页面传过来的快递单号
  String trackingNum;

  DeliverInfoPage(this.trackingNum);

  @override
  State<StatefulWidget> createState() {
   
    return DeliverInfoPageState(trackingNum);
  }
}

class DeliverInfoPageState extends State<DeliverInfoPage>{
   

  String trackingNum;
  //get请求获取的数据
  Map jsonMap;

  DeliverInfoPageState(this.trackingNum);

  @override
  void initState() {
   
    //NetInterface是自己封装的网络接口类，把项目中用到的接口都放在一起，便于管理
    //对于阿里云接口的具体使用看另一个帖子吧。毕竟不是所有人都用的这个，就不在这里展开了
    NetInterface.getDeliverInfo(trackingNum).then((response) {
   
//      print("getDeliverInfo=>"+response.toString());
      //jsonMap的具体格式请看阿里云API购买页面，本博最后也会贴出来
      jsonMap = json.decode(response.toString());
      setState(() {
    });
    }).catchError((response) {
   
      //ToastUtil也是封装的一个类，具体代码是：
      /*class ToastUtil{
        static void print(String msg){
          Fluttertoast.showToast(
          msg: msg,
          toastLength: Toast.LENGTH_SHORT,
          gravity: ToastGravity.CENTER,
          timeInSecForIosWeb: 1,
          );
        }
      }*/
      ToastUtil.print("出现错误，请重试");
      print("getDeliverInfo Error=>"+response.toString());
    });
  }

  @override
  Widget build(BuildContext context) {
   
    //因为这个项目是安卓和flutter混合开发，所以用了WillPopScope拦截退出事件
    return WillPopScope(
      child: Scaffold(
        appBar: AppBar(
          title: Text("物流追踪"),
          leading: IconButton(
              icon: Icon(Icons.arrow_back),
              onPressed: () {
   
                Navigator.pop(context);
              }
          ),
        ),
        //未获取到数据就居中显示加载图标
        body: jsonMap != null ?  buildBody(context) : showLoading(),
      ),
      onWillPop: (){
   
        Navigator.pop(context);
      },
    );
  }

  Widget buildBody(BuildContext context){
   
    return Column(
      children: <Widget>[
        Container(
          padding: EdgeInsets.fromLTRB(10, 0, 0, 0),
          width: double.infinity,
          color: Colors.white,
          height: 70,
          child: Container(
            margin: EdgeInsets.all(5),
            child: Row(
              children