AI 助理
备案控制台
开发者社区 开发与运维 文章 正文

ListView实现物流追踪

2016-03-24 1019
版权
版权声明：
本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《 阿里云开发者社区用户服务协议》和 《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写 侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。
简介： 版权声明：您好，转载请留下本人博客的地址，谢谢 https://blog.csdn.net/hongbochen1223/article/details/50969789 目前我的一个项目中需要物流追踪界面实现，我想到时候ListView来实现物流追踪界面。
版权声明：您好，转载请留下本人博客的地址，谢谢 https://blog.csdn.net/hongbochen1223/article/details/50969789

目前我的一个项目中需要物流追踪界面实现，我想到时候ListView来实现物流追踪界面。下面我们先来看一下界面实现的效果：

这里写图片描述

该效果完全是使用ListView来实现了，下面我们来看一下是如何实现的

（一）：布局ListView并编写Item布局

首先需要在布局上面编写ListView：

```
<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="match_parent"
tools:context="com.bobo.trace.MainActivity" >

<ListView 
    android:id="@+id/lv_trace"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
      android:divider="@drawable/trace_divider"
      android:dividerHeight="1dp"></ListView>

</RelativeLayout>

```

然后编写ListView的item布局：


    <?xml version="1.0" encoding="utf-8"?>
    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <RelativeLayout 
        android:id="@+id/rl_trace_item"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

         <View
            android:id="@+id/v_up_line"
            android:layout_width="2.5dp"
            android:layout_height="10dp"
            android:background="@color/mgrey"
            android:layout_marginLeft="22dp"></View>

        <ImageView 
            android:id="@+id/iv_state"
            android:layout_width="16dp"
            android:layout_height="16dp"
            android:src="@drawable/circle"
            android:layout_marginTop="10dp"
            android:layout_marginLeft="15dp"/>

        <TextView 
            android:id="@+id/tv_trace_info"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="10dp"
            android:layout_toRightOf="@id/iv_state"
            android:layout_marginLeft="20dp"
            android:text="@string/test_trace_info"
            android:textColor="@android:color/black"
            android:textSize="13sp"/>

        <LinearLayout 
            android:id="@+id/ll_trace_phone"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="3dp"
            android:layout_toRightOf="@id/iv_state"
            android:layout_marginLeft="20dp"
            android:orientation="horizontal"
            android:layout_below="@id/tv_trace_info">

           <TextView 
            android:id="@+id/tv_phone_label"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="@string/phone_label"
            android:textColor="@android:color/black"
            android:textSize="13sp"/>

            <TextView 
            android:id="@+id/tv_phone"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="5dp"
            android:text="@string/test_phone"
            android:textColor="@android:color/black"
            android:textSize="13sp"/>

        </LinearLayout>

        <TextView 
            android:id="@+id/tv_trace_time"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="3dp"
            android:layout_toRightOf="@id/iv_state"
            android:layout_marginLeft="20dp"
            android:text="@string/test_trace_info"
            android:textColor="@android:color/black"
            android:textSize="13sp"
            android:layout_below="@id/ll_trace_phone"/>



    <View
            android:id="@+id/v_down_line"
            android:layout_width="2.5dp"
            android:layout_height="45dp"
            android:background="@color/mgrey"
            android:layout_below="@id/iv_state"
            android:layout_marginLeft="22dp"></View>
    </RelativeLayout>

</RelativeLayout>

下面我们来看一下item效果：

这里写图片描述

在上面的效果图中，我们就可以看出，在这个item布局中，左边是”线-图片-线“的布局，显示一个时间轴，右边显示相应的信息，包括物流信息，联系电话和时间；我们知道，在时间轴中，第一个点是不需要上面那个线的，最后一个点是不需要下面那个线的，所以，这个的处理就需要我们在Adapter中进行相应的处理。

（二）：自定义Adapter

下面我们就需要自定义Adapter来填充数据和进行View处理。

当然，在编写Adapter之前，我们需要一个javabean来保存相应的信息。

Trace.java:


    package com.bobo.beans;

    public class Trace {

    private boolean isHead;
    private String info;
    private String phone;
    private String time;

    public Trace(boolean isHead, String info, String phone, String time) {
        super();
        this.isHead = isHead;
        this.info = info;
        this.phone = phone;
        this.time = time;
    }

    public boolean isHead() {
        return isHead;
    }

    public void setHead(boolean isHead) {
        this.isHead = isHead;
    }

    public String getInfo() {
        return info;
    }

    public void setInfo(String info) {
        this.info = info;
    }

    public String getPhone() {
        return phone;
    }

    public void setPhone(String phone) {
        this.phone = phone;
    }

    public String getTime() {
        return time;
    }

    public void setTime(String time) {
        this.time = time;
    }


}

下面我们就可以愉快的编写Adapter类了：


    package com.bobo.adapters;

    import java.util.ArrayList;

    import android.content.Context;
    import android.view.LayoutInflater;
    import android.view.View;
    import android.view.ViewGroup;
    import android.widget.BaseAdapter;
    import android.widget.ImageView;
    import android.widget.LinearLayout;
    import android.widget.TextView;

    import com.bobo.beans.Trace;
    import com.bobo.trace.R;

    public class TraceAdapter extends BaseAdapter {

    private ArrayList<Trace> tradeLists = null;
    private LayoutInflater inflater;
    private Context context;


    public TraceAdapter(ArrayList<Trace> tradeLists,Context context){
        this.tradeLists = tradeLists;
        this.context = context;
        this.inflater = LayoutInflater.from(context);
    }

    @Override
    public int getCount() {
        // TODO Auto-generated method stub
        return tradeLists == null ? 0 : tradeLists.size();
    }

    @Override
    public Object getItem(int position) {
        // TODO Auto-generated method stub
        return tradeLists.get(position);
    }

    @Override
    public long getItemId(int position) {
        // TODO Auto-generated method stub
        return position;
    }

    @Override
    public View getView(int position, View convertView, ViewGroup parent) {
        Holder holder;

        if(convertView == null){
            convertView = inflater.inflate(R.layout.trace_item, null);
            holder = new Holder();

            holder.v_up_line = (View)convertView.findViewById(R.id.v_up_line);
            holder.iv_state = (ImageView)convertView.findViewById(R.id.iv_state);
            holder.tv_trace_info = (TextView)convertView.findViewById(R.id.tv_trace_info);
            holder.ll_trace_phone = (LinearLayout)convertView.findViewById(R.id.ll_trace_phone);
            holder.tv_phone = (TextView)convertView.findViewById(R.id.tv_phone);
            holder.tv_trace_time = (TextView)convertView.findViewById(R.id.tv_trace_time);
            holder.v_down_line = (View)convertView.findViewById(R.id.v_down_line);

            convertView.setTag(holder);
        }else{
            holder = (Holder)convertView.getTag();
        }

        if(tradeLists.get(position).isHead()){
            holder.v_up_line.setVisibility(View.GONE);
            //holder.iv_state = (ImageView)convertView.findViewById(R.id.iv_state);
            holder.tv_trace_info.setText(tradeLists.get(position).getInfo());

            holder.tv_phone.setText(tradeLists.get(position).getPhone());
            holder.tv_trace_time.setText(tradeLists.get(position).getTime());
            holder.v_down_line.setVisibility(View.VISIBLE);
        }else if(tradeLists.size() == (position+1)){
            holder.tv_trace_info.setText(tradeLists.get(position).getInfo());
            holder.ll_trace_phone.setVisibility(View.GONE);
            holder.tv_trace_time.setText(tradeLists.get(position).getTime());
            holder.v_down_line.setVisibility(View.GONE);
        }else{
            holder.tv_trace_info.setText(tradeLists.get(position).getInfo());
            holder.ll_trace_phone.setVisibility(View.GONE);
            holder.tv_trace_time.setText(tradeLists.get(position).getTime());
            holder.v_down_line.setVisibility(View.VISIBLE);
        }


        return convertView;
    }

    class Holder{
        View v_up_line;
        ImageView iv_state;
        TextView tv_trace_info;
        LinearLayout ll_trace_phone;
        TextView tv_phone;
        TextView tv_trace_time;
        View v_down_line;
    }

}

这样，我们的Adapter就已经适配完成，下面我们在Activity中实验一下。

（三）：Activity实验：


    package com.bobo.trace;

    import java.util.ArrayList;

    import android.app.Activity;
    import android.content.Context;
    import android.os.Bundle;
    import android.widget.ListView;

    import com.bobo.adapters.TraceAdapter;
    import com.bobo.beans.Trace;


    public class MainActivity extends Activity {

    private ListView lv_trace;
    private ArrayList<Trace> tradeLists = new ArrayList<Trace>();
    private TraceAdapter ta;

    private Context context;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        context = MainActivity.this;

        initView();

    }

    private void initView(){
        lv_trace = (ListView)findViewById(R.id.lv_trace);
        initData();

        ta = new TraceAdapter(tradeLists, context);
        lv_trace.setAdapter(ta);
    }

    private void initData(){

        tradeLists.add(new Trace(true, "商家已从广东发货", "15253157943", "2016-03-16 13:30:43"));
        tradeLists.add(new Trace(false, "货物正在配送", "", "2016-03-16 18:30:43"));
        tradeLists.add(new Trace(false, "货物已到达天津转运中心", "", "2016-03-17 13:30:43"));
        tradeLists.add(new Trace(false, "货品已到济南货运站", "", "2016-03-18 13:30:43"));
        tradeLists.add(new Trace(false, "货物已送达济南高新区站点", "", "2016-03-19 13:30:43"));
    }
}

这样运行之后，我们就会发现，ListView的selector宽度是占满全屏的，这样，我们就需要编写一个inset来调整ListView的selector。

trace_divider.xml:


    <?xml version="1.0" encoding="utf-8"?>
    <inset xmlns:android="http://schemas.android.com/apk/res/android" 
         android:insetLeft="50dp"
         android:drawable="@color/mgrey">


    </inset>

这样，我们的物流追踪界面就算是完成了，很简单。

文章标签：
Android开发
陈洪波
目录
相关文章
BNTang
|
SQL
TienChin 渠道管理-渠道页面完善
TienChin 渠道管理-渠道页面完善
BNTang
47 0
1941623231718325
|
3月前
|
传感器 存储 安全
智能标签：物品追踪与管理的革新
【10月更文挑战第19天】智能标签技术通过集成RFID、二维码和传感器等技术，实现了物品的高效追踪与管理，广泛应用于物流、零售、医疗、交通和工业等领域，正引领物品管理的革新。本文探讨其原理、技术、应用及未来趋势。
1941623231718325
88 2
clicksun
|
5月前
|
存储 供应链
点晴WMS实现物料高效流转与追溯
点晴WMS系统通过集成先进的信息技术和自动化设备，实现了物料的高效流转和追溯。以下将详细介绍点晴WMS在物料高效流转和追溯方面的具体实现方法和优势。
clicksun
53 0
泥腿子架构师
|
7月前
|
存储 前端开发 Java
实现实时追踪的返利App系统设计
实现实时追踪的返利App系统设计
泥腿子架构师
65 0
AokSend接口-API
|
8月前
EDM营销平台有哪些？Top5平台分析
探索五大热门EDM营销平台：蜂邮EDM以其丰富功能备受喜爱；Constant Contact以用户友好体验著称；Sendinblue结合短信营销与广告管理，适合中小企业；GetResponse提供营销自动化解决方案，适合各类企业；AokSend以其历史底蕴和分析工具吸引用户。各平台特色各异，企业可根据需求选择。
AokSend接口-API
276 1
高端源码库
|
8月前
|
监控 安全 5G
UWB人员精准定位系统源码，实现实时定位、人机料配对、物料标签配置、智慧调度、轨迹追踪
人员定位管理系统通过在厂区、车间部署UWB定位基站，实时采集人员、机具、物料上定位标签回传的位置信息数据，采用多维定位模式，精确定位人、机具、物料的实时位置，实现实时定位、人机料配对、物料标签配置、智慧调度、轨迹追踪、工时统计、区域物料统计、电子围栏等应用功能。
高端源码库
135 1
BNTang
|
Java
TienChin 渠道管理-添加渠道
TienChin 渠道管理-添加渠道
BNTang
75 0
BNTang
|
前端开发
TienChin 渠道管理-渠道类型
在上一篇文章当中，表里面有一个渠道类型，我们这节主要是将这个渠道类型创建好，首先我们来看看字典表。
BNTang
77 0
技术小达人
|
存储 分布式计算 前端开发
淘宝widget链路方案总结
目前widget生态已经做了大量的基建工作,同时在widget生态的演进过程中我们发现如何匹配用户的偏好一直以来是一个挑战工作，本文介绍了widget的整体链路。
技术小达人
265 0
高端源码库
|
安全 前端开发 数据挖掘
不良事件上报系统源码，多维度多样式的统计分析图表
商业级源码。不良事件上报系统是医疗机构自愿报告医疗安全不良事件的信息平台，具有非具名、非惩罚性质。管理员可通过对上报信息的研究分析，向医疗机构提出医疗安全警示和改进建议，以增强医院识别、处理安全隐患和预防不良事件发生的能力，从而实现安全医疗的目标。
高端源码库
164 0
不良事件上报系统源码，多维度多样式的统计分析图表