【发布时间】：2014-11-02 12:01:57
【问题描述】：
我们可以用UIImageView在图像上设置下面的形状吗？
任何想法！
谢谢
【问题讨论】：
标签： ios objective-c uiimageview uiimage
【发布时间】：2014-11-02 12:01:57
【问题描述】：
Swift 3 版本 - 带边框
像其他人建议的那样，我会使用图像的 mask 属性。
来自 Apple 关于 mask 属性的信息：
图层的 Alpha 通道决定了图层的内容和背景有多少可以透过。完全或部分不透明的像素允许底层内容显示出来，但完全透明的像素会阻止该内容。 此属性的默认值为 nil nil。
在配置遮罩时，请记住设置遮罩层的大小和位置，以确保它与被遮罩的层正确对齐。
最后一句话很重要！
1。创建你的面具
我使用 Sketch 创建了一张带有透明背景 (PNG) 的黑色图像。
将其添加到您的 Assets.xcassets 文件夹中。我的图片名为profileMask。
2。将 UIImageView 添加到情节提要
为图像视图创建一个出口。我打电话给我的profileImageView。
3。代码 viewDidLoad
override func viewDidLoad() {
super.viewDidLoad()
let maskImageView = UIImageView()
maskImageView.contentMode = .scaleAspectFit
maskImageView.image = #imageLiteral(resourceName: "profileMask")
maskImageView.frame = profileImageView.bounds
profileImageView.mask = maskImageView
}
注意：
- 我添加了 contentMode，因为没有它，我的蒙版会拉伸以匹配 UIImageView 的边界（宽度）。你可以通过让你的 UIImageView 和你的蒙版图片一样大小来解决这个问题，反之亦然。
边界呢？
伙计们，这样做很痛苦。我试图创建一个贝塞尔路径，但老实说，我无法制作出与面具相匹配的精确形状。如果您有这样做的技能，贝塞尔路径可能看起来非常好，但我没有。 :(
于是我有了一个想法，“如果我只使用蒙版图像作为边框呢？”有效！这样做的好处是您将来可以使用任何蒙版形状，它会为其创建边框，而无需计算贝塞尔路径。
我是这样做的：
- 在 Assets.xcassets 中，选择您的遮罩并将此 Render As 属性更改为“模板图像”。这允许您通过更改 UIImageView 的 Tint Color 属性来更改蒙版图像的颜色
- 然后在代码中，我将
profileImageView设置为蒙版，并将色调颜色更改为我想要的边框。 - 然后，我为 Jason 的个人资料图片创建了另一个图像视图，并为其应用了蒙版。我将其设置为与
profileImageView相同的大小减去 2 个点（以显示将成为边框的底层蒙版图像）。 - 最后一步是向他们添加蒙版图像作为
profileImageView的子视图。
现在是 viewDidLoad 中的代码：
override func viewDidLoad() {
super.viewDidLoad()
// Add border first (mask image)
profileImageView.contentMode = .scaleAspectFit
profileImageView.tintColor = .lightGray // Border Color
profileImageView.image = #imageLiteral(resourceName: "profileMask")
// Profile Image
let profileImage = UIImageView()
profileImage.image = #imageLiteral(resourceName: "Profile")
profileImage.contentMode = .scaleAspectFill
// Make a little bit smaller to show "border" image behind it
profileImage.frame = profileImageView.bounds.insetBy(dx: 2, dy: 2)
// Mask Image
let maskImageView = UIImageView()
maskImageView.image = #imageLiteral(resourceName: "profileMask")
maskImageView.contentMode = .scaleAspectFit
maskImageView.frame = profileImage.bounds
// Apply mask to profile iamge
profileImage.mask = maskImageView
// Add profile image as a subview on top of the "border" image
profileImageView.addSubview(profileImage)
}
所以现在我们运行它时看起来像这样：
结束
如果我们创建一个带有遮罩和边框宽度属性的自定义 UIImageView，那可能会很酷。然后您可以分配这些属性，而自定义类将负责其余的工作。如果你们想看到这样的东西，请告诉我，我会创建它并将其发布在这里。或许还可以为我的频道制作 YouTube 视频教程。
【讨论】：
口罩UIImageView
你可以使用imageView的CALayer的mask属性：
CALayer *mask = [CALayer layer];
mask.contents = (id)[[UIImage imageNamed:@"mask.png"] CGImage];
mask.frame = CGRectMake(0, 0, imageView.image.size.width, imageView.image.size.height);
imageView.layer.mask = mask;
imageView.layer.masksToBounds = YES;
将核心图形掩码应用于UIImage
这仅适用于 ImageView，因此如果您想直接更改 UIImage - 您应该使用 Core Graphics 掩码：
- (UIImage*) maskImage:(UIImage *)image withMask:(UIImage *)maskImage {
CGImageRef maskRef = maskImage.CGImage;
CGImageRef mask = CGImageMaskCreate(CGImageGetWidth(maskRef),
CGImageGetHeight(maskRef),
CGImageGetBitsPerComponent(maskRef),
CGImageGetBitsPerPixel(maskRef),
CGImageGetBytesPerRow(maskRef),
CGImageGetDataProvider(maskRef), NULL, false);
CGImageRef maskedImageRef = CGImageCreateWithMask([image CGImage], mask);
UIImage *maskedImage = [UIImage imageWithCGImage:maskedImageRef];
CGImageRelease(mask);
CGImageRelease(maskedImageRef);
// returns new image with mask applied
return maskedImage;
}
使用混合的核心图形图像合成
斯威夫特 5.
let image = UIImage(named: "Lenna.png")!
let mask = UIImage(named: "mask-image.png")! // background is transparent
let size = image.size
let renderer = UIGraphicsImageRenderer(size: size)
let newImage = renderer.image { context in
image.draw(in: CGRect(origin: .zero, size: size), blendMode: .normal, alpha: 1)
mask.draw(in: CGRect(origin: .zero, size: size), blendMode: .destinationIn, alpha: 1)
}
游乐场：
【讨论】：
-
这仅适用于白色背景，不透明。如何使用透明背景来完成这项工作？
-
@FreeAppl3 “不工作”是什么意思？不敷面膜？还是申请后背景不对？这个答案也有2个解决方案，你都试过了吗？
-
@FreeAppl3 最好用您的代码和示例图像在那里创建新问题。
-
我从来没有说过它“不工作”不知道你的意思是什么，但是如果面具背景是透明的，它就不会应用面具，这就是最初的问题所使用的.此方法适用于遮罩和白色背景的黑色区域。不想重复问题。
-
@FreeAppl3 检查更新的答案。我添加了透明背景混合的解决方案（如果我理解正确的话）。
是的，您可以在 UIImage 上设置形状。首先，在您的项目中添加一个蒙版图像（您想要的形状）。并编写这些代码。
[yourImageView setImage:[self createMaskImage:yourImage withMask:MaskImage]];
- (UIImage*) createMaskImage:(UIImage *)image withMask:(UIImage *)maskImage {
CGImageRef maskRef = maskImage.CGImage;
CGImageRef mask = CGImageMaskCreate(CGImageGetWidth(maskRef),
CGImageGetHeight(maskRef),
CGImageGetBitsPerComponent(maskRef),
CGImageGetBitsPerPixel(maskRef),
CGImageGetBytesPerRow(maskRef),
CGImageGetDataProvider(maskRef), NULL, false);
CGImageRef masked = CGImageCreateWithMask([image CGImage], mask);
return [UIImage imageWithCGImage:masked];
}
【讨论】：
-
我不知道为什么，但他的相同代码对我不起作用。
-
我不知道如何使图像中心部分的曲线形状像苗条，所以任何人都知道这个概念，请告诉我。我的项目主图像视图图像一些选定的部分，如身材苗条任何人都知道请帮助这个概念目标 c
抱歉硬编码。尝试使用UIBezierPath 设置您想要的任何形状。
CAShapeLayer* maskLayer = [CAShapeLayer layer];
UIBezierPath* path = [UIBezierPath bezierPath];
[path moveToPoint:CGPointMake(75, 200)];
[path addCurveToPoint:CGPointMake(0, 100) controlPoint1:CGPointMake(0, 150) controlPoint2:CGPointMake(0, 150)];
[path addArcWithCenter:CGPointMake(75, 100) radius:75 startAngle:M_PI endAngle:0 clockwise:YES];
[path addCurveToPoint:CGPointMake(75, 200) controlPoint1:CGPointMake(150, 150) controlPoint2:CGPointMake(150, 150)];
[path closePath];
maskLayer.backgroundColor = [[UIColor clearColor] CGColor];
maskLayer.path = [path CGPath];
yourImageView.layer.mask = maskLayer;
【讨论】：
使用起来很简单
UIImageView *image=[[UIImageView alloc]initWithImage:[UIImage imageNamed:@"balloon_selected_left.png"] ];
self.maskImage.layer.mask=image.layer;
【讨论】：