0

Have you used Tinder app? That app is full of nice effects that makes a great UX experience in my opinion.

Try to open it and you see the launch image with a red flame at the center of the screen.

Seconds after the flame moves itself to the navigation bar to make the app logo.

The animation I am trying to create it exactly that and I can't figured out how to (1) let the navigation bar appear in that way and (2) to transition a custom UIView inside another view.

If I'd find an app to record the screen of my iPhone I will post a video explaining the animation I'm referring to.

In the meanwhile, do you have any ideas?

rmaddy
  • 314,917
  • 42
  • 532
  • 579
Fred Collins
  • 5,004
  • 14
  • 62
  • 111
  • for the second question, it might not be the case to transit the custom view "into" the navigation bar. Maybe it's just "onto" the navigation bar which may be hidden during the transition – Egist Li May 12 '14 at 14:32

1 Answers1

1

The animation I am trying to create it exactly that and I can't figured out how to (1) let the navigation bar appear in that way and (2) to transition a custom UIView inside another view.

Animation's are often not exactly what they seem to be. For example, when you segue from one view controller to another the animation you see often uses images instead of transforming the actual views.

You can do the same kind of thing for the animation you want. You don't have to actually move a view from one view controller to another -- just create the appearance that you did:

  1. Create an animation that moves the image in question (like the flame) into position on top of the navigation bar.
  2. Set the titleView of the destination view controller's navigation item to include the same image in the same location.
  3. Remove the animated image. The user won't notice a change because the same image is already present at that location.
Caleb
  • 124,013
  • 19
  • 183
  • 272
  • Thanks for the answer. What do you mean with `when you segue from one view controller to another the animation you see often uses images instead of transforming the actual views`? How did that app show the navigation bar with that animation? (it seems a fade in, right?) Do you mean that there is a launch image with a flame at the center, then the launch image is replaced with an empty view controller with an `UIImageView` (the flame) at the same position of the launch image, which it will be animate to the top and a navigation controller with the same image in the `titleView` fades then in? – Fred Collins May 13 '14 at 00:39