首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
社区首页 >问答首页 >如何使用圆形遮罩正方形图像并在图像周围放置黑色边框?

如何使用圆形遮罩正方形图像并在图像周围放置黑色边框?
EN

Stack Overflow用户
提问于 2012-10-26 05:40:34
回答 1查看 5K关注 0票数 4

我有一个40x40的正方形图像,我想通过裁剪使它变圆,但也要在图像周围放置一个5像素的黑色边框。

我有以下几个掩蔽正方形的图像,所以它现在是圆形的

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
 UIImage *image = self.imageView.image;
        CGSize imageSize = image.size;
        CGRect imageRect = CGRectMake(0, 0, imageSize.width, imageSize.height);

        UIGraphicsBeginImageContextWithOptions(imageSize, NO, 0.0);
        // Create the clipping path and add it
        UIBezierPath *path = [UIBezierPath bezierPathWithOvalInRect:imageRect];
        [path addClip];


        [image drawInRect:imageRect];
        UIImage *roundedImage = UIGraphicsGetImageFromCurrentImageContext();
        UIGraphicsEndImageContext();

        self.imageView.image = roundedImage;

但现在我还需要在它周围添加一个圆形边框。我是否需要一个新的路径,或者我是否可以直接添加到上面代码中的路径?

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2012-10-26 06:25:18

在您的代码中添加以下三行(具有所需的颜色和笔触宽度):

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
CGContextSetStrokeColorWithColor(ctx, [[UIColor greenColor] CGColor]);
[path setLineWidth:50.0f];
[path stroke];

所以它变成了:

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
UIGraphicsBeginImageContextWithOptions(imageSize, NO, 0.0);
CGContextRef ctx = UIGraphicsGetCurrentContext();
// Create the clipping path and add it
UIBezierPath *path = [UIBezierPath bezierPathWithOvalInRect:imageRect];
[path addClip];
[image drawInRect:imageRect];

CGContextSetStrokeColorWithColor(ctx, [[UIColor greenColor] CGColor]);
[path setLineWidth:50.0f];
[path stroke];

UIImage *roundedImage = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();

self.imageView.image = roundedImage;
票数 12
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/13081356

复制
相关文章
圆形载体图像
算法:圆形载体是为了更好地检测出人脸,在图像上绘制不同颜色和角度的圆形的基础操作。除此之外,还有绘制直线、矩形、圆、椭圆等多种几何图形,并且可以在图像中的指定位置添加文字说明。x=numpy.random.randint(low, high=None, size=None, dtype='l')
裴来凡
2022/05/28
1.3K0
圆形载体图像
选出在正方形中含有不同大小的圆形的图像。
answerQ7.m function noCircleWithNoHole = answerQ7( img ) %answerQ7 This function calculate number of circle object with no holes in image img=imread('C:\Users\xpp\Desktop\FCIS-Image-Processing-Course-s-Tasks--master\Morphology\test.png'); i = rgb2gray(img
裴来凡
2022/05/28
7890
选出在正方形中含有不同大小的圆形的图像。
圆形收缩显示图像效果
<!doctype html> <html> <head> <style> div{width:300px;height:300px;border-radius:50%;overflow:hidden;position:relative;} div img{width:100%;height:100%;} div span{position:absolute;left:0;top:0;width:100%;height:100%; border-color:black; border-style:sol
用户1730674
2018/05/02
1.5K0
圆形收缩显示图像效果
前端 + AI —— 走进无码时代
导语:前端智能化,就是通过AI/CV技术,使前端工具链具备理解能力,进而辅助开发提升研发效率,比如实现基于设计稿智能布局和组件智能识别等。
Y.one
2020/09/01
1.3K0
前端 + AI —— 走进无码时代
Windows下使用海康相机SDK获取图像并在Qt显示
点击上方蓝字可直接关注!方便下次阅读。如果对你有帮助,可以点个在看,让它可以帮助到更多同志
用户5908113
2020/03/11
5.2K2
Windows下使用海康相机SDK获取图像并在Qt显示
IOS – OpenGL ES 设置图像反遮罩锐化 GPUImageUnsharpMaskFilter
GPUImageUnsharpMaskFilter 属于 GPUImage 图像处理相关,用来图像反遮罩锐化,shader 源码如下:
猿说编程[Python和C]
2023/03/25
5120
C#使用OpenCV剪切图像中的圆形和矩形
首先创建一个Wpf项目——WpfOpenCV,这里版本使用Framework4.7.2。
Kiba518
2021/03/11
3.8K2
C#使用OpenCV剪切图像中的圆形和矩形
ArUco的生成与检测
ArUco是一个开源的小型的AR虚拟现实增强库,已经集成在OpenCV3.0以上的版本,它除了用于现实增强,还很用于实现一些机器视觉方面的应用。
点云PCL博主
2022/02/10
3.2K0
ArUco的生成与检测
8.wxPython设置图像遮罩(mask)的方法
以上面这幅图画为例,嫁接昨天的桌面宠物代码,我们讲解wxPython图像处理为图像设置遮罩的方法。wxPython图像处理类有wx.Image和wx.Bitmap,其中wx.Image是一个与平台无关的类,可以加载各种格式的图形文件,而wx.Bitmap可以将图形显示在屏幕。一般先由wx.Image将图像文件加载,然后转换成wx.Bitmap对象,最后显示在屏幕上。wx.Image有两个函数可以设置图像遮罩:SetMaskColour和SetMaskFromImage,wx.Bitmap有一个函数可以设置图像遮罩:SetMaskColour。今天我们的代码就通过三个函数都实现了图片背景图像遮盖掉的目的。具体实现语句在img.SetMaskColour(255, 242,0),img.SetMaskFromImage(img,255, 242,0),self.bg.SetMaskColour((255, 242,0))三处。
用户4381798
2020/07/30
1.2K0
使用颜色空间进行图像分割
原文地址:https://realpython.com/python-opencv-color-spaces/
努力努力再努力F
2018/10/08
6.1K0
使用颜色空间进行图像分割
JAVA 将图片剪裁成圆形,并在圆形外带有白边
最近在做关于社交项目时,用到了二维码中间带图片logo的功能,但是要求图片为圆形,于是找到了java剪裁图片为圆形的工具类,并同时在圆形外围带有白边,不多说,直接上代码:
一诺千金
2020/04/30
5.4K1
【数字图像处理】LeetCode与图像处理(连通域的计算)
在图像中,最小的单位是像素,每个像素周围有 8 个邻接像素,常见的邻接关系有 2 种:4 邻接与 8 邻接。4 邻接一共 4 个点,即上下左右、8 邻接的点一共有 8 个,包括了对角线位置的点,如下图所示
机器视觉CV
2020/07/31
3.3K0
【数字图像处理】LeetCode与图像处理(连通域的计算)
C++ OpenCV轮廓周围矩形和圆形绘制
前面我们学习了轮廓提取,正常我们在提到到轮廓截取出来时一般需要是矩形的图像,这次我们就来学习一下轮廓周围绘制矩形等。
Vaccae
2019/07/24
2.5K0
如何使用 OpenCV 实现图像均衡?
我们已经练习了很多图像处理——操作图像(精确地说是图像矩阵)。为此,我们探索了图像的均衡方法,以便在一定程度上增强对比度,以使被处理的图像看起来比原始图像更好,这种技术称为直方图均衡化。
AI科技大本营
2021/05/10
1.2K0
如何使用 OpenCV 实现图像均衡?
每个前端开发需要了解的10个强大的CSS属性
快来免费体验ChatGpt plus版本的,我们出的钱 体验地址:https://chat.waixingyun.cn 可以加入网站底部技术群,一起找bug,另外新版作图神器已上线 https://cube.waixingyun.cn/home
前端小智@大迁世界
2023/07/09
2760
每个前端开发需要了解的10个强大的CSS属性
如何使用几何画板画函数图像,如极坐标函数图像?
1、点击[绘图] 2、点击[网格样式] 3、点击[极坐标网格] 4、点击[绘图] 5、点击[绘制新函数] 6、点击[3] 7、点击[函数] 8、点击[cos] 9、点击[θ] 10、点击[确定] 11、点击[是]
裴来凡
2022/05/28
1.3K0
如何使用几何画板画函数图像,如极坐标函数图像?
canvas 快速入门
在本文中,我们将学习Canvas的特性,包括如何在HTML文档中引入Canvas以及在Canvas上绘制图形和各种对象。我们也将学习如何修改绘制在Canvas上的图形和对象,以及如何擦除它们。最后,将通过一个例子来学习如何将Canvas,尺寸设置为浏览器窗口的大小。
用户8921923
2022/10/24
1.7K0
canvas 快速入门
​canvas 高级功能(中)
在本文中,你将学习到 Canvas 提供的一些更高级的功能。本文将讲述如何合成、创建阴影使图形看起来更真实有趣。本文内容非常精彩,我希望这些内容能够拓宽你的眼界,帮助你学会画布的高级功能。
用户8921923
2022/10/24
8520
​canvas 高级功能(中)
详解视觉误差对UI设计的影响和解决方案
视觉误差会对UI造成什么样的影响,业界内流行的解决方案又有哪些,本文将以超过五十个例子为你讲解。希望学习UI的朋友通过这篇文章可以解决这个问题。 俗话说眼见为实,但其实我们的眼睛经常欺骗我们。眼睛通过光的反射接收信息,然后经过一次「脑补」最终形成我们所谓「看见」的图像。脑补这个过程会因为各种原因的影响导致我们对于「看见」的事物的理解产生偏差。这一点对图形化操作界面的设计非常影响。既然无法绕过,设计师就要学会如何去「适配」人类的视觉惯性画出“正确”的界面。
用户5009027
2019/08/15
1.3K0
点击加载更多

相似问题

圆形图像周围有黑色方块

12

如何在我的圆形图像周围放置多色边框?

35

移除图像周围的黑色边框

11

如何使用SVG遮罩图像,并在遮罩部分周围添加颜色笔划?

15

CSS -如何在圆形图像周围添加圆形边框/轮廓?

22
添加站长 进交流群

领取专属 10元无门槛券

AI混元助手 在线答疑

扫码加入开发者社群
关注 腾讯云开发者公众号

洞察 腾讯核心技术

剖析业界实践案例

扫码关注腾讯云开发者公众号
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档
查看详情【社区公告】 技术创作特训营有奖征文