MPVolumeView animation issue

Question

Every time I add MPVolumeView as a subview to my UIViewController’s view, there is a quick animation (the MPVolumeView expands from left to right) which looks really weird. I’m looking for a way to get rid of this animation, has anyone faced this issue?

I almost accepted that this is a MPVolumeView bug but then I noticed that Apple is definitely using a MPVolumeView in their native music app, no weird animations there... So there must be something I'm doing wrong.

UPDATE:

The code is pretty straightforward but it was requested in the comments, so here it is:

MPVolumeView *volumeView = [[MPVolumeView alloc] initWithFrame:CGRectMake(10.f, 0.f, CGRectGetWidth(self.view.frame) - 20.f, 30.f)];
[[UISlider appearanceWhenContainedIn:[MPVolumeView class], nil] setMinimumValueImage:[UIImage imageNamed:@"icon-volumeMin"]];
[[UISlider appearanceWhenContainedIn:[MPVolumeView class], nil] setMaximumValueImage:[UIImage imageNamed:@"icon-volumeMax"]];
volumeView.center = CGPointMake(0.5f * CGRectGetWidth(self.view.frame), 0.5f * CGRectGetHeight(self.view.frame));
volumeView.showsRouteButton = NO;
[self.view addSubview:volumeView];

I made a very simple project on github to demostrate the problem, but you have to run it on a device, since MPVolumeView does not show up on simulator. Or just take a look at this gif:

gif :

Hi @Shai, thanks for taking an interest in my question, I added the code — dariaa, Jan 12 '15 at 13:52
in `IBAction` called when button is "touched up inside". It is called on the main thread, you can see the source code on github https://github.com/daria-kopaliani/MPVolumeViewIssueDemo — dariaa, Jan 12 '15 at 16:26
Hi, @dariaa please look at this question, the same as yours. http://stackoverflow.com/questions/25868915/mpvolumeview-animation-on-ios-8 — Alexander Tkachenko, Jan 19 '15 at 10:18

score 10 · Accepted Answer · answered Apr 10 '15 at 13:11

One possible way to remove this behavior is to subclass MPVolumeView and perform some additional work after [super layoutSubviews].

- (void)layoutSubviews
{
    [super layoutSubviews];

    [self xy_recursiveRemoveAnimationsOnView:self];
}

- (void)xy_recursiveRemoveAnimationsOnView:(UIView *)view
{
    [view.layer removeAllAnimations];
    for (UIView *subview in view.subviews) {
        [self xy_recursiveRemoveAnimationsOnView:subview];
    }
}

This removes all inserted animations. So be sure that is what you want, since this is quite the overkill. One could also just remove the position and bounds animations (see removeAnimationForKey:).

score -1 · Answer 2 · answered Jan 12 '15 at 16:33

-1

i fixed your demo-code

@implementation F17YViewController {
    MPVolumeView *volumeView;
}

- (void)viewDidLoad {
    [super viewDidLoad];

    volumeView = [[MPVolumeView alloc] init];
    volumeView.showsRouteButton = NO;
    volumeView.hidden = true;
    [[UISlider appearanceWhenContainedIn:[MPVolumeView class], nil] setMinimumValueImage:[UIImage imageNamed:@"icon-volumeMin"]];
    [[UISlider appearanceWhenContainedIn:[MPVolumeView class], nil] setMaximumValueImage:[UIImage imageNamed:@"icon-volumeMax"]];
    [self.view addSubview:volumeView];
}

- (void)viewWillLayoutSubviews {
    [super viewWillLayoutSubviews];

    volumeView.frame = CGRectMake(10.f, 0.f, CGRectGetWidth(self.view.frame) - 20.f, 30.f);
    volumeView.center = CGPointMake(0.5f * CGRectGetWidth(self.view.frame), 0.5f * CGRectGetHeight(self.view.frame));
}

- (IBAction)showVolumeView:(id)sender {
    volumeView.hidden = false;
}

You should do layout calls in viewWillLayoutSubviews.

Instead of creating a new MPVolumeView with each button press you should create one at viewDidLoad and hide it and then unhide when the button gets pressed.

answered Jan 12 '15 at 16:33

peko

11,267
4
33
48

This is an ugly workaround. Something else must be causing the issue – Stephen Feb 18 '15 at 21:16
@user132490 could you please explain why this is an ugly workaround, instead of claiming that it has to be another issue? – peko Feb 19 '15 at 14:48
setting a frame in viewDidLoad should always work fine, having to set the frame in viewWillLayoutSubviews is ugly and doesn't actually solve anything. If you run this code without setting the volumeView to hidden, you will see that the weird animation still occurs. You are simply hiding the weird animation since it happens when the view is hidden – Stephen Feb 19 '15 at 17:59
if i'm hiding the animation how can you see it? download the demo, replace the viewcontroller code with mine and tell me you see a animation.. – peko Feb 20 '15 at 08:43
If you don't have the line "volumeView.hidden = true;" then you see the animation – Stephen Feb 20 '15 at 17:47

MPVolumeView animation issue

2 Answers2