Android TimeLine 时间节点轴的实现实例代码

整理文档，搜刮出一个Android TimeLine 时间节点轴的实现实例代码，稍微整理精简一下做下分享。

效果图

具体实现 (RecyclerView)

1.Adapter

package com.haoren.timeline;

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;

/**
 * Created by Hh on 2017/3/8.
 */
public class TimeLineAdapter extends RecyclerView.Adapter<TimeLineAdapter.HorizontalVh> {

  private Context context;

  //时间节点数
  private int nodeNum = 0;

  //当前到达节点
  private int currentNode = 1;

  public TimeLineAdapter(Context context, int nodeNum) {
    this.context = context;
    this.nodeNum = nodeNum;
  }

  @Override
  public HorizontalVh onCreateViewHolder(ViewGroup parent, int viewType) {
    View view = LayoutInflater.from(context).inflate(R.layout.time_line, null, false);
    HorizontalVh vh = new HorizontalVh(view);
    return vh;
  }

  @Override
  public void onBindViewHolder(HorizontalVh holder, int position) {
    if (position < currentNode) {
      //当前节点之前的全部设为已经经过
      holder.point.setImageResource(R.mipmap.point_select);
      holder.lineLeft.setBackgroundResource(R.color.colorPrimary);
      holder.lineRight.setBackgroundResource(R.color.colorPrimary);
    }

    // 去掉左右两头的分支
    if (position == 0) {
      holder.lineLeft.setVisibility(View.INVISIBLE);
    }
    if (position == nodeNum - 1) {
      holder.lineRight.setVisibility(View.INVISIBLE);
    }
  }

  @Override
  public int getItemCount() {
    return nodeNum;
  }

  /**
   * 设置当前节点
   * @param currentNode
   */
  public void setCurrentNode(int currentNode) {
    this.currentNode = currentNode;
    this.notifyDataSetChanged();
  }

  class HorizontalVh extends RecyclerView.ViewHolder {
    private ImageView point;

    private View lineLeft, lineRight;

    public HorizontalVh(View itemView) {
      super(itemView);
      this.point = (ImageView) itemView.findViewById(R.id.point);
      this.lineLeft = itemView.findViewById(R.id.line_left);
      this.lineRight = itemView.findViewById(R.id.line_right);
    }
  }
}

item.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  android:layout_width="0dp"
  android:layout_weight="1"
  android:layout_height="50dp"
  android:gravity="center_horizontal"
  android:orientation="vertical">

  <RelativeLayout
    android:layout_marginTop="20dp"
    android:layout_width="40dp"
    android:layout_height="wrap_content">

    <View
      android:id="@+id/line_left"
      android:layout_width="20dp"
      android:layout_height="1dp"
      android:layout_centerVertical="true"
      android:background="#A6A6A6" />

    <View
      android:id="@+id/line_right"
      android:layout_width="20dp"
      android:layout_height="1dp"
      android:layout_centerVertical="true"
      android:layout_toRightOf="@+id/line_left"
      android:background="#A6A6A6" />

    <ImageView
      android:id="@+id/point"
      android:layout_width="15dp"
      android:layout_height="15dp"
      android:layout_centerHorizontal="true"
      android:scaleType="center"
      android:src="@mipmap/point_normal" />
  </RelativeLayout>

  <TextView
    android:id="@+id/show_time"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="node"
    android:textSize="11sp" />
</LinearLayout>

MainActivity

package com.haoren.timeline;

import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.LinearLayoutManager;
import android.support.v7.widget.RecyclerView;

public class MainActivity extends AppCompatActivity {

  private RecyclerView mRecyclerView;

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

    mRecyclerView = (RecyclerView) findViewById(R.id.mRecyclerView);

    initAdapter();
  }

  private void initAdapter() {
    TimeLineAdapter adapter = new TimeLineAdapter(this, 8);
    mRecyclerView.setLayoutManager(new LinearLayoutManager(this, LinearLayoutManager.HORIZONTAL, false));
    mRecyclerView.setAdapter(adapter);
    adapter.setCurrentNode(5);
  }
}

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