▲ 实现一个简单的快递时间轴效果

▲ 实现一个简单的快递时间轴效果

用RecycleView实现的时间轴效果。
先看一下效果
在这里插入图片描述
【实现思路】

使用一个RecycleView,在item中分成两个部分一部分画这个线,另一部分显示功能布局。其实没有什么难度,重点就在于xml布局中了

【XML代码】

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

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="198dp">

        <RelativeLayout
            android:id="@+id/rl_left"
            android:layout_width="20dp"
            android:layout_height="match_parent"
            android:layout_marginLeft="10dp">

            <TextView
                android:id="@+id/tv_line_a"
                android:layout_width="1px"
                android:layout_height="24dp"
                android:layout_centerHorizontal="true"
                android:background="#ccc" />

            <ImageView
                android:id="@+id/iv_tag"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_centerHorizontal="true"
                android:layout_marginTop="24dp"
                android:src="@mipmap/icon_a" />

            <TextView
                android:id="@+id/tv_line"
                android:layout_width="1px"
                android:layout_height="match_parent"
                android:layout_below="@+id/iv_tag"
                android:layout_centerHorizontal="true"
                android:layout_marginTop="-1dp"
                android:background="#ccc" />
        </RelativeLayout>

        <LinearLayout

            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="8dp"
            android:layout_marginRight="26dp"
            android:layout_toRightOf="@+id/rl_left"
            android:background="@mipmap/icon_bg"
            android:orientation="vertical">

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginLeft="20dp"
                android:layout_marginTop="20dp"
                android:text="商家同意退款"
                android:textColor="#333"
                android:textSize="18sp" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginLeft="20dp"
                android:layout_marginTop="4dp"
                android:text="4天23小时56分 后系统自动退款"
                android:textColor="#999999"
                android:textSize="12sp" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginLeft="20dp"
                android:layout_marginTop="10dp"
                android:text="收货人:平平"
                android:textColor="#666"
                android:textSize="14sp" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginLeft="20dp"
                android:layout_marginTop="4dp"
                android:text="联系电话:1392XXXXX"
                android:textColor="#666"
                android:textSize="14sp" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginLeft="20dp"
                android:layout_marginTop="8dp"
                android:layout_marginBottom="10dp"
                android:text="2019-08-11 11:36:47"
                android:textColor="#999"
                android:textSize="12sp" />

        </LinearLayout>
    </RelativeLayout>
</LinearLayout>

【业务代码】

public class TimeAdapter extends RecyclerView.Adapter<TimeAdapter.ViewHolderX> {
    private Context mContext;
    private List<String> mList;

    public TimeAdapter(Context context, List<String> list) {
        this.mContext = context;
        this.mList = list;
    }

    @NonNull
    @Override
    public TimeAdapter.ViewHolderX onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
        View inflate = LayoutInflater.from(mContext).inflate(R.layout.item_recycler_list, parent, false);
        ViewHolderX viewHoldX = new ViewHolderX(inflate);
        return viewHoldX;
    }

    @Override
    public void onBindViewHolder(@NonNull TimeAdapter.ViewHolderX holder, int position) {
        if (position==0){
            holder.ivTag.setImageResource(R.mipmap.icon_b);
            holder.tvLine_a.setVisibility(View.GONE);
        }else {
            holder.ivTag.setImageResource(R.mipmap.icon_a);
            holder.tvLine_a.setVisibility(View.VISIBLE);
        }

    }

    @Override
    public int getItemCount() {
        return mList == null ? 0 : mList.size();
    }

    class ViewHolderX extends RecyclerView.ViewHolder {

          TextView tvLine_a;
          TextView tvLine;
          ImageView ivTag;

        public ViewHolderX(@NonNull View itemView) {
            super(itemView);
            tvLine_a = itemView.findViewById(R.id.tv_line_a);
            tvLine = itemView.findViewById(R.id.tv_line);
            ivTag = itemView.findViewById(R.id.iv_tag);
        }
    }
}

可根据自己公司的业务更换Adapter,完善业务。

[希望这篇文章可以帮到你]

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/2834.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • PhpSpreadsheet_phpquery手册

    PhpSpreadsheet_phpquery手册phpexcel导出PhpSpreadsheet详解引入正确的文件并实例化usePhpOffice\PhpSpreadsheet\Spreadsheet;$spreadsheet=newSpreadsheet();$worksheet=$spreadsheet->getActiveSheet();赋值//给A2赋值hello$worksheet->…

    2022年9月17日
    3
  • myeclipse jdbc连接mysql数据库_怎样把navicat连接到eclipse

    myeclipse jdbc连接mysql数据库_怎样把navicat连接到eclipse解决Eclipse通过JDBC连接MySQL数据库遇到的问题。包括EstablishingSSLconnectionwithoutserver’sidentityverificationis…警告和Theservertimezonevalueisunrecognized警告

    2022年9月10日
    3
  • STM32 看门狗和嘀嗒定时器

    STM32 看门狗和嘀嗒定时器看门狗一个定时器,独立的定时器,对单片机CPU进行监控,一旦CPU的程序出现错误,或者电压过低使单片机出现任何意外情况,看门狗就会给单片机复位使单片机回到初始状态。单片机就会从错误中脱离出来。看门狗–是一个定时器,供能–计数。每隔一段时间就喂狗–计数清零,重新计时,程序出错不能喂狗,得复位。独立看门狗独立看门狗是基于一个12位的递减计数器和一个8位的预分频器。他有一个内部独立的40KHz的RC振荡器提供时钟;因为这个RC振荡器独立于主时钟,所以他可运行于停机和待机模式。它可以被当成看门狗用于在发生问

    2022年5月26日
    46
  • web前端表单制作_注册表单测试用例

    web前端表单制作_注册表单测试用例03- web表单测试

    2022年4月22日
    57
  • linux时间戳转换成时间指令_时间戳转换公式

    linux时间戳转换成时间指令_时间戳转换公式原文地址:http://wanping.blogbus.com/logs/28663569.html1、时间戳转换为正常显示的时间格式Freebsd系统下:转换命令为:date-r1112173761    或者:date-r1112173761+”%Y-%m-%d%T%z”(年月日的格式不一样)Linux系统下:转换

    2022年10月2日
    5
  • html怎么使表格居中,html怎么使表格居中[通俗易懂]

    html怎么使表格居中,html怎么使表格居中[通俗易懂]回答:HTML中两个表格间的距离调整有两种适合微调的办法:1.设置第一个tbale的margin-bottom属性。例如:表示table表格底部保持100px间距。2.设置第二个tbale的margin-top属性。例如:表示table表格顶部保持100px间距。扩展知识margin属性可以单独改变元素(元素可以是表格或者DIV)的上,下,左,右边距。也可以一次改变所有的属性。margin属性…

    2022年9月19日
    5

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号