美文网首页
RecycleView实现时间轴

RecycleView实现时间轴

作者: Y小圆脸 | 来源:发表于2017-07-04 18:05 被阅读140次

在activity中定义一个RecycleView,主要在adapter和item布局实现类似时间轴效果

  • 定义item布局

      <?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:gravity="center"
          android:orientation="horizontal">
      
          <RelativeLayout
              android:id="@+id/rlTimeline"
              android:layout_width="32dp"
              android:layout_height="match_parent">
      
              <TextView
                  android:id="@+id/tvTopLine"
                  android:layout_width="0.5dp"
                  android:layout_height="12dp"
                  android:layout_centerHorizontal="true"
                  android:background="#999" />
      
              <TextView
                  android:id="@+id/tvDot"
                  android:layout_width="5dp"
                  android:layout_height="5dp"
                  android:layout_below="@id/tvTopLine"
                  android:layout_centerHorizontal="true"
                  android:background="@drawable/timelline_dot_normal" />
      
              <TextView
                  android:layout_width="0.5dp"
                  android:layout_height="match_parent"
                  android:layout_below="@id/tvDot"
                  android:layout_centerHorizontal="true"
                  android:background="#999" />
          </RelativeLayout>
      
          <RelativeLayout
              android:id="@+id/rlCenter"
              android:layout_width="match_parent"
              android:layout_height="match_parent"
              android:paddingBottom="6dp"
              android:paddingRight="10dp"
              android:paddingTop="6dp">
      
              <TextView
                  android:id="@+id/tvAcceptTime"
                  android:layout_width="wrap_content"
                  android:layout_height="wrap_content"
                  android:text="2014/06/24 20:55:28"
                  android:textColor="#999"
                  android:textSize="12sp" />
      
              <TextView
                  android:id="@+id/tvAcceptStation"
                  android:layout_width="wrap_content"
                  android:layout_height="wrap_content"
                  android:layout_below="@id/tvAcceptTime"
                  android:layout_marginTop="5dp"
                  android:text="快件在 深圳 ,准备送往下一站 深圳集散中心 [深圳市]"
                  android:textColor="#999"
                  android:textSize="12sp" />
          </RelativeLayout>
      </LinearLayout>
    
  • 定义实体类数据

      package com.example.a070.demo.bean;
    
      /**
       * Created by 070 on 2017/7/4.
       */
      
      public class Trace {
          /** 时间 */
          private String acceptTime;
          /** 描述 */
          private String acceptStation;
      
          public Trace() {
          }
      
          public Trace(String acceptTime, String acceptStation) {
              this.acceptTime = acceptTime;
              this.acceptStation = acceptStation;
          }
      
          public String getAcceptTime() {
              return acceptTime;
          }
      
          public void setAcceptTime(String acceptTime) {
              this.acceptTime = acceptTime;
          }
      
          public String getAcceptStation() {
              return acceptStation;
          }
      
          public void setAcceptStation(String acceptStation) {
              this.acceptStation = acceptStation;
          }
      }
    
  • 定义圆点

timelline_dot_first.xml

    <?xml version="1.0" encoding="utf-8"?>
    <shape xmlns:android="http://schemas.android.com/apk/res/android"
        android:shape="oval">
        <size
            android:width="10dp"
            android:height="10dp" />
        <solid android:color="#555555" />
    </shape>

定义timelline_dot_normal.xml

    <?xml version="1.0" encoding="utf-8"?>
    <shape xmlns:android="http://schemas.android.com/apk/res/android"
        android:shape="oval">
    
        <size
            android:width="10dp"
            android:height="10dp" />
        <solid android:color="#999999" />
    </shape>
  • 定义adapter
    public class TraceListAdapter extends RecyclerView.Adapter<RecyclerView.ViewHolder> {
    
        private LayoutInflater inflater;
        private List<Trace> traceList = new ArrayList<>(1);
        private static final int TYPE_TOP = 0x0000;
        private static final int TYPE_NORMAL = 0x0001;
    
    
        public TraceListAdapter(Context context, List<Trace> traceList) {
            inflater = LayoutInflater.from(context);
            this.traceList = traceList;
        }
    
        @Override
        public RecyclerView.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
            return new ViewHolder(inflater.inflate(R.layout.item_timeline, parent, false));
        }
    
        @Override
        public void onBindViewHolder(RecyclerView.ViewHolder holder, int position) {
            ViewHolder itemHolder = (ViewHolder) holder;
            if (getItemViewType(position) == TYPE_TOP) {
                // 第一行头的竖线不显示
                itemHolder.tvTopLine.setVisibility(View.INVISIBLE);
                // 字体颜色加深
                itemHolder.tvAcceptTime.setTextColor(0xff555555);
                itemHolder.tvAcceptStation.setTextColor(0xff555555);
                itemHolder.tvDot.setBackgroundResource(R.drawable.timelline_dot_first);
            } else if (getItemViewType(position) == TYPE_NORMAL) {
                itemHolder.tvTopLine.setVisibility(View.VISIBLE);
                itemHolder.tvAcceptTime.setTextColor(0xff999999);
                itemHolder.tvAcceptStation.setTextColor(0xff999999);
                itemHolder.tvDot.setBackgroundResource(R.drawable.timelline_dot_normal);
            }
    
            itemHolder.bindHolder(traceList.get(position));
        }
    
        @Override
        public int getItemViewType(int position) {
            if (position == 0) {
                return TYPE_TOP;
            }
            return TYPE_NORMAL;
        }
    
        @Override
        public int getItemCount() {
            return traceList.size();
        }
        public  class ViewHolder extends RecyclerView.ViewHolder {
            private TextView tvAcceptTime, tvAcceptStation;
            private TextView tvTopLine, tvDot;
            public ViewHolder(View itemView) {
                super(itemView);
                tvAcceptTime = (TextView) itemView.findViewById(R.id.tvAcceptTime);
                tvAcceptStation = (TextView) itemView.findViewById(R.id.tvAcceptStation);
                tvTopLine = (TextView) itemView.findViewById(R.id.tvTopLine);
                tvDot = (TextView) itemView.findViewById(R.id.tvDot);
            }
    
            public void bindHolder(Trace trace) {
                tvAcceptTime.setText(trace.getAcceptTime());
                tvAcceptStation.setText(trace.getAcceptStation());
            }
        }
    }
  • java代码实现

              public class TimeLineActivity extends AppCompatActivity {
      
      
          private List<Trace> traceList = new ArrayList<>(10);
          private TraceListAdapter adapter;
          private RecyclerView rvTrace;
      
      
          @Override
          protected void onCreate(Bundle savedInstanceState) {
              super.onCreate(savedInstanceState);
              setContentView(R.layout.activity_time_line);
              rvTrace = (RecyclerView) findViewById(R.id.rvTrace);
              initData();
          }
          private void initData() {
              // 模拟一些假的数据
              traceList.add(new Trace("2016-05-25 17:48:00", "[沈阳市] [沈阳和平五部]的派件已签收 感谢使用中通快递,期待再次为您服务!"));
              traceList.add(new Trace("2016-05-25 14:13:00", "[沈阳市] [沈阳和平五部]的东北大学代理点正在派件 电话:18040xxxxxx 请保持电话畅通、耐心等待"));
              traceList.add(new Trace("2016-05-25 13:01:04", "[沈阳市] 快件到达 [沈阳和平五部]"));
              traceList.add(new Trace("2016-05-25 12:19:47", "[沈阳市] 快件离开 [沈阳中转]已发往[沈阳和平五部]"));
              traceList.add(new Trace("2016-05-25 11:12:44", "[沈阳市] 快件到达 [沈阳中转]"));
              traceList.add(new Trace("2016-05-24 03:12:12", "[嘉兴市] 快件离开 [杭州中转部]已发往[沈阳中转]"));
              traceList.add(new Trace("2016-05-23 21:06:46", "[杭州市] 快件到达 [杭州汽运部]"));
              traceList.add(new Trace("2016-05-23 18:59:41", "[杭州市] 快件离开 [杭州乔司区]已发往[沈阳]"));
              traceList.add(new Trace("2016-05-23 18:35:32", "[杭州市] [杭州乔司区]的市场部已收件 电话:18358xxxxxx"));
              adapter = new TraceListAdapter(this, traceList);
              rvTrace.setLayoutManager(new LinearLayoutManager(this));
              rvTrace.setAdapter(adapter);
          }
      
      }
    

相关文章

网友评论

      本文标题:RecycleView实现时间轴

      本文链接:https://www.haomeiwen.com/subject/zspxhxtx.html