Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    text
    copied!<p><strong>Edit:</strong></p> <p>So it turns out that when using <code>MPVolumeView</code>, iOS doesn't actually vertically align the image that you set the same way it does with other images. The solution is to create a slightly offset image (you can always use alpha if you need to convince it that the image is larger) and use that one just for the <code>MPVolumeView</code>. This is kind of a pain, but works very well. Usually you want between 2-4 pixels of offset for your new image. </p> <hr> <p>To set the volume thumb image, you should use:</p> <pre><code>setVolumeThumbImage:forState: </code></pre> <p>For example, if you have an image that is called <code>myThumbImage.png</code> and an MPVolumeView called <code>myVolumeView</code>, you would use:</p> <pre><code>[myVolumeView setVolumeThumbImage: [UIImage imageNamed:@"myThumbImage"] forState:UIControlStateNormal]; </code></pre> <p>This will find any image named <code>myThumbImage.png</code> that exists in your project, and it will use it for the slider thumb. You should take care that this image is the size you want, 25x25 is usually a little big, but not a bad starting point. </p> <p>Apple's <code>UISlider</code> will dim and change the button's appearance when you tap on it. To accomplish this, create another image that looks how you want it (this may be the same image, just darker, or a completely different one altogether), and set it to be the image displayed for the thumb when it is highlighted (which is what happens when you tap on it). </p> <p>You would accomplish this using:</p> <pre><code>[myVolumeView setVolumeThumbImage: [UIImage imageNamed:@"VolumeThumbHighlighted"] forState:UIControlStateHighlighted]; </code></pre> <p>Which will find the image named <code>VolumeThumbHighlighted.png</code> and use it for that purpose. </p> <hr> <p>Note that you can also set the left and right track images, with stretchable images, with slightly different methods than the typical <code>UISlider</code> ones. You would use this code:</p> <pre><code>[myVolumeView setMinimumVolumeSliderImage:[[UIImage imageNamed:@"LeftTrackImage"] resizableImageWithCapInsets:UIEdgeInsetsMake(0, 4, 0, 0)]forState:UIControlStateNormal]; [myVolumeView setMaximumVolumeSliderImage:[[UIImage imageNamed:@"RightTrackImage"] resizableImageWithCapInsets:UIEdgeInsetsMake(0, 0, 0, 4)]forState:UIControlStateNormal]; </code></pre> <p>This sets the image to have edge insets of 4, you can make that whatever value you would like. </p> <p>I'm not going to fully explain this part, since it is not directly a part of your question. </p>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload