web-dev-qa-db-ja.com

サークルフレームiOS内の画像

連絡先のリストを含むuitableviewがあります。マーベリックスのログイン画面のように、各連絡先の画像を丸枠で囲みたい。 uitableviewCellでこれを行う方法の提案はありますか?

enter image description here

22
jonas vermeulen

あなたはあなたのCell内にあなたのimageViewを持っていると思います、それであなたが同じ効果を持つためにあなたがしなければならないことは見えない境界を使うことです。この効果を実現するには、次のコードを使用します。

cell.yourImageView.layer.cornerRadius = cell.yourImageView.frame.size.height /2;
cell.yourImageView.layer.masksToBounds = YES;
cell.yourImageView.layer.borderWidth = 0;

UIImageViewは同じ高さと幅でなければなりません。また、プロジェクトにquartzCoreフレームワークをインポートする必要があります。

76
Mirko Catalano

どうやらこのような丸みを帯びた四角形を作ることができます

float fw, fh;
if (ovalWidth == 0 || ovalHeight == 0) {
    CGContextAddRect(context, rect);
    return;
}
CGContextSaveGState(context);
CGContextTranslateCTM (context, CGRectGetMinX(rect), CGRectGetMinY(rect));
CGContextScaleCTM (context, ovalWidth, ovalHeight);
fw = CGRectGetWidth (rect) / ovalWidth;
fh = CGRectGetHeight (rect) / ovalHeight;
CGContextMoveToPoint(context, fw, fh/2);
CGContextAddArcToPoint(context, fw, fh, fw/2, fh, 1);
CGContextAddArcToPoint(context, 0, fh, 0, fh/2, 1);
CGContextAddArcToPoint(context, 0, 0, fw/2, 0, 1);
CGContextAddArcToPoint(context, fw, 0, fw, fh/2, 1);
CGContextClosePath(context);
CGContextRestoreGState(context);

画像を中に入れると、自動的に切り取られます:

 CGContextRef context = UIGraphicsGetCurrentContext();
CGContextSaveGState(context);
addRoundedRectToPath(context, self.frame, 10, 10);
CGContextClip(context);
[image drawInRect:self.frame];
CGContextRestoreGState(context);
1
jonas vermeulen