物流信息頁面實現(xiàn)方式比伏，根據(jù)具體頁面修改 畏线。

image.png

使用

   SliverList(
            delegate: SliverChildBuilderDelegate((context, index) {
            return LogisticsDetaislWidget(position: index,maxCount: 4,);
        },childCount: 4)),

實現(xiàn) 根據(jù)具體頁面可以修改

import 'package:flutter/material.dart';
import 'package:zhengda_health/app/custom_widgets/custom_text.dart';
import 'package:zhengda_health/app/support/app_color.dart';
class LogisticsDetaislWidget extends StatelessWidget {
  final int position;
  final int maxCount;
  LogisticsDetaislWidget({Key key,this.position =1,this.maxCount}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Container(
      margin: EdgeInsets.only(left: 20,right: 20),
      padding: EdgeInsets.only(left: 20,right: 20,bottom: 0),
      decoration: BoxDecoration(
        color: Colors.white,
          borderRadius: BorderRadius.only(
              bottomRight: Radius.circular(_last()? 12 : 0),
              bottomLeft: Radius.circular(_last()? 12 : 0))
      ),
      child:Stack(
        alignment: Alignment.centerLeft,
        children: [
          Padding(
            padding: EdgeInsets.only(left: 30,bottom: 30),
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Row(
                  children: [
                    CustomText('派送中',fontSize:14 ,isBold: true,),
                    SizedBox(width: 11,),
                    CustomText('07-06 21:12',fontSize:12 ,),
                  ],
                ),
                SizedBox(height: 4,),
                CustomText('浙江杭州濱江公司】的派件員【馬湖C】正在為您 派件穆咐，如有疑問請聯(lián)系派件員耕陷，聯(lián)系電話 【18667029058】',
                    fontSize: 13,
                    maxLines: null,
                    color:
                        _firstTwo() ? Colors.black : AppColor.a2Color),
              ],
            ),
          ),
          Positioned(
            left: 0,
            top: 0,
            bottom: 0,
            child: Column(
              children: [
                _pointWidget(
                    _firstTwo() ? AppColor.themeColor : AppColor.back37
                ),
                _last() ? Container() : Expanded(
                    child: _lineWidget((position == 0)
                        ? AppColor.themeColor
                        : AppColor.back37))
              ],
            ),
          ),
        ],
      ),
    );
  }

  //最后一個
  bool _last(){
    return  position == maxCount - 1 ? true : false ;
  }

  //前兩個
  bool _firstTwo(){
    return (position ==0 || position ==1) ? true : false;
  }

  Widget _lineWidget(Color color){
    return Container(
      width: 1,
      color: color,
    );
  }

  Widget _pointWidget(Color color){
    return Container(
      width: 12,
      height: 12,
      decoration: BoxDecoration(
        borderRadius: BorderRadius.circular(6),
        color: color,
      ),
    );
  }
}