Android view morphing

About me

michalgellert.blogspot.com

github.com/migellal

twitter.com/MichalGellert

plus.google.com/+MichałGellert

digitalzombielab.pl

Morphing?

Morphing is a special effect in motion pictures and animations that changes (or morphs) one image or shape into another through a seamless transition.

~wiki

Morphing in android

Lewis McGeary

Vector-compat

Skills?

Graphics format

Future graphics format

VectorDrawable

AnimatedVectorDrawable

Vector Asset

Vector Asset

Vector Asset

Vector Asset

Vector compat

compile

'com.wnafee:vector-compat:1.0.5'

Animated vector drawable

Object animator

Animatable

Arrow to done

Groups

Solar system

Paths

  • compatible to morphing
  • case sensitive

M / m - move to

Z / z - closepath

L / l, H / h, V / - line, horizontal line, vertical line

C / c, S / s, Q / q, T / t, A / a -

Cubic Bézier commands, Quadratic Bézier commands, Elliptical arc commands

Bézier

Simple path

M 8,5

v 14

l 11,-7

z

Custom paths

https://inloop.github.io/svg2android/

Vector asset

VectAlign (a.k.a. VectorDrawableAlign)

is a developer's tool which automagically aligns two VectorDrawable "pathData" strings (or SVG images) in order to allow morphing animations between them using an AnimatedVectorDrawable.

http://image.online-convert.com/convert-to-svg

VectAlign

VectAlign

Vectalign

Toast anim

github.com/migellal/

AndroidViewMorphing

Q&A

Thanks! ;)

Android view morphing - Google Slides