transitionFromView: and strange behavior with flip.

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.

Acoustic

Are you sure that you're working on iOS>=5? – Hildegardhildegarde

No, I'm targeting to iOS 4.3. But transitionFromView:toView:.. is available in iOS >=4.0 – Acoustic

But UIViewAnimationOptionTransitionFlipFromTop is only availavle since iOS 5.0, see my answer and the link) – Hildegardhildegarde

But with `UIViewAnimationOptionTransitionCurlUp' I'm getting the same error – Acoustic

I still think that the smaller container view would solve your problem (see my answer below). Can you show us the code that you tried and that didn't work? – Boy

I completly don't get why In your case the parent view is the scroll view... why the parent view is a scrollview. It should be UIImageView. – Acoustic

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.

Wroth

I completly don't get why In your case the parent view is the scroll view... why the parent view is a scrollview. It should be UIImageView. – Acoustic

Well, I can't tell you why it is that way, that's a question for Apple's framework engineers. The fact is: the area affected by the animation on screen is the area of the parent view of the fromView you give to the method. Your fromView is a UIImageView that you have added as a subview of a UIScrollView. So the animation affects the area of the UIScollView. If you want a smaller area, make the UIImageView a subview of a smaller view. – Boy

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.

Hildegardhildegarde

I'm also try UIViewAnimationOptionTransitionCurlUp and didn't work too. And it is available in iOS 4.0+ – Acoustic

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.

Holp

Why? UIImageView IS UIView subclass. Why do i have a extra container for it? developer.apple.com/library/ios/#DOCUMENTATION/UIKit/Reference/… – Acoustic

I realize that. The thing is that their has to be a "parent" view that the animation is assigned to. That being a UIView. You add and remove UIImageView's to the parent to create the animate effect. If you just flip an imageView nothing will happen. Removing the top image and adding a new one along with the flip is what makes the animation....well look like an animation. – Holp

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];

Velda

No i can't - I want transitionFrom..To... Like i said in comment nil replacement - didn't work. This is not a solution for this problem, it's only hide a problem! – Acoustic