UIView Animation Flip With Axis on at Top of View

房东的猫 提交于 2019-12-25 02:18:48

问题


I have a UIView that I would like to animate a flip up. This isn't like UIViewAnimationOptionTransitionFlipFromTop because that places that axis in the middle of the view. I would like to have the axis at the top of the view, so that it flips up similar to how a pad of paper flips from the top axis (NOT a page peel).

[UIView transitionWithView:self.view duration:0.6
                   options:UIViewAnimationOptionTransitionFlipFromTopAxis // <---- Wish there was an option like this                 
                animations:^{
                    // Exchange the views here


                } completion:NULL];

I am thinking it isn't possible to do this with the standard UIView animation options. What is the alternative to this, where I can control the flip axis?


回答1:


The simplest way would probably be to enclose the view you want to flip in a taller, offset, transparent container view and then flip that container. In other words:

  |-----|
  |     |
  |  B  |
  |     |
0 |     |
  ||---||
  || A ||
  ||---||
  |-----|

A is the view you want to flip up; B is the container; 0 is the top of the screen. Apply your transition to B; by flipping B across its middle, you flip A along its top.

You could also do something more complicated and just implement the flip yourself using Core Animation, but this is a bit easier.

Edited:

If you want to take the Core Animation approach, basically what you need to do is apply a CATransform3D to the layer to rotate it around the horizontal axis, i.e. theLayer.transform = CATransform3DMakeRotation(M_PI, 1, 0, 0). That’ll flip it across its middle, though, which is what you don’t want, so you also need to change the layer’s anchorPoint from its default value of (0.5, 0.5) to (0.5, 0) so that its “origin” is at the center of its top edge. You might also want to apply a perspective effect to the flip transformation using the CATransform3D’s m34 member, as described here.



来源:https://stackoverflow.com/questions/8451905/uiview-animation-flip-with-axis-on-at-top-of-view

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!