marciokoko
marciokoko

Reputation: 4986

How to make UIView animation smoother?

I have a couple of gesture recognizers to swipe an image left-2-right or vv, depending on the direction of the swipe. But I want the animation to be smoother. This is my code so far:

-(void)swipeNext:(id)sender{
    //0 Get the currentview as referenced by pageControl
    UIImageView *oldView = [views objectAtIndex:currentViewIndex];
    //MOVE ON TO NEW VIEW
    currentViewIndex ++;
    NSLog(@"left swiped  - currentViewIndex:%d", currentViewIndex);
    UIImageView *newView = [views objectAtIndex:currentViewIndex];
    //NSLog(@"views objectAtIndex = %@",[views objectAtIndex:[self.pageControl currentPage]]);

    //1 Animate out the old view
    newView.frame = oldView.frame;
    newView.center = CGPointMake(oldView.center.x + CGRectGetWidth(oldView.frame), oldView.center.y);
    [oldView.superview addSubview: newView];

    [UIView animateWithDuration:1.0
                          delay: 0.0
                        options: UIViewAnimationOptionCurveEaseIn //UIViewAnimationOptionRepeat | UIViewAnimationOptionAutoreverse
                     animations:^{
                         newView.center = oldView.center;
                         oldView.center = CGPointMake(oldView.center.x - CGRectGetWidth(oldView.frame), oldView.center.y);

                     }
                     completion:nil];
}

Id like to make it a bit faster. Ive posted as reference to the app that im trying to emulate, DunkinDonuts (What kind of viewcontrollers does the Dunkin Donuts app use) and they seem to use a UIPageControl, which I tried using at first but had trouble determining the direction of the swipe (How do I animate a UIImageView left to right with UIPageControl?), so I switched over to Gestures. But if you see their app, the swipe is faster.

Upvotes: 0

Views: 3574

Answers (2)

marciokoko
marciokoko

Reputation: 4986

I found that to add properly formatted (readable) code blocks, I couldnt use comments. It was suggested I use an answer as an update to my original questions. So here it is.

UPDATE

I modified my code like this. As always, viewDidLoad calls createUIViews which does this:

-(void)createUIViews{
    UIImage *image1 = [UIImage imageNamed:@"GiftCard.png"];
    firstView = [[UIImageView alloc] initWithImage:image1];

    CGRect newFrame1 = firstView.frame;
    newFrame1.origin.x = 50;
    newFrame1.origin.y = 10;
    firstView.frame = newFrame1;

    UIImage *image2 = [UIImage imageNamed:@"MyCard.png"];
    secondView = [[UIImageView alloc] initWithImage:image2];

    CGRect newFrame2 = secondView.frame;
    newFrame2.origin.x = 350;//CGRectGetWidth(firstView.superview.frame)/2;
    newFrame2.origin.y = 10;
    secondView.frame = newFrame2;

    //Add all Views offscreen except #1
    [self.scrollView addSubview:firstView]; //added ONSCREEN
    [self.scrollView addSubview:secondView]; //added OFFSCREEN
}

This sets the firstView onscreen and the secondView off to the right.

The gesture recognizers are also set in viewDidLoad. They call swipeNext as it is below:

-(void)swipeNext:(id)sender{
//0 Get the currentview as referenced by pageControl
oldView = [views objectAtIndex:currentViewIndex];
//MOVE ON TO NEW VIEW
currentViewIndex ++;
newView = [views objectAtIndex:currentViewIndex];

//1 Animate out the old view **(Aaron, youre right, dont need this anymore)**
//newView.frame = oldView.frame;
//newView.center = CGPointMake(oldView.center.x + CGRectGetWidth(oldView.frame), oldView.center.y);
//[oldView.superview addSubview: newView];

[UIView animateWithDuration:1.0
                      delay: 0.0
                    options: UIViewAnimationOptionCurveEaseIn 
                 animations:^{
                     newView.center = oldView.center;
                     oldView.center = CGPointMake(oldView.center.x - CGRectGetWidth(oldView.frame), oldView.center.y);

                 }
                 completion:nil];

} I commented out the addSubview because I moved it to the createUIViews method. It works the same, I think its just a matter of swiftness or some animation feature that Im missing. I wish I could add a video. The original DD apps looks to be quicker to animate as a UIPageControl would (i think) Here is a link to a video.Sluggish iOS UIView Animation

Upvotes: 1

Aaron Golden
Aaron Golden

Reputation: 7102

Adding a view to the view hierarchy during the same turn of the event loop that you kick off an animation of that same view is a recipe for poor performance and other weird animation glitches. In your code you know what newView will be before swipeNext is called. It's [views objectAtIndex:currentViewIndex + 1]. I recommend that you add the newView (and previous view for that matter) to the view hierarchy when the current view has finished animating into place. For example, code to place "nextView" and "previousView" in the view hierarchy could go in your animation's completion block. Put the nextView and previousView in the view hierarchy ahead of time, but off screen. Then in swipeToNext you can just animate the centers and avoid modifying the view hierarchy until after the animation completes.

Upvotes: 0

Related Questions