ExpressView

A micro-interaction library which enables animation for various actions or reactions. Inspired from Twitter's and Instagram's like button animation.

Gradle Dependency

dependencies {
    implementation "co.ankurg.expressview:expressview:0.0.3"
}

XML

<co.ankurg.expressview.ExpressView
        android:id="@+id/likeButton"
        android:layout_width="64dp"
        android:layout_height="64dp" />

Observing check state

View reacts to clicks and maintains the state on its own. To listen to the check state change, implement the following callback.

import co.ankurg.expressview.OnCheckListener
...
likeButton.setOnCheckListener(object : OnCheckListener {
    override fun onChecked(view: ExpressView?) {
        Log.d(TAG, "Checked")
    }
    override fun onUnChecked(view: ExpressView?) {
        Log.d(TAG, "Unchecked")
    }
})

Attributes

Name	Description	Value	Default
uncheckedIcon	Uncheked icon sate	Drawable	Heart Icon
checkedIcon	Checked icon state	Drawable	Heart Icon
uncheckedIconTint	Unchecked icon color	Color	#A1A1A1A1
checkedIconTint	Checked icon color	Color	#FFFF0000
iconSize	Size of icon, applied to both widht & height	Dimension	55% of ExpressView
burstColor	Color of line burst behind the icon	Color	#FFFF0000
setChecked	Initial check state of icon	Boolean	false

Note:- Default ExpressView size is 48dp and iconSize is 26dp (55% of 48dp)

Public Kotlin/Java properties

Name	Description	Value	Default
isChecked	Initial check state of icon	Boolean	false
animationStartDelay	Delay between the tap and animation, applied to both icon and burst animations	Long	50L
iconAnimationDuration	Animation duration of icon inside ExpressView	Long	700L
burstAnimationDuration	Animation duration of line burst behind the icon	Long	500L
interpolator	Animation interpolator for the icon inside ExpressView	Interpolator	BounceInterpolator
onCheckListener	Check state change listener/callback	OnCheckListener	null