Android仿淘宝物流追踪的实例代码

概述今天跟大家聊聊我心目中的物流追踪效果，效果图如下，有需要的朋友，可以直接带走，实现也没有想象中的那么复杂，特别是左边那个时间轴线，没那么复杂

今天跟大家聊聊我心目中的物流追踪效果，效果图如下，有需要的朋友，可以直接带走，实现也没有想象中的那么复杂，特别是左边那个时间轴线，没那么复杂

拿到这个图，大家首先想到的是这是一个RecyclerVIEw来实现，可能比较疑惑的地方是那个红色的小圆点和灰色的小圆点，以及穿过圆点之间的那条竖线，最重要的是竖线的高度还是自适应的，并不是固定高度，老铁，自己说，有没有戳中你的痛点，要是能把这个时间轴线的问题解决了，你也可以说我上我也行。

看了网上的，有人说要什么自定义view啦，又是绘制，又是测量，其实没那么复杂，下面说说我是怎么解决的。想了想,可以各个vIEw的相对位置来实现啊,比如,那个圆点也可以用imagevIEw实现啊,唯一不同的就是竖线的vIEw是穿过灰色的圆vIEw的,大家有没有发现，除了第一个圆点意外的其他圆点，都是在那条水平的分割线下固定高度的位置（我这里好像是10dp）的左侧 ，那我完全可以在这个分割线下方弄一个空的VIEw，那么穿过圆孔的这条竖线不就是在这个空的VIEw的上方，在圆点的下方，并且高度是match，这样，通过一个相对布局，这个时间轴的问题也解决了

item_trace

<?xml version="1.0" enCoding="utf-8"?><relativeLayout xmlns:androID="http://schemas.androID.com/apk/res/androID"  xmlns:tools="http://schemas.androID.com/tools"  androID:layout_wIDth="match_parent"  androID:layout_height="wrap_content"  androID:background="#ffffff">  <ImageVIEw    androID:ID="@+ID/dot_iv"    androID:layout_wIDth="wrap_content"    androID:layout_height="wrap_content"    androID:layout_marginStart="15dp"    androID:contentDescription="@null"    androID:scaleType="centerCrop"    androID:src="@mipmap/dot_red" />  <!--快件接收站点-->  <TextVIEw    androID:ID="@+ID/accept_station_tv"    androID:layout_wIDth="wrap_content"    androID:layout_height="wrap_content"    androID:layout_aligntop="@ID/dot_iv"    androID:layout_marginEnd="15dp"    androID:layout_marginStart="15dp"    androID:layout_toEndOf="@ID/dot_iv"    androID:textcolor="#666666"    androID:textSize="14sp"    tools:text="快件已从杭州中转部发出" />  <!--快件接收时间-->  <TextVIEw    androID:ID="@+ID/accept_time_tv"    androID:layout_wIDth="wrap_content"    androID:layout_height="wrap_content"    androID:layout_alignStart="@ID/accept_station_tv"    androID:layout_below="@ID/accept_station_tv"    androID:layout_marginEnd="15dp"    androID:layout_margintop="10dp"    androID:textcolor="#999999"    androID:textSize="12sp"    tools:text="2017-05-15 10:59:04" />  <!--分割线-->  <VIEw    androID:ID="@+ID/divIDer_line_vIEw"    androID:layout_wIDth="match_parent"    androID:layout_height="1dp"    androID:layout_alignStart="@ID/accept_time_tv"    androID:layout_below="@ID/accept_time_tv"    androID:layout_marginBottom="15dp"    androID:layout_margintop="15dp"    androID:background="#eeeeee" />  <VIEw    androID:ID="@+ID/empty_vIEw"    androID:layout_wIDth="1dp"    androID:layout_height="1dp"    androID:layout_below="@ID/divIDer_line_vIEw"    androID:layout_marginStart="15dp" />  <!--时间轴的竖线-->  <VIEw    androID:ID="@+ID/time_line_vIEw"    androID:layout_wIDth="1dp"    androID:layout_height="match_parent"    androID:layout_above="@ID/empty_vIEw"    androID:layout_alignStart="@ID/dot_iv"    androID:layout_below="@ID/dot_iv"    androID:layout_marginStart="7dp"    androID:background="#eeeeee" /></relativeLayout>

MainActivity

package com.zx.logisticsdemo;import androID.os.Bundle;import androID.support.v7.app.AppCompatActivity;import androID.support.v7.Widget.linearlayoutmanager;import androID.support.v7.Widget.OrIEntationHelper;import androID.support.v7.Widget.RecyclerVIEw;import java.util.ArrayList;import java.util.List;/** * 仿淘宝物流追踪效果 */public class MainActivity extends AppCompatActivity {  private RecyclerVIEw traceRv; //物流追踪列表  private List<Trace> mTraceList; //物流追踪列表的数据源  private TraceAdapter mAdapter;  @OverrIDe  protected voID onCreate(Bundle savedInstanceState) {    super.onCreate(savedInstanceState);    setContentVIEw(R.layout.activity_main);    initData();    initRecyclerVIEw();  }  //加载物流信息的数据，这里是模拟一些假数据  private voID initData() {    mTraceList = new ArrayList<>();    mTraceList.add(new Trace(0,"2017年6月18日 上午12:04:01","在湖北武汉洪山区光谷公司长江社区便民服务站进行签收扫描，快件已被 已签收 签收"));    mTraceList.add(new Trace(1,"2017年6月18日 上午11:57:25","在湖北武汉洪山区光谷公司长江社区便民服务站进行派件扫描；派送业务员：老王；联系电话：17786550311在湖北武汉洪山区光谷公司长江社区便民服务站进行派件扫描；派送业务员：老王；联系电话：17786550311"));    mTraceList.add(new Trace(1,"2017年6月17日 下午4:43:29","在湖北武汉洪山区光谷公司进行快件扫描，将发往：湖北武汉洪山区光谷公司长江社区便民服务站"));    mTraceList.add(new Trace(1,"2017年6月17日 上午9:11:21","从湖北武汉分拨中心发出，本次转运目的地：湖北武汉洪山区光谷公司"));    mTraceList.add(new Trace(1,"2017年6月17日 上午1:53:14","在湖南长沙分拨中心进行装车扫描，即将发往：湖北武汉分拨中心"));    mTraceList.add(new Trace(1,"2017年6月17日 上午1:50:18","在分拨中心湖南长沙分拨中心进行称重扫描"));    mTraceList.add(new Trace(1,"2017年6月16日 上午11:27:58","在湖南隆回县公司进行到件扫描"));  }  //初始化显示物流追踪的RecyclerVIEw  private voID initRecyclerVIEw() {    traceRv = (RecyclerVIEw) findVIEwByID(R.ID.traceRv);    linearlayoutmanager layoutManager = new linearlayoutmanager(this,OrIEntationHelper.VERTICAL,false);    mAdapter = new TraceAdapter(this,mTraceList);    traceRv.setLayoutManager(layoutManager);    traceRv.setAdapter(mAdapter);  }}

Adapter

package com.zx.logisticsdemo;import androID.content.Context;import androID.support.v7.Widget.RecyclerVIEw;import androID.vIEw.LayoutInflater;import androID.vIEw.VIEw;import androID.vIEw.VIEwGroup;import androID.Widget.ImageVIEw;import androID.Widget.TextVIEw;import java.util.List;/** * 追踪物流列表的适配器 * <p> * 作者： 周旭 on 2017/5/24/0024. */public class TraceAdapter extends RecyclerVIEw.Adapter<TraceAdapter.TraceVIEwHolder> {  private static final int TYPE_CURR = 0; //当前  private static final int TYPE_norMAL = 1; //历史记录  private Context mContext;  private List<Trace> mList;  private LayoutInflater inflater;  public TraceAdapter(Context mContext,List<Trace> mList) {    this.mContext = mContext;    this.mList = mList;    inflater = (LayoutInflater) mContext.getSystemService(Context.LAYOUT_INFLATER_SERVICE);  }  @OverrIDe  public int getItemCount() {    return mList.size();  }  @OverrIDe  public TraceVIEwHolder onCreateVIEwHolder(VIEwGroup parent,int vIEwType) {    return new TraceVIEwHolder(inflater.inflate(R.layout.item_trace,parent,false));  }  @OverrIDe  public voID onBindVIEwHolder(TraceVIEwHolder holder,int position) {    //设置相关数据    Trace trace = mList.get(position);    int type = trace.getType();    if (type == TYPE_CURR) {      holder.acceptStationTv.setTextcolor(mContext.getResources().getcolor(R.color.color_c03));      holder.dotIv.setimageResource(R.mipmap.dot_red);    } else if (type == TYPE_norMAL) {      holder.acceptStationTv.setTextcolor(mContext.getResources().getcolor(R.color.color_6));      holder.dotIv.setimageResource(R.mipmap.dot_black);    }    holder.acceptTimeTv.setText(trace.getAcceptTime());    holder.acceptStationTv.setText(trace.getAcceptStation());    if (position == mList.size() - 1) {      //最后一条数据，隐藏时间轴的竖线和水平的分割线      holder.timelineVIEw.setVisibility(VIEw.INVISIBLE);      holder.divIDerlineVIEw.setVisibility(VIEw.INVISIBLE);    }  }  public class TraceVIEwHolder extends RecyclerVIEw.VIEwHolder {    private TextVIEw acceptTimeTv; //接收时间    private TextVIEw acceptStationTv; //接收地点    private ImageVIEw dotIv; //当前位置    private VIEw divIDerlineVIEw; //时间轴的竖线    private VIEw timelineVIEw; //水平的分割线    public TraceVIEwHolder(VIEw itemVIEw) {      super(itemVIEw);      acceptTimeTv = (TextVIEw) itemVIEw.findVIEwByID(R.ID.accept_time_tv);      acceptStationTv = (TextVIEw) itemVIEw.findVIEwByID(R.ID.accept_station_tv);      dotIv = (ImageVIEw) itemVIEw.findVIEwByID(R.ID.dot_iv);      divIDerlineVIEw = itemVIEw.findVIEwByID(R.ID.divIDer_line_vIEw);      timelineVIEw = itemVIEw.findVIEwByID(R.ID.time_line_vIEw);    }  }}

github地址（欢迎下载完整Demo）:https://github.com/zhouxu88/LogisticsDemo

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持编程小技巧。

总结

以上是内存溢出为你收集整理的Android仿淘宝物流追踪的实例代码全部内容，希望文章能够帮你解决Android仿淘宝物流追踪的实例代码所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。