ios - How to animate/morph an menu button like the Facebook Paper app -
i saw animation/morphing in facebook paper app morph menu button, 1 when pull down menu, x , when tap it. recorded because don't know how show other way.
https://www.youtube.com/watch?v=y6j_mvgv-nm
can explain me how done? app.
that awesome, hadn't seen before.
created quick gist that:
https://gist.github.com/mnmaraes/9458421
edit: it's not link, key concepts 2 methods:
-(void)morphtox { cgfloat angle = m_pi_4; cgpoint center = cgpointmake(120., 120.); __weak tuiviewcontroller *weakself = self; [uiview animatewithduration:0.8 delay:0.0 usingspringwithdamping:0.6 initialspringvelocity:2.0 options:uiviewanimationoptioncurveeaseout animations:^{ tuiviewcontroller *strongself = weakself; strongself.toplineview.transform = cgaffinetransformmakerotation(-angle*5); strongself.toplineview.center = center; strongself.bottomlineview.transform = cgaffinetransformmakerotation(angle*5); strongself.bottomlineview.center = center; strongself.centerlineview.transform = cgaffinetransformmakescale(0., 1.0); } completion:^(bool finished) { }]; }
and:
-(void)morphtoline { __weak tuiviewcontroller *weakself = self; [uiview animatewithduration:0.8 delay:0.0 usingspringwithdamping:0.6 initialspringvelocity:2.0 options:uiviewanimationoptioncurveeaseout animations:^{ tuiviewcontroller *strongself = weakself; strongself.toplineview.transform = cgaffinetransformidentity; strongself.toplineview.center = cgpointmake(120., 2.); strongself.bottomlineview.transform = cgaffinetransformidentity; strongself.bottomlineview.center = cgpointmake(120., 238.); strongself.centerlineview.transform = cgaffinetransformidentity; } completion:^(bool finished) { }]; }
the first 1 animates parallel lines x , second x lines. playing around numbers , options of animations should give different feels play with.
have fun!
Comments
Post a Comment