Android: animated custom views

Question

EDIT 2: new official training guide

The Developers site released a training guide for UI related stuff, this is the index:

• Animations Overview
• Pro

Answer 1

do you know of other techniques to play animations?

In Android you have basically 3 ways to implement animations:

• Animate the View (Scale, alpha, rotate, etc) by just using view.startAnimation(...)
• Animate the Drawable (Depending on the Drawable, this could be anything from animated vector drawables to frame animations)
• Doing custom drawing and animation

Obviously just animating a view by framework methods is easier than creating some drawable animation, and creating some drawable (xml) is easier than doing custom drawing.

You mentioned lottie, which just came out a few days ago. We shall see how well it does, but it looks very promising. Under the hood lottie will parse the json and do some custom drawing using Canvas and Path (3rd bullet point above)
If you can get your hands on After Effects this is probably the "easiest" solution for complex animations (and cross platform!)

People also started sharing animations, you can find them here:
http://www.lottiefiles.com/

---

do you know how it's done?

The (1) video looks like they do some custom drawing.

• Draw and fill a Path for the water, animate the top with some waves while it animates up, and sprinkle with some white spots.
• Draw a the shape of the glass around it

This will involve creating a custom view and/or drawable and overriding onDraw(Canvas) Path.lineTo as well as some arc, cubic, or quad will do the trick...I'm neither a designer nor a vector specialist :)

I do not think this could easily be achieved by using animated vector drawables, but you might get it done by applying a path morph animation. (Also animated vector drawables are only supported on 21+ if I am not mistaken)

The (2) Video just animates a Path and wiggles a flag. This can be achieved by using AnimatedVectorDrawables (as e.g. this blog shows) and trimming the path beginnings/ends or again by doing custom drawing (and thus also supporting pre lolipop devices) by animating a Path, e.g. using PathMeasure.getSegment() to continuuously animate the path.

The (3) animation, as already pointed out by azizbekians answer is the first mentioned kind, just animating (moving and scaling) views.

---

Regarding the second example, only one idea came to my mind, and that's setting a Path and moving the View accordingly by passing it somehow after animate(). (2) Is this possible?

Moving views along a path is obviously possible, but then the view would move, and you would still need to find a way to draw the path following it, as explained above.