Transition "flashes" view temporarily disappearing?

[UberJason]

Hi there,

I love the idea of this library! I'm just getting started and was trying it out a bit Storyboard-only, animating a simple UIView in size and position. It works as expected, except I noticed that the view quickly flashes away (disappears) before reappearing in the animation. I'm sure I've probably just got something mis-configured, but I'm not quite sure what it is - any thoughts?

Here is a gif, and here is a link to my project (simplest possible configuration, Storyboard only!).

[lkzhao]

If you turn on the debug plugin and turn on the 3D view. You will see why.
Hero cannot infer the correct zOrder of all the views. It currently always put destination views on top of the source views. The white background is animating faster than your black square therefore it is covering it at the start of the animation. You can use the zPosition modifier to manually adjust the zOrder. I.e. Give the black square a higher zPosition.

[UberJason]

Awesome, that helps and also helps me understand the zPosition modifier better. Thank you!

[EthanSchatzline]

Hey @lkzhao I am having the same issue. I just started messing around with the library so I'm probably doing something wrong.

I have 2 viewcontrollers with an imageview and white backgrounds.
I set both imageView's heroIDs to the same string
I set the source imageView's heroModifier to [.zPosition(5)]
both viewControllers have enabled Hero
present the second viewController from the first

But the imageView flashes before starting the transition. Any idea?

[UberJason]

How about the target imageView? I think properties have to be set on the target controllers to work.

[EthanSchatzline]

@UberJason What heroModifiers would I need to give the target imageView? Currently I am just setting zPosition to 5 on the source imageView and not setting any heroModifiers on the destination imageView. The only thing I set on the destination controller is the heroID on the destination imageView, and enabling Hero on the viewcontroller.

[UberJason]

Try setting the zPosition on the source and target imageView. I think that would ensure the transition avoids the flash in both directions (present and dismiss). When you present the view controller, it'll look at the target controller's zPosition to decide (which is the presented view controller); when you dismiss the view controller, the target view controller is the presenting view controller. Note, I haven't actually tried this situation, so let me know if I'm totally wrong, @lkzhao.

[lkzhao]

@UberJason You are completely right! We should include this in the usage guide.

[EthanSchatzline]

@UberJason @lkzhao I will try this tonight! I feel like I tried that last night though and it didn't work. Will see what happens though. I'm not missing anything else am I? I only set heroIDs for the 2 imageViews and enabled Hero on the VCs and did nothing else hero-related to anything else, no heroID on the viewcontrollers' view. (Other than setting zPosition heroModifier to the imageViews).

[lkzhao]

Should be good enough. Try it and let us know.

[UberJason]

I think that was all that I did. Feel free to clone my project that I referenced in my original issue post and look at it to compare with yours.

[EthanSchatzline]

@UberJason @lkzhao awesome. Thanks for the help guys. I'll let you know how it goes.

[EthanSchatzline]

@UberJason @lkzhao Jason, I messed around with your sample project. Spiced it up a bit, and man this is a pretty cool library. Anyway, I got home and tried running it on my device and there was no flicker. It was just in the simulator... tisk tisk. Thanks guys!

[lkzhao]

@here Just pushed a new version 0.1.8 which eliminated the need for zPosition modifier to be used in most cases. Hero will try to determine the order from the view hierarchy.

[UberJason]

Awesome, that sounds useful!