web-dev-qa-db-ja.com

clipsToBoundsにより、UIImageはiOS10およびXCode 8で表示されません

プロジェクトをiOS 10およびXCode 8の新しいベータバージョンに切り替えました。使用するアプリの3つの領域すべてで:

imageView.layer.cornerRadius = imageView.frame.size.width/2
imageView.clipsToBounds = true

関連する画像はまったく表示されません。プロジェクトとビルドフォルダーのクリーニング、デバイスの再起動、さまざまなシミュレーターの試用、imageViewの再追加、関連するUIImageをアセットから選択する代わりにプログラムで設定しようとしました。

clipsToBounds行を削除すると、masksToBoundstrueであるかfalseであるかに関係なく、長方形の画像が表示されます。 XCode8/iOS10で円形の画像を作成するにはどうすればよいですか?

編集:プロジェクトはSwift 2.xで、まだSwift 3.0構文に更新されていません。

28
cloudcal

私は同じ問題を抱えていて、すべての丸い角の前にlayoutIfNeededを呼び出すと、_clipsToBoundsが問題を修正しました。 iOS 10 GM with xcode 8 GMは、roundedCornersおよびclipsToBoundsによりビューを非表示にします

44
Pranoy C

この問題は私にも起こりました。

これらのコード_imageView.layer.cornerRadius = imageView.frame.size.width/2_を- (void)awakeFromNibから- (void)drawRect:(CGRect)rectに移動すると、この問題はなくなりました。

ImageViewのサイズは自動レイアウトによって決まります。 iOS 10でペン先から目覚めるとき、高さと幅は決まっていないと思います。

6
VictorJi

これは、ビューがサイズ1000x1000で初期化され、コーナー半径をフレームの半分に設定しようとすると、代わりに500に設定されるiOS 10およびXcode 8以降の新しいバグによる可能性があります。これについては、この質問でさらに詳しく説明しています: Xcode 8およびiOS10以降、viewDidLayoutSubviewsでビューのサイズが適切に設定されていません 。これを考える私の理由は、インターフェイスビルダーで構築されたもののサイズを必要とする何かを行う前に、レイアウトサブビューを呼び出す1000x1000の問題の修正です。

2
Trever123

完全に円形のImageViewがありました。以下はコードです:

_//MARK:- Misc functions
func setProfileImage() {
    imgProfile.layer.masksToBounds = false
    imgProfile.layer.cornerRadius = imgProfile.frame.size.height/2
    imgProfile.clipsToBounds = true
    imgProfile.contentMode = UIViewContentMode.ScaleToFill
} 
_

これはiOS 9で正常に機能します。ただし、_in iOS 10 Xcode 8 the ImageView disappears._デバッグ後、ClipsToBoundが原因です

したがって、コードをviewDidLayoutSubviews()に配置すると、問題が解決しました。

_override func viewDidLayoutSubviews() {
    setProfileImage()
}
_

self.view.layoutIfNeeded()を使用することもできます

1

同じ問題がありました。電話には表示されませんが、ストーリーボードとUIデバッガーに最適です。また、プロジェクトを8ではなく「Xcode 7で開く」を入れたときにも機能していましたが、満足できるソリューションではありませんでした。それで私は問題を掘り起こし、発見しました。問題は、次のようなクラスでした。

_@IBDesignable public class MyButton: UIButton {

   @IBInspectable var styleName: String = "" {
        didSet {
            switch styleName {
            case "RoundedLight":
                tintColor = UIColor.lightPinkColor()
                layer.borderColor = UIColor.whiteColor().CGColor
                layer.borderWidth = 1
                layer.masksToBounds = true
            default:
                break
            }
        }
    }

    override public func layoutSubviews() {
        super.layoutSubviews()

        switch styleName {
            case "RoundedLight":
                layer.cornerRadius = frame.height / 2
            default:
                break
        }
    }
}
_

私はこれをこれに変更し、今すぐ動作します:

_@IBDesignable public class MyButton: UIButton {

   @IBInspectable var styleName: String = "" {
        didSet {
            layoutIfNeeded()
        }
    }

    override public func layoutSubviews() {
        super.layoutSubviews()

        switch styleName {
        case "RoundedLight":
            tintColor = UIColor.lightPinkColor()
            layer.borderColor = UIColor.whiteColor().CGColor
            layer.borderWidth = 1
            layer.cornerRadius = frame.height / 2
            layer.masksToBounds = true
        default:
            break
        }
    }
}
_

上記のどれも私のために機能しなかったことに注意してください、そして私は意味します:

  • layoutSubviews()layoutIfNeededを呼び出す
  • ボタン(またはボタンを含むセル)のlayoutIfNeededawakeFromNibを呼び出す
  • セルのlayoutIfNeededlayoutSubviewを呼び出す
  • セルのawakeFromNibcontentView.layoutIfNeeded()を呼び出す
  • ビューコントローラーでview.layoutIfNeeded()を呼び出す
1
Livio

レイアウトの問題である可能性があります。 clipToBoundsをfalseに設定すると、サイズがゼロの場合でも画像が表示されます。画像のframeを印刷できますか?

cornerRadiusclipToBoundsおよびviewDidLoadプロパティを設定した場合は、viewDidLayoutSubviews()で設定してみてください。

self.view.layoutIfNeeded()を呼び出すこともできます。

0
Yann Bodson

Obj-cを使用して、構文をviewDidLoadからviewDidLayoutSubviewsに移動しました。

0
Teffi

このように角を丸くしただけです

@implementation RoundImageView

- (instancetype)initWithCoder:(NSCoder *)coder
{
    self = [super initWithCoder:coder];
    if (self) {
        self.layer.masksToBounds = YES;
        self.layer.cornerRadius = MIN(self.bounds.size.height, self.bounds.size.width)/2;
        [self addObserver:self
               forKeyPath:@"bounds"
                  options:NSKeyValueObservingOptionNew
                  context:(__bridge void * _Nullable)(self)];
    }
    return self;
}

-(void)dealloc
{
    [self removeObserver:self
              forKeyPath:@"bounds"
                 context:(__bridge void * _Nullable)(self)];
}

-(void)observeValueForKeyPath:(NSString *)keyPath
                     ofObject:(id)object
                       change:(NSDictionary<NSString *,id> *)change
                      context:(void *)context
{
    if(context == (__bridge void * _Nullable)(self) && object == self && [keyPath isEqualToString:@"bounds"])
    {
        self.layer.cornerRadius = MIN(self.bounds.size.height, self.bounds.size.width)/2;
    }
}

@end

だからalwaysは適切に丸い角を持っています。そして、iOS10とXCode8へのアップグレードに問題はありませんでした

0

@Pranoy Cが言ったように、丸いコーナーを設定してサブビューをクリップするため、問題が発生すると思います。

ユーザーのプロフィール写真を表示するテーブルビューセルにlayoutIfNeededを使用して問題を解決しました。画像が丸いコーナーであることを確認したい

コードは次のとおりです。-(void)awakeFromNib {[super awakeFromNib]; [self layoutIfNeeded];

[self.inputIndicator_imageView.image imageWithRenderingMode:UIImageRenderingModeAlwaysTemplate];
self.profile_pic_edit_imageView.layer.cornerRadius = self.profile_pic_edit_imageView.frame.size.width/2;
self.profile_pic_edit_imageView.layer.borderWidth = 1.0;
self.profile_pic_edit_imageView.layer.borderColor = GRAY_COLOR_SUPER_LIGHT.CGColor;
self.profile_pic_edit_imageView.clipsToBounds = YES;}
0
wong wai