With MaterialTimelineView you can easily create a material looking timeline

MaterialTimelineView

With MaterialTimelineView you can easily create a material looking timeline.

Setup

The library is pushed to jCenter() as an AAR,
so you just need to add the following to your build.gradle file:


dependencies {
    implementation 'pl.hypeapp:materialtimelineview:1.1'
}

Usage

MaterialTimelineView extends from ConstraintLayout, so it has all of its possibilities.

A sample of simple recycler view that demonstrates usage of library

In your xml layout add:

<pl.hypeapp.materialtimelineview.MaterialTimelineView
        android:id="@+id/material_timeline_view"
        android:layout_width="match_parent"
        android:layout_height="100dp"
        android:background="@android:color/holo_orange_light"
        app:timeline_top_radio_color="@android:color/white"
        app:timeline_bottom_radio_color="@android:color/white"
        app:timeline_line_color="@android:color/white"
        app:timeline_type="item"
        app:timeline_position="first"                                              
        app:timeline_margin_start="32dp"
        app:timeline_radio_outline_radius="20"
        app:timeline_radio_radius="12">

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="HELLO WORLD"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent"/>

</pl.hypeapp.materialtimelineview.MaterialTimelineView>

or programatically:

val materialTimelineView: MaterialTimelineView = findViewById(R.id.material_timeline_view)
materialTimelineView.position = MaterialTimelineView.POSITION_FIRST // Default MaterialTimelineView.POSITION_FIRST
materialTimelineView.timelineType = MaterialTimelineView.TIMELINE_TYPE_ITEM // Default MaterialTimelineView.TIMELINE_TYPE_LINE
materialTimelineView.radioRadius = 14f // Default 12f
materialTimelineView.radioOutlineRadius = 22f // Default 22f
materialTimelineView.radioMarginStart = 100f // Default 150f
materialTimelineView.topRadioColor = Color.Black // Default Color.White
materialTimelineView.bottomRadioColor = Color.Black // Default Color.White
materialTimelineView.lineColor = Color.Black // Default Color.White

Timeline types overview

Attributes	Screen
app:timeline_type="item" app:timeline_position="first"
app:timeline_type="item" app:timeline_position="middle"
app:timeline_type="item" app:timeline_position="last"
app:timeline_type="line" app:timeline_position="first"
app:timeline_type="line" app:timeline_position="middle"
app:timeline_type="line" app:timeline_position="last"