圆角图片的设置ios

一般图片圆角显示都是四个角都显示圆角，如果只有这个功能需求，采用常用的方法就可以了，也不用费那么多事情。但是在有些情况下需要只显示图片的2个圆角，就不太好实现了。

先看效果图 ，未做圆角转换的图片

做了4个角的圆角转换的图片

只做了下面2个圆角转换的图片

如何实现画四个方向的弧线呢？

先看看示意图

头文件

#import < Foundation / Foundation.h >

typedef enum {
UIImageRoundedCornerTopLeft = 1 ,
UIImageRoundedCornerTopRight = 1 << 1 ,
UIImageRoundedCornerBottomRight = 1 << 2 ,
UIImageRoundedCornerBottomLeft = 1 << 3
}UIImageRoundedCorner;

@interfaceUIImage(Utility)

// +(void)addRoundedRectToPath(CGContextRefcontext,CGRectrect,floatradius,UIImageRoundedCornercornerMask);

- (UIImage * )roundedRectWith:( float )radiuscornerMask:(UIImageRoundedCorner)cornerMask;

@end

实现文件

#import " UIImage+Utility.h "

// UIKit坐标系统原点在左上角，y方向向下的（坐标系A），但在Quartz中坐标系原点在左下角，y方向向上的(坐标系B)。图片绘制也是颠倒的。
static void addRoundedRectToPath(CGContextRefcontext,CGRectrect, float radius,UIImageRoundedCornercornerMask)
{
// 原点在左下方，y方向向上。移动到线条2的起点。
CGContextMoveToPoint(context,rect.origin.x,rect.origin.y + radius);

// 画出线条2,目前画线的起始点已经移动到线条2的结束地方了。
CGContextAddLineToPoint(context,rect.origin.x,rect.origin.y + rect.size.height - radius);

// 如果左上角需要画圆角，画出一个弧线出来。
if (cornerMask & UIImageRoundedCornerTopLeft){

// 已左上的正方形的右下脚为圆心，半径为radius，180度到90度画一个弧线，
CGContextAddArc(context,rect.origin.x + radius,rect.origin.y + rect.size.height - radius,
radius,M_PI,M_PI / 2 , 1 );
}

else {
// 如果不需要画左上角的弧度。从线2终点，画到线3的终点，
CGContextAddLineToPoint(context,rect.origin.x,rect.origin.y + rect.size.height);

// 线3终点，画到线4的起点
CGContextAddLineToPoint(context,rect.origin.x + radius,rect.origin.y + rect.size.height);
}

// 画线4的起始，到线4的终点
CGContextAddLineToPoint(context,rect.origin.x + rect.size.width - radius,
rect.origin.y + rect.size.height);

// 画右上角
if (cornerMask & UIImageRoundedCornerTopRight){
CGContextAddArc(context,rect.origin.x + rect.size.width - radius,
rect.origin.y + rect.size.height - radius,radius,M_PI / 2 , 0.0f , 1 );
}
else {
CGContextAddLineToPoint(context,rect.origin.x + rect.size.width,rect.origin.y + rect.size.height);
CGContextAddLineToPoint(context,rect.origin.x + rect.size.width,rect.origin.y + rect.size.height - radius);
}

CGContextAddLineToPoint(context,rect.origin.x + rect.size.width,rect.origin.y + radius);

// 画右下角弧线
if (cornerMask & UIImageRoundedCornerBottomRight){
CGContextAddArc(context,rect.origin.x + rect.size.width - radius,rect.origin.y + radius,
radius, 0.0f , - M_PI / 2 , 1 );
}
else {
CGContextAddLineToPoint(context,rect.origin.x + rect.size.width,rect.origin.y);
CGContextAddLineToPoint(context,rect.origin.x + rect.size.width - radius,rect.origin.y);
}

CGContextAddLineToPoint(context,rect.origin.x + radius,rect.origin.y);

// 画左下角弧线
if (cornerMask & UIImageRoundedCornerBottomLeft){
CGContextAddArc(context,rect.origin.x + radius,rect.origin.y + radius,radius,
- M_PI / 2 ,M_PI, 1 );
}
else {
CGContextAddLineToPoint(context,rect.origin.x,rect.origin.y);
CGContextAddLineToPoint(context,rect.origin.x,rect.origin.y + radius);
}

CGContextClosePath(context);
}


@implementationUIImage(Utility)
- (UIImage * )roundedRectWith:( float )radiuscornerMask:(UIImageRoundedCorner)cornerMask
{
UIImageView * bkImageViewTmp = [[[UIImageViewalloc]initWithImage:self]autorelease];

int w = self.size.width;
int h = self.size.height;

CGColorSpaceRefcolorSpace = CGColorSpaceCreateDeviceRGB();
CGContextRefcontext = CGBitmapContextCreate(NULL,w,h, 8 , 4 * w,colorSpace,kCGImageAlphaPremultipliedFirst);

CGContextBeginPath(context);
addRoundedRectToPath(context,bkImageViewTmp.frame,radius,cornerMask);
CGContextClosePath(context);
CGContextClip(context);

CGContextDrawImage(context,CGRectMake( 0 , 0 ,w,h),self.CGImage);

CGImageRefimageMasked = CGBitmapContextCreateImage(context);
CGContextRelease(context);
CGColorSpaceRelease(colorSpace);

UIImage * newImage = [UIImageimageWithCGImage:imageMasked];

CGImageRelease(imageMasked);

return newImage;
}

@end

实现方法如下：

- (IBAction)showRectImage
{
UIImage * rectImage = [UIImageimageNamed: @" test.jpg " ];
self.imageView.image = rectImage;
}

- (IBAction)showRoundImage
{
UIImage * rectImage = [UIImageimageNamed: @" test.jpg " ];
UIImage * roundImage = [rectImageroundedRectWith: 100
cornerMask:UIImageRoundedCornerBottomLeft | UIImageRoundedCornerBottomRight | UIImageRoundedCornerTopLeft | UIImageRoundedCornerTopRight];
self.imageView.image = roundImage;
}


- (IBAction)show2RoundImage
{
UIImage * rectImage = [UIImageimageNamed: @" test.jpg " ];
UIImage * round2Image = [rectImageroundedRectWith: 100
cornerMask:UIImageRoundedCornerBottomLeft | UIImageRoundedCornerBottomRight];
self.imageView.image = round2Image;

}

对于四个角，用下面的角进行逻辑或的方法。

UIImageRoundedCornerTopRight

UIImageRoundedCornerTopLeft

UIImageRoundedCornerBottomRight

UIImageRoundedCornerBottomLeft

项目文件下载

参考URL

http://stackoverflow.com/questions/4847163/round-two-corners-in-uiview

http://stackoverflow.com/questions/4845211/just-two-rounded-corners

http://blog.sallarp.com/iphone-uiimage-round-corners/

本文出自 “人生得意须尽欢” 博客，请务必保留此出处http://no001.blog.51cto.com/1142339/637732