制作一个 UIImageView 圆形，添加边框，并在边框周围添加阴影

Question

我知道那里有类似的问题，但没有找到帮助我解决问题的答案。如果您看过一个，请随意将其标记为重复，但请确保它回答了整个问题，而不仅仅是类似的部分。

我有一个 UIImageView，我正在圆角并为其添加边框。然而，我开始添加一些阴影来给我的 UI 一些深度。我正在为我的个人资料图片添加阴影，以下代码非常适合完美的方形图像，该图像被裁剪成完美的圆形。然而，对于非正方形的矩形图像，阴影被应用到图像本身而不是图像视图，所以我最终在裁剪的矩形图像周围有一个圆形边框，它的边缘周围有一个阴影，没有到达圆形边框。关于如何修改代码以将此阴影应用到边框周围而不是 UIImageView 中的图像的任何见解？

谢谢

//Set profile image view to be rounded (default appears rounded due to alpha background, need rest to appear rounded as well
[self.profileImageView layoutIfNeeded];
CALayer *imageLayer = self.profileImageView.layer;
[imageLayer setCornerRadius:self.profileImageView.frame.size.width/2];
[imageLayer setBorderWidth:1];
[imageLayer setBorderColor:[[UIColor colorWithRed:78.0/255.0 green:82.0/255.0 blue:85.0/255.0 alpha:1] CGColor] ];
[imageLayer setMasksToBounds:YES];

//Apply shadows to necessary views for the job badge
[self.profileImageView.layer setShadowColor:[[UIColor blackColor] CGColor]];
[self.profileImageView.layer setShadowRadius:4.0f];
[self.profileImageView.layer setShadowOffset:CGSizeMake(0, -3)];
[self.profileImageView.layer setShadowOpacity:0.5f];

Answer 1

问题是当你设置cornerRadius时，阴影和其他内容一起被屏蔽了。

您可以在内部使用带有阴影和蒙版 imageView 的中间容器视图。这是代码，但您也可以对 Interface Builder 和自动布局执行相同操作：

UIView *containerView = [[UIView alloc] initWithFrame:CGRectMake(50, 50, 200, 200)];
[containerView.layer setShadowColor:[[UIColor blackColor] CGColor]];
[containerView.layer setShadowRadius:4.0f];
[containerView.layer setShadowOffset:CGSizeMake(0, -3)];
[containerView.layer setShadowOpacity:0.5f];
[self.view addSubview:containerView];

UIImageView *imageView = [[UIImageView alloc] initWithFrame:containerView.bounds];
imageView.image = [UIImage imageNamed:@"rgb"];
[imageView.layer setCornerRadius:imageView.frame.size.width/2];
[imageView.layer setBorderWidth:1];
[imageView.layer setBorderColor:[[UIColor colorWithRed:78.0/255.0 green:82.0/255.0 blue:85.0/255.0 alpha:1] CGColor] ];
[imageView.layer setMasksToBounds:YES];
[containerView addSubview:imageView];

输出：