时间轴,顾名思义就是将一些事件或者事物等按照时间顺序罗列起来,给用户带来一种更加直观的体验。京东和淘宝等的物流顺序就是一个时间轴
前言:Android中使用RecyclerView实现时光轴,代码简单易懂.
效果如下:
开发环境:AndroidStudio2.1.2+gradle-2.10
添加依赖(gradle中):
compile 'com.android.support:recyclerview-v7:23.0.0'
activity中:
public class MainActivity extends AppCompatActivity {
private RecyclerView recyclerView;
private List<TimeInfo > list=null;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initLayout();
}
private void initLayout(){
recyclerView= (RecyclerView) findViewById(R.id.recyclerView);
recyclerView.setLayoutManager(new LinearLayoutManager(this));
recyclerView.setHasFixedSize(true);
recyclerView.setItemAnimator(new DefaultItemAnimator());
list=new ArrayList<>();
for(int i=0;i<10;i++){
list.add(new TimeInfo());
}
TimelineAdapter mAdapter = new TimelineAdapter(this, list);
recyclerView.setAdapter(mAdapter);
}
}
adapter中:
public class TimelineAdapter extends RecyclerView.Adapter<TimelineAdapter.ViewHolder> {
private static final int ALPHA = 100;
private List<TimeInfo> list=null;
private Context context;
public TimelineAdapter(Context context,List<TimeInfo> list) {
this.list=list;
this.context=context;
}
@Override
public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
View v = LayoutInflater.from(parent.getContext())
.inflate(R.layout.v7_item_timeline, null);
return new ViewHolder(v);
}
@Override
public void onBindViewHolder(ViewHolder holder, int position) {
holder.textView.setText("2016-08-10\n10:20");
int color = context.getResources().getColor(R.color.colorAccent);
holder.civ.setFillColor(color);
holder.civ.setBorderColor(ColorUtils.setAlphaComponent(color, ALPHA));
holder.img.setBackgroundResource(R.mipmap.ic_zhihu_logo);
holder.item_timeline_view.setBackgroundResource(list.size()%2==0?R.color.colorAccent:R.color.colorPrimary);
}
@Override
public int getItemCount() {
return list.size();
}
public static class ViewHolder extends RecyclerView.ViewHolder {
TextView textView;
CircleImageView civ;
ImageView img;
View item_timeline_view;
public ViewHolder(View v) {
super(v);
textView = (TextView) v.findViewById(R.id.item_timeline_time);
civ= (CircleImageView) v.findViewById(R.id.item_timeline_icon_bg);
img= (ImageView) v.findViewById(R.id.item_timeline_icon);
item_timeline_view=v.findViewById(R.id.item_timeline_view);
}
}
}