transitionFromView：和翻转的奇怪行为。

Question

I have a image wall ( UIScrollView ) and in there I have a lot of UIImageView's .

Here is my code:

for (ThumbPosterModel *tPoster in _thumbsPosterStack) {

    UIImageView *imageView = [[UIImageView alloc] initWithImage:tPoster.thumb];
    imageView.userInteractionEnabled = YES;
    imageView.frame = CGRectMake(i, imageView.frame.origin.y, imageView.frame.size.width, imageView.frame.size.height);

    [tPoster setTag:tag];
    [_posterTagArr addObject:(BasicPosterModel*)tPoster];

    imageView.tag = tag;
    tag++;
    [posterWallScrollView addSubview:imageView];

    UITapGestureRecognizer *doubleTap = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(imageDoubleTapped:)];
    doubleTap.numberOfTapsRequired = 2;
    [imageView addGestureRecognizer:doubleTap];
}

And Here is my IBAction:

-(IBAction)imageDoubleTapped:(id)sender {
    NSInteger selectTag = (((UIGestureRecognizer*)sender).view.tag);
    for (BasicPosterModel *bPoster in _posterTagArr) {
        if(bPoster.tag == selectTag) {
            [UIView transitionFromView:(UIImageView*)((UIGestureRecognizer*)sender).view
                                toView:mySecordView //let's say next ImageView. Doesn't matter
                              duration:1.0
                               options:UIViewAnimationOptionTransitionCrossDissolve  
                            completion:^(BOOL finished) {
                                // animation completed
                            }];

        }
    }
}

And when I use:

UIViewAnimationOptionTransitionCrossDissolve this is effect ONLY on my image in ScrollView. When I use in this code UIViewAnimationOptionTransitionFlipFromTop this affect to my scrollView.

How it's possible?

Of course I want to my Animation effect only for single image.

Answer 1

Here's how the transition works conceptually:

1. The system renders the current state of the parent view of the fromView to an off-screen buffer ("before" state)
2. the fromView is removed from its parent view
3. the toView is added to the parentView (can be nil, you're right about that; in that case nothing is added)
4. The system renders the parent view into an off-screen buffer ("after" state")
5. the system animates the transition of the parent view from the "before" state to the "after" state

In your case the parent view is the scroll view, so the whole scroll view is transitioned. Counter to your perception, that's the case even when using a cross dissolve. It's just that most of the scrollview (the part that's not covered by fromView) is identical before and after, so it looks as if that part does not take part in the transition - but it does.

If I understand correctly, your are arranging multiple stacks of image views horizontally in your scroll view, and whenever someone double taps on the "uppermost" image view in a stack, you want to "reveal" the image directly below it, without affecting the other stacks.

If you add a container view to the scrollView for each of these stacks that is the same size as the stack, and put all the ImageViews for this stack into this container view instead of directly into the scroll view, it will work. On tap, just do a transition from the tapped view to nil as you originally did. The transition's size on the screen will be limited to the container view (roughly - curls and flips use some space beyond its frame).

Depending on your requirements, you might want to remove the stack's container view after the last image in the stack is removed.

Answer 2

The reason is that UIViewAnimationOptionTransitionFlipFromTop is only availavle since iOS 5.0

From UIView Class Reference :

UIViewAnimationOptionTransitionFlipFromTop
A transition that flips a view around its horizontal axis from top to bottom. The top side of the view moves toward the front and the bottom side toward the back.
Available in iOS 5.0 and later.
Declared in UIView.h.`

So, in iOS 4.3 it may cause unpredictable behavior.

Answer 3

First off you need to have a toView listed in order to use transitionFromView properly.

Here is Apple's example of how it is done:

[UIView transitionFromView:(displayingPrimary ? primaryView : secondaryView)
        toView:(displayingPrimary ? secondaryView : primaryView)
        duration:1.0
        options:(displayingPrimary ? UIViewAnimationOptionTransitionFlipFromRight :
                    UIViewAnimationOptionTransitionFlipFromLeft)
        completion:^(BOOL finished) {
            if (finished) {
                displayingPrimary = !displayingPrimary;
            }
    }];

I do also believe that transitionFromView is suppose to take in superView as an argument.

Also, I think that is better practice to add your UImageView to a container UIView and perform the action on the container, rather than directly on the UIImageView. Because essentially you will need a "parent" UIView to animate, while you add and remove subViews durning the animation.

Answer 4

As Cory says, transitionFromView: toView: looks like it is intended to have a destination view. If you've only want to fade out a view, why not use a method intended to just work on a single view, such as transitionView:duration:options:animations:completion.

The example from the documentation would appear to do exactly what you want.

[UIView transitionWithView:containerView
       duration:0.2
       options:UIViewAnimationOptionTransitionFlipFromLeft
       animations:^{ [fromView removeFromSuperview]; [containerView addSubview:toView]; }
       completion:NULL];