UIView not changing position in animateWithDuration

Question

I have two UIViews (My bad it is a UIView and a UIButton) which I am animating at the same time. I originally had a view and a containerView which would animate just fine and worked like a charm.

Now only one of my UIViews will move/animate in animateWithDuration even though through debugging the frame of the other view says that it is in a position it is not.

    CGRect rect = self.toggle.frame;
    CGRect tabRect = self.tabButton.frame;
    rect.origin.x = rect.origin.x - rect.size.width;
    NSLog(@"%f Before",tabRect.origin.x);
    tabRect.origin.x = tabRect.origin.x - rect.size.width;
    NSLog(@"%f After", tabRect.origin.x);
    [UIView animateWithDuration:0.3 animations:^{  // animate the following:
        self.toggle.frame = rect; // move to new location
        self.tabButton.frame = tabRect;
    }];
    NSLog(@"%f AfterAnimation", tabButton.frame.origin.x);

The toggle view moves fine, but the tabButton view does not animate or move. The strange thing is that both the "After" and "AfterAnimation" debugging code returns the same value, which suggests the frame has indeed moved. Is there a specific reason that this will not work when toggle is a UIView when it would work as a UIContainerView?

Note that if I remove the line

self.toggle.frame = rect;

tabButton will animate correctly, but if I move toggle, tabButton will not move regardless of whether it is first in the animation block or second.

Edit: I have tried moving them into separate blocks and to change the center point rather than the frame, to no avail. It seems that if the toggle view moves, the tabButton will not move.

Edit 2: The pictorial evidence.{

In the following screenshots tabButton bg is green and toggle bg is red.

Above: Initial position (toggle is off-screen) correct position

Above: The problem in question toggle is correct tabButton is not

Above: When self.toggle.frame = rect is commented out (tabButton correct, toggle not) }

Edit 3: It's even worse than I feared.{

I have done a few more tests and even if I take the toggle change out of the animation block to make it an instant thing, the tabButton will still not animate. This makes me think the tabButton may just fundamentally dislike the toggle view and/or myself so will not move just to spite me.

}

Edit 4:{

If I change the tabButton animation to tabButton.frame = CGRectMake(10,10,100,100) the View snaps instantly to that location and animates back to its original position in the same time as the animation duration.

}

I better add more bookkeeping/TLDR information in case things aren't clear.

• toggle is an instance of ToggleDraw which is a subview of UIView which I created.

• tabButton is a UIButton which is part of my IB viewController and a property of the class

• Both toggle and tabButton are subviews of self.view

• The animations will work individually with no modifications to the logic of the rects but will not work if they are animated at the same time

• toggle animation seems to take precedence over tabButton animation regardless of the order

Answer 1

I had a problem with the animation of an UIView created in IB (the animation didn't start from the current position of the view, and ended in the initial position).

All worked fine after sending layoutIfNeeded() to the underlaying view before the animation block:

self.view.layoutIfNeeded()
UIView.animateWithDuration(0.5) { () -> Void in
...

Answer 2

I have found a solution to the problem. If I initialise the UIButton (tabButton) programmatically rather than through the interface builder, both views will animate simultaneously.

This however seems very hacky to me, kind of like putting a bandaid over a missing foot and hoping it will sort itself out. I could not work out the root cause of the problem but at least I could avoid the symptoms.

If anyone knows why the views would not animate when the button was made in the interface builder post an answer here, I am interested in knowing the reason behind this.

Thanks for your help everyone.

Answer 3

I've created an example of what you describe and everything seems to work fine. This is what I used:

UIView *toggle = [[UIView alloc] initWithFrame:CGRectMake(320, 64, 100, 100)];
[toggle setBackgroundColor:[UIColor redColor]];
[self.view addSubview:toggle];

UIButton *tabButton = [[UIButton alloc] initWithFrame:CGRectMake(220, 64, 100, 100)];
[tabButton setBackgroundColor:[UIColor greenColor]];
[self.view addSubview:tabButton];

CGRect rect = toggle.frame;
CGRect tabRect = tabButton.frame;
rect.origin.x = rect.origin.x - rect.size.width;
NSLog(@"%f Before",tabRect.origin.x);
tabRect.origin.x = tabRect.origin.x - rect.size.width;
NSLog(@"%f After", tabRect.origin.x);
[UIView animateWithDuration:1 animations:^{  // animate the following:
    toggle.frame = rect; // move to new location
    tabButton.frame = tabRect;
}];

What I can suggest is to make sure that the code is being ran on mainthread:

dispatch_async(dispatch_get_main_queue(), ^{
    [UIView animateWithDuration:0.3 animations:^{
        self.toggle.frame = rect; // move to new location
        self.tabButton.frame = tabRect;
    }];
});

Also take into account that the log you have after the animation code is incorrect as it won't run after the animation, but rather right next to asking for the animation.

If you want code to run after the animation you should use:

[UIView animateWithDuration:0.3 animations:^{
    self.toggle.frame = rect; // move to new location
    self.tabButton.frame = tabRect;
} completion:^(BOOL finished){
    NSLog(@"Finished animating!");
}];

Answer 4

I think it is not a problem about a UIView Animation. Maybe your toggle posiztion is related to your tabButton. For a try, your can set toggle frame to a rect lick (10, 10, 100,100), then check the result.