[Objective-C]MPVolumeViewを使う (外観を変更する)

前回([iOS]MPVolumeViewを使う)のつづき。

iOS7でのMPVolumeViewのデフォルト表示。
defaultVolume
MPVolumeViewは、外観を変更することが出来る。
tintColorの変更で、ツマミの左側の色を変更する。赤色にしてみた。

    myVolumeView.tintColor = [UIColor redColor];

redVolume

画像を用いる場合。

volumeSliderMin@2xvolumeSliderThumb@2xvolumeSliderMax@2x

左から、volumeSliderMin.png, volumeSliderThumb.png, volumeSliderMax.png
Retina用にサイズを2倍したものも用意。

コードは、以下のようになる。

    //// volume viewに画像を指定して、外観を変更する。
    // ツマミの画像
    UIImage* thumbImage = [UIImage imageNamed:@"volumeSliderThumb.png"];
    // Min側の画像
    UIImage* minBase = [UIImage imageNamed:@"volumeSliderMin.png"];
    UIImage* minImage = [minBase resizableImageWithCapInsets:UIEdgeInsetsMake(0, 8, 0, 0)];
    //Max側の画像
    UIImage* maxBase = [UIImage imageNamed:@"volumeSliderMax.png"];
    UIImage* maxImage = [maxBase resizableImageWithCapInsets:UIEdgeInsetsMake(0, 0, 0, 8)];

    //各画像をセット
    [myVolumeView setMinimumVolumeSliderImage:minImage forState:UIControlStateNormal];
    [myVolumeView setMaximumVolumeSliderImage:maxImage forState:UIControlStateNormal];
    [myVolumeView setVolumeThumbImage:thumbImage forState:UIControlStateNormal];

実機では、このようになってほしい。
customVolumeSlider

ところが、iOS7にアップデートしたところ、画像を用いたMPMediaViewの表示がおかしくなった。
使用機種:iPhone 4s
iOSバージョン:iOS7.0.2
volumeを最大にしている状態、すなわちツマミを右端に寄せている状態で描画した場合に発生。
rightPos
そこから、ツマミを移動すると・・・
wrongversion
右端部分がおかしい。
mighihashi

しかたがないので、右側の画像の透明部分をやめて、背景色で塗った。
correctVersion

「[Objective-C]MPVolumeViewを使う (外観を変更する)」への1件のフィードバック

コメントする

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください