瀑布流式的时间轴

TimeLine

项目地址：vivian8725118/TimeLine 

简介：瀑布流式的时间轴

更多：作者   提 Bug   

标签：

 

This project aims to provide a easy way to use Staggered TimeLine implementation.

中文版文档

Provide the gradle dependency

  implementation 'com.vivian.widgets:TimeLineItemDecoration:1.5'

Usage

If you want to use this TimeLine in your project, you have to do the following.

• Set the StaggeredGridLayoutManager to your RecyclerView

  mRecyclerView.setLayoutManager(new StaggeredGridLayoutManager(2, StaggeredGridLayoutManager.VERTICAL));
  

• Use the ItemDecoration of this project ItemDecoration.java

  mRecyclerView.addItemDecoration(new ItemDecoration(this, 100));
  

  The second ctor-parameter will define the distance. In that case 100px.

Currently there are 2 styles available, as seen in the Screenshots. You can find the implementation for the second style here. DotItemDecoration.java

DotItemDecoration mItemDecoration = new DotItemDecoration
                .Builder(this)
                .setOrientation(DotItemDecoration.VERTICAL)//if you want a horizontal item decoration,remember to set horizontal orientation to your LayoutManager
                .setItemStyle(DotItemDecoration.STYLE_DRAW)//choose to draw or use resource
                .setTopDistance(20)//dp
                .setItemInterVal(10)//dp
                .setItemPaddingLeft(10)//default value equals to item interval value
                .setItemPaddingRight(10)//default value equals to item interval value
                .setDotColor(Color.WHITE)
                .setDotRadius(2)//dp
                .setDotPaddingTop(0)
                .setDotInItemOrientationCenter(false)//set true if you want the dot align center
                .setLineColor(Color.RED)//the color of vertical line
                .setLineWidth(1)//dp
                .setEndText("END")//set end text
                .setTextColor(Color.WHITE)
                .setTextSize(10)//sp
                .setDotPaddingText(2)//dp.The distance between the last dot and the end text
                .setBottomDistance(40)//you can add a distance to make bottom line longer
                .create();

if you want to do something according to the column of span,implements SpanIndexListener of this project SpanIndexListener.

mItemDecoration.setSpanIndexListener(new SpanIndexListener() {
        @Override
        public void onSpanIndexChange(View view, int spanIndex) {
           view.setBackgroundResource(spanIndex == 0 ? R.drawable.pop_left : R.drawable.pop_right);
        }
});

Example