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|