How to implement tap to like animation like Instagram?

Question

As title, I'm currently working on an Android project. I need to implement a feature similar to "tap to like" on Instagram.

I think this feature could be described in this way. When tapping the button, a small image(heart icon on Instagram) floats from the position of the button in a random path, with fade-out effect, and finally disappear.

Any simple way to do this?

score 1 · Answer 1 · answered Nov 10 '17 at 11:54

1

You can use library like https://github.com/plattysoft/Leonids

Get the particle drawable that you want. Set it up

new ParticleSystem(this, MAX_PARTICLES_COUNT, R.drawable.heart, LIFESPAN_MILLIS)
.setSpeedModuleAndAngleRange(speedMin, speedMax, minAngle, maxAngle)
.setFadeOut(milisecondsBeforeEnd, interpolator interpolator)
.oneShot(anchorView, numParticles);

Play with the settings until result that you want.

answered Nov 10 '17 at 11:54

loshkin

1,600
2
21
38

Eventually, I didn't use it. I implemented it by myself. Thanks anyway. – Dayo Choul Nov 18 '17 at 16:05
1

Instagram itself is using `Leonids` library. – Moisoni Ioan Jan 05 '19 at 17:37
@DayoChoul how did you implement this heart animations? – kinsley kajiva Sep 13 '20 at 07:49
1

@kinsleykajiva Hi there, finally I use Bezier Curves to draw the path and make the heart pic move along w/ it – Dayo Choul Sep 21 '20 at 09:23

score 0 · Accepted Answer · answered Sep 21 '20 at 09:23

0

Finally, I use Bezier Curves to draw the path and make the heart pic move along w/ it

answered Sep 21 '20 at 09:23

Dayo Choul

861
2
9
23

How to implement tap to like animation like Instagram?

2 Answers2