“Magic Move” Effect Custom Transition

问题

I trying to get a custom transition between two View Controllers. First, here's a picture to illustrate what I want :

I want a UICollectionViewCell to expand to the whole screen. In this cell, the subviews are placed with Autolayout in IB.

I just want each subview to go to the new position. So I tried subview.frame = newSubview.frame in the animation block, but it doesn't work (because of Autolayout I think).

I thought to delete the constraints while the animation is occuring, but it doesn't work.

I also tried to make @IBOutlets of the constraints and to change constant property.

Here's my code :

    let detailView = detailViewController.view
    let cellView = self.selectedCell

    container.addSubview(cellView!)

    let duration = self.transitionDuration(transitionContext)

    UIView.animateWithDuration(duration, delay: 0.0, options: .CurveEaseInOut, animations: {

            let newFrame = detailViewController.view.frame
            cellView!.frame = newFrame
            cellView!.imageView.frame = newFrame
            cellView!.labelTopConstraint.constant = 27
            cellView!.labelRightConstraint.constant = 8
            cellView!.layoutIfNeeded()
        }

...

Actually, when the animation begins the labels snap to a position, then they move and at the end they are not at the right position...

Any ideas ? Thanks

回答1:

Check out this repo, I think this is what you are looking for BCMagicTransition: https://github.com/boycechang/BCMagicTransition

The issue with your code is that you aren't converting the frames of your subviews of your collection view cell that you want to animate to the coordinates of the container view controller of the transition, and same with the final frames for their positions. Even though you are using AutoLayout you can still manipulate views with their frames.

To accomplish this, checkout this method (documentation):

        func convertRect(rect: CGRect, fromView view: UIView?) -> CGRect

You also should look into animating snapshots of the views you wish to animate. Then just add the snapshots to the container view, and animate them to the converted final frames, then remove them when the animation is complete.

Hope this helps !

来源：https://stackoverflow.com/questions/27302487/magic-move-effect-custom-transition

标签

ios

autolayout

transition

subviews