美文网首页
iOS中让控件显示圆形图片

iOS中让控件显示圆形图片

作者: 别有洞天i | 来源:发表于2016-10-20 21:26 被阅读0次

本文一共提供三种控件显示圆形图片的方法,针对不同的使用场景,请自行选择合适的方法。

方法一:

1.1拿到图片UIImage *image;

1.2开启一个图形上下文 设置图形上下文的siz 等于图片size;

UIGraphicsBeginImageContext(image.size);

1.3利用贝塞尔曲线,设置一个圆形裁剪区域(设置一个矩形的内切圆/内切椭圆);

UIBezierPath *path =[UIBezierPath bezierPathWithOvalInRect:CGRectMake( 0, 0, image.size.width, image.size.height)];

1.4拿到贝塞尔曲线对象 添加裁剪;

[path addClip];

1.5将图片画到图像上下文上
由于图像上下文size和图片的size设置一样 所以可以设置point为零点;

[image drawAtPoint:CGPointZero];

1.6从当前的图像上下文中获取图片;

image = UIGraphicsGetImageFromCurrentImageContext();

1.7虽然此时已经拿到 裁剪变为圆形的图片image,但是千万不要忘了最后还有重要的一个步骤,那就是关闭图形上下文,这个步骤特别容易让人忘记,切记!

UIGraphicsEndImageContext();

简单的几个步骤就完成了一个正圆形图片的裁剪功能,当然还有我们更加简单的方式哦,那就是接下来的方法二。

方法二:

2.1拿到你要设置的UIImageView *imageV;
2.2设置imageV 的layer层的圆角半径;
2.3拿到imageV的layer层,并且告诉layer将位于它之下的layer都遮盖住;
两个步骤解决,简单明了,但是此方法会带来一定的性能问题。
即:会触发离屏渲染,比较消耗性能。比如当一个页面上有十几头像这样设置了圆角,那么会明显感觉到卡顿。
注意:png图片UIImageView处理圆角是不会产生离屏渲染的。(ios9.0之后不会离屏渲染,ios9.0之前还是会离屏渲染)。
代码如下:

 imageV.layer.cornerRadius = self.iconImageV.tml_width *0.5;
 imageV.layer.masksToBounds =YES;

当然,如果你一行代码也不写 也想设置圆角也是可以的,那就是我么接下来的第三种方法。

方法三:

如果你是在xib中添加的UIImageView的话,这里还提供另外一种不需要编写一行代码的方法,详细请参照如下图片中指示:

第一个属性:layer.cornerRadius

第二个属性:layer.masksToBounds

第一步:

Snip20161020_1.png

第二步:

Snip20161020_4.png

总结:

以上三种方法都可以达到同样的效果,具体选择哪一种,视情况而定!
此外,第三中方法中涉及运行时方面的知识,具体原理就不在此做过多解释。同时也是三种方法中最为装B的方法,温馨提示:装B虽好,但要慎用!

相关文章

  • iOS中让控件显示圆形图片

    本文一共提供三种控件显示圆形图片的方法,针对不同的使用场景,请自行选择合适的方法。 方法一: 1.1拿到图片UII...

  • 重写LayoutSubViews设置cell子控件frame

    问题描述: 当我们在iOS中实现带图片带列表显示时UITableViewCell中自带了一个存放图片的控件UIIm...

  • 圆形图片控件

    implementation 'com.makeramen:roundedimageview:2.3.0' and...

  • Glide 的一些使用

    Glide 的一些使用 1、加载一些图片到圆形的控件中时,如果设置了placeholder第一次显示placeho...

  • React Native 之组件Image

    一个用于显示图片的React组件,类似于iOS中UIImage控件,该组件可以通过多种方式加载图片资源,包括网络图...

  • iOS 圆形的进度展示View

    iOS 圆形的进度展示View 最近项目里需要做一个显示评分等级的控件 但是是圆形的。在网上找了好多,但是没有一模...

  • TextView怎么像ImageView一样显示图片

    显示图片的控件并不只有ImageView,今天来使用如下四种方法让TextView显示图片。 第一种:XML文件中...

  • iOS中圆形图片设置

    现在APP应用中,圆形图片的设置越来越多,下面就来分享我的设置圆形图片的经验。 1.不采用的方法 UIImageV...

  • iOS中圆形图片设置

    图片设置圆形常见有两种方式 一种是对图片的图层进行处理,另一种就是利用cocoas2D知识处理。 图层处理: UI...

  • iOS中实现圆形图片

    self.imageView.layer.cornerRadius = 239; self.clipsToBoun...

网友评论

      本文标题:iOS中让控件显示圆形图片

      本文链接:https://www.haomeiwen.com/subject/yrcquttx.html