ios - UITableView 中的圆形 UIImageView 没有性能影响？

Question

我的UIImageView每个UITableView单元格上都有一个，显示一个远程图像（使用SDWebImage）。我QuartzCore对图像视图做了一些图层样式，如下所示：

UIImageView *itemImageView = (UIImageView *)[cell viewWithTag:100];
    itemImageView.layer.borderWidth = 1.0f;
    itemImageView.layer.borderColor = [UIColor concreteColor].CGColor;
    itemImageView.layer.masksToBounds = NO;
    itemImageView.clipsToBounds = YES;

所以现在我有一个带有浅灰色边框的 50x50 正方形，但我想让它变成圆形而不是正方形。该应用程序Hemoglobe在表格视图中使用圆形图像，这就是我想要实现的效果。但是，我不想使用cornerRadius，因为这会降低我的滚动 FPS。

这是Hemoglobe显示循环UIImageViews：

在此处输入图像描述

有什么办法可以达到这种效果吗？谢谢。

score 142 · Accepted Answer

只需将设置cornerRadius为宽度或高度的一半（假设您的对象的视图是正方形的）。

例如，如果您的对象视图的宽度和高度都是 50：

itemImageView.layer.cornerRadius = 25;

更新 - 正如用户 atulkhatri 指出的那样，如果您不添加，它将无法工作：

itemImageView.layer.masksToBounds = YES;

score 38 · Accepted Answer

添加边框

self.ImageView.layer.borderWidth = 3.0f;

self.ImageView.layer.borderColor = [UIColor whiteColor].CGColor;

对于圆形

self.ImageView.layer.cornerRadius = self.ImageView.frame.size.width / 2;
self.ImageView.clipsToBounds = YES;

参考这个链接

http://www.appcoda.com/ios-programming-circular-image-calayer/

score 14 · Accepted Answer

使用此代码..这将很有帮助..

    UIImage* image = ...;
    UIGraphicsBeginImageContextWithOptions(imageView.bounds.size, NO, 1.0);
    // Add a clip before drawing anything, in the shape of an rounded rect
    [[UIBezierPath bezierPathWithRoundedRect:imageView.bounds
                                cornerRadius:50.0] addClip];
    // Draw your image
    [image drawInRect:imageView.bounds];

    // Get the image, here setting the UIImageView image
    imageView.image = UIGraphicsGetImageFromCurrentImageContext();

    // Lets forget about that we were drawing
    UIGraphicsEndImageContext();

这对我来说可以。:)

score 10 · Accepted Answer

这是一个使用 IBDesignable 和 IBInspectable 子类化 UIImageView 的 swift 中更新的方法

@IBDesignable class RoundableUIImageView: UIImageView {
    private var _round = false
    @IBInspectable var round: Bool {
        set {
            _round = newValue
            makeRound()
        }
        get {
            return self._round
        }
    }
    override internal var frame: CGRect {
        set {
            super.frame = newValue
            makeRound()
        }
        get {
            return super.frame
        }

    }

    private func makeRound() {
        if self.round == true {
            self.clipsToBounds = true
            self.layer.cornerRadius = (self.frame.width + self.frame.height) / 4
        } else {
            self.layer.cornerRadius = 0
        }
    }

    override func layoutSubviews() {
            makeRound()
    }
}

score 7 · Accepted Answer

Yes, it is possible to give layer.cornerRadius (need to add #import <QuartzCore/QuartzCore.h>)
for create circular any control but in your case instead of set layer of UIImageView it is The Best Way to Create Your Image as circular and add it on UIImageView Which have backGroundColor is ClearColor.

Also refer this Two Source of code.

https://www.cocoacontrols.com/controls/circleview

and

https://www.cocoacontrols.com/controls/mhlazytableimages

This might be helpful in your case:

score 3 · Accepted Answer

将 UIImageView 的高度和宽度设置为相同，例如：Height=60& Width = 60，然后cornerRadius应该正好是一半。在我的情况下，我将它保持为 30。它对我有用。

 self.imageView.layer.cornerRadius = 30;
 self.imageView.layer.borderWidth = 3;
 self.imageView.layer.borderColor = [UIColor whiteColor].CGColor;
 self.imageView.layer.masksToBounds = YES;

score 2 · Accepted Answer

Usable solution in Swift using extension:

extension UIView{
  func circleMe(){
      let radius = CGRectGetWidth(self.bounds) / 2
      self.layer.cornerRadius = radius
      self.layer.masksToBounds = true
  }
}

Usage:

self.venueImageView.circleMe()

score 2 · Accepted Answer

如果使用一些自动布局和不同的单元格高度，你最好这样做：

   override func layoutSubviews() {
        super.layoutSubviews()
        logo.layer.cornerRadius = logo.frame.size.height / 2;
        logo.clipsToBounds      = true;
    }

score 1 · Accepted Answer

我使用的是 Round Image View 类……所以我只是使用它而不是 UIImageView，并且没有什么可调整的……</p>

此类还在圆周围绘制可选边框。圆形图片周围通常有边框。

它不是 UIImageView 的子类，因为 UIImageView 有自己的渲染机制，并且不调用 drawRect 方法。

界面：

#import <UIKit/UIKit.h>

@interface MFRoundImageView : UIView

@property(nonatomic,strong) UIImage* image;

@property(nonatomic,strong) UIColor* strokeColor;
@property(nonatomic,assign) CGFloat strokeWidth;

@end

执行：

#import "MFRoundImageView.h"


@implementation MFRoundImageView

-(void)setImage:(UIImage *)image
{
    _image = image;
    [self setNeedsDisplay];
}

-(void)setStrokeColor:(UIColor *)strokeColor
{
    _strokeColor = strokeColor;
    [self setNeedsDisplay];
}

-(void)setStrokeWidth:(CGFloat)strokeWidth
{
    _strokeWidth = strokeWidth;
    [self setNeedsDisplay];
}

- (void)drawRect:(CGRect)rect {
    CGContextRef ctx = UIGraphicsGetCurrentContext();
    CGPathRef path = CGPathCreateWithEllipseInRect(self.bounds, NULL);
    CGContextAddPath(ctx, path);
    CGContextClip(ctx);
    [self.image drawInRect:rect];

    if ( ( _strokeWidth > 0.0f ) && _strokeColor ) {
        CGContextSetLineWidth(ctx, _strokeWidth*2); // Half border is clipped
        [_strokeColor setStroke];
        CGContextAddPath(ctx, path);
        CGContextStrokePath(ctx);
    }
    CGPathRelease(path);
}

@end

score 0 · Accepted Answer

如果您在纯色背景颜色上显示图像，一个简单的解决方案可能是使用中间带有透明圆圈的叠加图像。

这样，您仍然可以使用方形图像并在其上方添加圆形图像以获得圆形效果。

如果您不需要处理图像或在复杂的背景颜色上显示它们，这可能是一个简单的解决方案，不会影响性能。

score 0 · Accepted Answer

使用下面的 SO 链接创建圆形图像视图非常简单，只需为您的表格视图设置自定义单元格，而不是在 cellForRowAtIndexPath 方法中分配所有内容。

如何在 iPhone 中使用图像背景制作圆形按钮？

上面的链接为您提供了按钮示例，只需将其用于您的图像视图。

score 0 · Accepted Answer

在 swift中，在您的viewDidLoad方法中，使用userImage插座：

self.userImage.layer.borderWidth = 1;
self.userImage.layer.borderColor = UIColor.whiteColor().CGColor;
self.userImage.layer.cornerRadius = self.userImage.frame.size.width / 2;
self.userImage.clipsToBounds = true;

score 0 · Accepted Answer

在 Swift 中，将此扩展用于 CircularImageView 或 RoundedImageView ：

extension UIView {

    func circular(borderWidth: CGFloat = 0, borderColor: UIColor = UIColor.whiteColor()) {
        let radius = CGRectGetWidth(self.bounds) / 2
        self.layer.cornerRadius = radius
        self.layer.masksToBounds = true

        self.layer.borderWidth = borderWidth
        self.layer.borderColor = borderColor.CGColor
    }

    func roundedCorner(borderWidth: CGFloat = 0, borderColor: UIColor = UIColor.whiteColor()) {
        let radius = CGRectGetWidth(self.bounds) / 2
        self.layer.cornerRadius = radius / 5
        self.layer.masksToBounds = true

        self.layer.borderWidth = borderWidth
        self.layer.borderColor = borderColor.CGColor
    }

}

用法：

self.ImageView.circular()
self.ImageView.roundedCorner()

score 0 · Accepted Answer

对于圆形图像视图，请使用以下代码。

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

不要忘记在 UIView 的 viewDidLayoutSubviews 方法中更改cornerRadius。

例子：

override func viewDidLayoutSubviews() {
    super.viewDidLayoutSubviews()
    self.imageView.layer.cornerRadius = self.imageView.frame.size.width / 2;
    self.imageView.clipsToBounds = true
}

ios - UITableView 中的圆形 UIImageView 没有性能影响？

14 回答 14

Related

Reference