iOS：带边框的圆angular矩形出血颜色

我通过将cornerRadius应用到UIImageView的图层，并通过borderWith和borderColor添加边框来绘制圆angular头像。 像这样：

 self.layer.masksToBounds = YES; self.layer.cornerRadius = imageDimension / 2.f; self.layer.borderWidth = 1.f; self.layer.borderColor = borderColor.CGColor; 

这样做效果很好，除了边界之外的这些微小但明显的内容泄露外，像这样：

有没有一种方法可以让边界突破几个1/10点，或者将内容插入到边界之外呢？

---

解

感谢FelixLam，我提出了一个很好的解决scheme，并将在这里留给后世：

 @interface MMRoundImageViewWithBorder : UIView - (id)initWithImage:(UIImage *)image borderWidth:(CGFloat)borderWidth; @property (strong, nonatomic) UIImageView *imageView; @property (assign, nonatomic) CGFloat borderWidth; @property (strong, nonatomic) UIColor *borderColor; @end @implementation MMRoundImageViewWithBorder - (id)initWithImage:(UIImage *)image borderWidth:(CGFloat)borderWidth { if (self = [super init]) { self.borderWidth = borderWidth; self.borderColor = UIColor.whiteColor; self.imageView = [[UIImageView alloc] initWithImage:image]; [self addSubview:self.imageView]; self.imageView.layer.masksToBounds = YES; self.layer.masksToBounds = YES; } return self; } - (void)setBorderColor:(UIColor *)borderColor { _borderColor = borderColor; self.backgroundColor = borderColor; } - (void)layoutSubviews { [super layoutSubviews]; [self refreshDimensions]; } - (void)refreshDimensions { self.layer.cornerRadius = CGRectGetWidth(self.bounds) / 2.f; self.imageView.frame = CGRectInset(self.bounds, _borderWidth, _borderWidth); self.imageView.layer.cornerRadius = CGRectGetWidth(self.imageView.bounds) / 2.f; } - (void)setBorderWidth:(CGFloat)borderWidth { _borderWidth = borderWidth; [self refreshDimensions]; } - (void)setFrame:(CGRect)frame { [super setFrame:frame]; [self refreshDimensions]; } @end 

Answer 1

您可以尝试使用具有圆形path的CAShapelayer作为图层的蒙版，而不是使用圆angular半径。

或者，您可以将图像视图放在具有边框并且大一个/两个像素的容器中。

Answer 2

正如评论所说，你可以添加一个透明的边框到图像，所以它会好的。 下面是一段代码（UIImageView的一个类）：

 + (UIImage *)imageWithImage:(UIImage *)image withTransparentBorderOfWidth:(CGFloat)width { CGSize size = image.size; UIGraphicsBeginImageContextWithOptions(CGSizeMake(size.width + width * 2, size.height + width * 2), NO, 0.0); [image drawInRect:CGRectMake(width, width, size.width, size.height)]; image = UIGraphicsGetImageFromCurrentImageContext(); UIGraphicsEndImageContext(); return image; } 

Answer 3

OP的解决scheme是不必要的复杂。 更简单，更清洁的解决scheme 像上面创build一个UIView，剪辑到边界，掩码，边框和angular半径，然后添加一个UIIamgeview作为该UIView的子视图。 UIIamgeview将被父视图剪辑，你不会有stream血的问题。

Answer 4

我的UIButton需要一个圆angular圆angular，导致锯齿状的边缘。 设置borderStyle为.roundedRect修复它。

 button.borderStyle = .roundedRect button.layer.cornerRadius = 4 button.layer.borderWidth = 1 button.layer.borderColor = .red.cgColor 

Answer 5

尝试设置：

 [self setClipToBounds:YES] 

Answer 6

我有同样的问题，想要一个解决scheme，可以与故事板很好地工作。 我所做的是将我的图像放在视图中，然后将其设置为控制行为的自定义类。 我现在可以完全控制故事板的devise。

我已经把代码放在GitHub上。

https://github.com/brennanMKE/CircleButton

它所做的是重写UIView中的drawRect函数，用于UIButton和普通的UIView，所以它可以处理很多视图。 包装视图也被用来控制边框的颜色和宽度。 我只是确保包装视图和超级视图之间有一些余量，并使用差异作为边框宽度。 superview的背景颜色成为边框颜色。 现在，我可以在Storyboard的许多场景中快速进行这些更改，而无需对每个实例进行自定义编码。

 - (void)drawRect:(CGRect)rect { // round view and superview with a border using the background color of the superview self.layer.cornerRadius = CGRectGetWidth(self.frame) / 2; self.layer.masksToBounds = YES; if ([self.superview isKindOfClass:[SSTCircleWrapperView class]]) { self.superview.layer.cornerRadius = CGRectGetWidth(self.superview.frame) / 2; self.superview.layer.masksToBounds = YES; self.superview.layer.borderColor = self.superview.backgroundColor.CGColor; self.superview.layer.borderWidth = (CGRectGetWidth(self.superview.frame) - CGRectGetWidth(self.frame)) / 2; } }