Let your users express more with this micro-interaction library to animate like, react, or other actions. :heart:
FreeA micro-interaction library which enables animation for various actions or reactions. Inspired from Twitter's and Instagram's like button animation.
dependencies {
implementation "co.ankurg.expressview:expressview:0.0.3"
}
<co.ankurg.expressview.ExpressView
android:id="@+id/likeButton"
android:layout_width="64dp"
android:layout_height="64dp" />
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")
}
})
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)
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 |