189 8069 5689

iOS如何实现裁剪圆形图像并显示

这篇文章给大家分享的是有关iOS如何实现裁剪圆形图像并显示的内容。小编觉得挺实用的，因此分享给大家做个参考，一起跟随小编过来看看吧。

成都创新互联是一家专业提供金林企业网站建设,专注与网站设计、做网站、成都h5网站建设、小程序制作等业务。10年已为金林众多企业、政府机构等服务。创新互联专业网站制作公司优惠进行中。

        本文主要是在iOS 10环境下使用，此时如果要使用使用系统照片库、照相机等功能需要授权，授权方法如下：

        右键点击工程目录中的“Info.plist文件——>Open As ——>Source Code”，打开复制以下你在应用中使用的隐私权限设置（描述自己修改）：

NSVideoSubscriberAccountUsageDescription
    
    NSBluetoothPeripheralUsageDescription
    蓝牙权限
    NSSpeechRecognitionUsageDescription
    语音识别权限
    NSSiriUsageDescription
    Siri权限
    NSRemindersUsageDescription
    
    NSPhotoLibraryUsageDescription
    相册权限
    kTCCServiceMediaLibrary
    
    NSMotionUsageDescription
    运动权限
    NSMicrophoneUsageDescription
    麦克风权限
    NSAppleMusicUsageDescription
    音乐权限
    NSLocationWhenInUseUsageDescription
    地理位置权限
    NSLocationUsageDescription
    地理位置权限
    NSLocationAlwaysUsageDescription
    地理位置权限
    NSHomeKitUsageDescription
    
    NSHealthUpdateUsageDescription
    健康权限
    NSHealthShareUsageDescription
    健康权限
    NSContactsUsageDescription
    通讯录权限
    NSCameraUsageDescription
    摄像头权限
    NSCalendarsUsageDescription
    日历权限

        下面，正式进入本文要实现的功能的代码编写。

1. 使用Xcode的storyboard创建一个button和一个p_w_picpathView

创建后的效果如下图1所示。其中，p_w_picpathView的尺寸影响最终显示的效果尺寸，请根据实际情况设置。

iOS如何实现裁剪圆形图像并显示

2. 创建一个UIImage的类别(Category)

创建新文件，选择“Objective-C File”，如下图2所示：

iOS如何实现裁剪圆形图像并显示

在弹出的如图3所示的对话框中，“File”写入类别的名称(本例中是DY)，“File Type”选择Category，“Class”选择UIImage。然后点击“Next”按钮，将新文件保存。

iOS如何实现裁剪圆形图像并显示

3. 编写类别中的代码

UIImage+DY.h文件中

#import 
@interface UIImage (DY)
+ (instancetype)circleOldImage:(UIImage *)originalImage borderWidth:(CGFloat)borderWidth borderColor:(UIColor *)borderColor;
@end

UIImage+DY.m文件中

#import "UIImage+DY.h"
@implementation UIImage (DY)
+ (instancetype)circleOldImage:(UIImage *)originalImage borderWidth:(CGFloat)borderWidth borderColor:(UIColor *)borderColor
{
    // 1.加载原图
    UIImage *oldImage = originalImage;
    
    // 2.开启上下文
    CGFloat p_w_picpathW = oldImage.size.width + 2 * borderWidth;
    CGFloat p_w_picpathH = oldImage.size.height + 2 * borderWidth;
    CGSize p_w_picpathSize = CGSizeMake(p_w_picpathW, p_w_picpathH);
    UIGraphicsBeginImageContextWithOptions(p_w_picpathSize, NO, 0.0);
    
    // 3.取得当前的上下文
    CGContextRef ctx = UIGraphicsGetCurrentContext();
    
    // 4.画边框(大圆)
    [borderColor set];
    CGFloat bigRadius = p_w_picpathW * 0.5; // 大圆半径
    CGFloat centerX = bigRadius; // 圆心
    CGFloat centerY = bigRadius;
    CGContextAddArc(ctx, centerX, centerY, bigRadius, 0, M_PI * 2, 0);
    CGContextFillPath(ctx); // 画圆
    
    // 5.小圆
    CGFloat smallRadius = bigRadius - borderWidth;
    CGContextAddArc(ctx, centerX, centerY, smallRadius, 0, M_PI * 2, 0);
    // 裁剪(后面画的东西才会受裁剪的影响)
    CGContextClip(ctx);
    
    // 6.画图
    [oldImage drawInRect:CGRectMake(borderWidth, borderWidth, oldImage.size.width, oldImage.size.height)];
    
    // 7.取图
    UIImage *newImage = UIGraphicsGetImageFromCurrentImageContext();
    
    // 8.结束上下文
    UIGraphicsEndImageContext();
    
    return newImage;
}
@end

 +(instancetype)circleOldImage:(UIImage *)originalImage borderWidth:(CGFloat)borderWidth borderColor:(UIColor *)borderColor方法的说明：

 1. 这是一个类方法，最终返回的是一个UIImage的类；

 2. 方法中originalImage参数指的是从照片库或者拍照后选中的照片(可能是经过系统裁剪的)；

 3. 方法中borderWidth参数指的是最终显示的圆形图像的边框的宽度，可以可以根据自己的需要设置宽度；

 4. 方法中的borderColor参数指的是最终显示的圆形图像的边框的颜色，可以可以根据自己的需要设置颜色。

4. 实现裁剪成圆形图像并显示

ViewController.h文件

#import 
#import "UIImage+DY.h"  //加载类别
@interface ViewController : UIViewController  //一定要添加这两个Delegate
@property (strong, nonatomic) UIImagePickerController *p_w_picpathPickerController;
- (IBAction)btnPressed:(id)sender;
@property (strong, nonatomic) IBOutlet UIImageView *ablumImageView;
@end

ViewController.m文件

#import "ViewController.h"
@interface ViewController ()
@end
@implementation ViewController
- (void)viewDidLoad {
    [super viewDidLoad];
    // Do any additional setup after loading the view, typically from a nib.
}
- (void)didReceiveMemoryWarning {
    [super didReceiveMemoryWarning];
    // Dispose of any resources that can be recreated.
}
- (IBAction)btnPressed:(id)sender {
    
    if([UIImagePickerController isSourceTypeAvailable: UIImagePickerControllerSourceTypePhotoLibrary]) {
        
        //首先判断是否支持照片库，这个方法中的参数要和_p_w_picpathPickerController.sourceType的值保持一致
        
        //如果支持
        
        _p_w_picpathPickerController = [[UIImagePickerController alloc]init];
        
        _p_w_picpathPickerController.view.backgroundColor = [UIColor orangeColor];
        _p_w_picpathPickerController.sourceType = UIImagePickerControllerSourceTypePhotoLibrary;
        _p_w_picpathPickerController.delegate = self;
        _p_w_picpathPickerController.allowsEditing = YES;  //该参数默认是NO，建议设置为YES，否则裁剪成圆形图片的方法将获取到的是椭圆形的图片，与你的预想大相径庭
        
        [self presentViewController:_p_w_picpathPickerController animated:YES completion:nil];
        
    }
    
}
- (void)p_w_picpathPickerController:(UIImagePickerController *)picker didFinishPickingMediaWithInfo:(NSDictionary *)info {
    
    _ablumImageView.p_w_picpath = [UIImage circleOldImage:[info objectForKey:UIImagePickerControllerEditedImage] borderWidth:30.0f borderColor:[UIColor orangeColor]];  
    //该方法中Info的Key值“UIImagePickerControllerEditedImage”表示的是选择裁剪后的图片，如果使用这个Key值，则_p_w_picpathPickerController.allowsEditing的值需要设置为YES。
    
    //如果_p_w_picpathPickerController.allowsEditing的值设置的NO，则这个Key的值应该设置为UIImagePickerControllerOriginalImage
    
    /*
    info中的Key的值有如下几个：
    
    NSString *const  UIImagePickerControllerMediaType ;指定用户选择的媒体类型（文章最后进行扩展）
NSString *const  UIImagePickerControllerOriginalImage ;原始图片
NSString *const  UIImagePickerControllerEditedImage ;修改后的图片
NSString *const  UIImagePickerControllerCropRect ;裁剪尺寸
NSString *const  UIImagePickerControllerMediaURL ;媒体的URL
NSString *const  UIImagePickerControllerReferenceURL ;原件的URL
NSString *const  UIImagePickerControllerMediaMetadata;当来数据来源是照相机的时候这个值才有效
    
    */
    
    
    [self dismissViewControllerAnimated:YES completion:nil];
    
}
- (void)p_w_picpathPickerControllerDidCancel:(UIImagePickerController *)picker{
    
    
    [self dismissViewControllerAnimated:YES completion:nil];
    
}
@end

感谢各位的阅读！关于“iOS如何实现裁剪圆形图像并显示”这篇文章就分享到这里了，希望以上内容可以对大家有一定的帮助，让大家可以学到更多知识，如果觉得文章不错，可以把它分享出去让更多的人看到吧！


分享名称：iOS如何实现裁剪圆形图像并显示
新闻来源：http://cdxtjz.cn/article/gipseg.html

其他资讯