MPVolumeView change size of Airplay icon

Question

I have an MPVolumeView on one of my views, which comes up with an Airplay icon when there are other output sources available. That's all fine, but the icon is tiny, no matter how big I set the frame for MPVolumeView it doesn't get any bigger.

Anyone know how to increase the size of the airplay icon?

Didn't my suggestion help? :) – Kristofer Sommestad Apr 20 '12 at 12:41 — Kristofer Sommestad, Apr 20 '12 at 12:41

score 19 · Answer 1 · answered Jan 13 '12 at 14:07

19

I did this to just show the icon and increase its size:

MPVolumeView *volumeView = [[[MPVolumeView alloc] initWithFrame:CGRectMake(255, 12, 30, 25)] autorelease];
volumeView.showsVolumeSlider = NO;
volumeView.showsRouteButton = YES;
volumeView.transform = CGAffineTransformMakeScale(1.5, 1.5); // increase size by 50%

answered Jan 13 '12 at 14:07

Kristofer Sommestad

3,061
27
39

A simple transform... Dam annoyed I missed that. It worked perfectly thanks – goto_10 Mar 20 '12 at 06:21
Note that the position of the `MPVolumeView` seems to have changed slightly in iOS 5.1. I had to nudge the position 1.5 x and -0.5 y when using a 1.5 scale transform. – Kristofer Sommestad Mar 20 '12 at 15:41
Thanks for this... I can't help but not be frustrated at Apple though for not making 'sizeToFit' function how I expect it to. Shouldn't I be able to set the frame of the MPVolumeView, what components are in it and then call [view sizeToFit] and have it maximize it's size to fit in the defined area? Definitely glad you found a work around though, i was starting to wonder if I was stuck with the size. – MobileVet Mar 23 '12 at 16:17
Thanks for this!! – KarenAnne Apr 16 '18 at 04:25
ios 12 and still this is the only solution – kikeenrique Nov 05 '18 at 15:14

score 0 · Answer 2 · answered Nov 07 '18 at 23:42

Crawling the subviews and using constraints I've manage to replicate the behaviour of AVRoutePickerView, which resizes icon image according to its containing view.

Although it's needed to use a custom icon via setRouteButtonImage(second image). If not, it uses 2 ImageView that don't show the ion resized (first image).

Code and View Hierarchy attached next:

class ViewController: UIViewController {

    @IBOutlet weak var airplayView: MPVolumeView!

    override func viewDidLoad() {
        super.viewDidLoad()
        airplayView.showsRouteButton = true
        airplayView.showsVolumeSlider = false
        airplayView.setRouteButtonImage(UIImage(named: "airplay"), for: .normal)
        for view in airplayView.subviews {
            if let button = view as? UIButton {
                button.imageView?.contentMode = .scaleAspectFit
                button.translatesAutoresizingMaskIntoConstraints = false
                NSLayoutConstraint(item: button,
                                   attribute: NSLayoutConstraint.Attribute.bottom,
                                   relatedBy: NSLayoutConstraint.Relation.equal,
                                   toItem: airplayView,
                                   attribute: NSLayoutConstraint.Attribute.bottom,
                                   multiplier: 1,
                                   constant: 0).isActive = true
                NSLayoutConstraint(item: button,
                                   attribute: NSLayoutConstraint.Attribute.trailing,
                                   relatedBy: NSLayoutConstraint.Relation.equal,
                                   toItem: airplayView,
                                   attribute: NSLayoutConstraint.Attribute.trailing,
                                   multiplier: 1,
                                   constant: 0).isActive = true
                NSLayoutConstraint(item: button,
                                   attribute: NSLayoutConstraint.Attribute.top,
                                   relatedBy: NSLayoutConstraint.Relation.equal,
                                   toItem: airplayView,
                                   attribute: NSLayoutConstraint.Attribute.top,
                                   multiplier: 1,
                                   constant: 0).isActive = true
                NSLayoutConstraint(item: button,
                                   attribute: NSLayoutConstraint.Attribute.leading,
                                   relatedBy: NSLayoutConstraint.Relation.equal,
                                   toItem: airplayView,
                                   attribute: NSLayoutConstraint.Attribute.leading,
                                   multiplier: 1,
                                   constant: 0).isActive = true
            }
        }
    }
}

score 0 · Answer 3 · answered Aug 27 '11 at 14:30

At least for now, all you can do is crawling the subviews and manually set the size. It's probably not a good idea, as subview hierarchy is suspect to change, and even if you set a bigger frame for the icon, it won't get bigger (or if contentMode is set to stretch, you get a blurred icon)

You may even be able to manually replace the icon with a larger one that you provide in your app, but let me say this again, it's not a good idea.

MPVolumeView change size of Airplay icon

3 Answers3