讓帶來消暑涼意的雪后露臉吧 - 圖片的裁切和遮罩

Peggy的雪后音樂劇即將在炎熱的8月演出，

為我們帶來消暑的涼意。

為了感謝Peggy，

彼得潘決定在iPhone上宣傳雪后的演出。

	UIImage *image = [UIImage imageNamed:@"peggy.jpg"];
	UIImageView *imageView = [[UIImageView alloc] initWithImage:image];
	[self.view addSubview:imageView];

view raw gistfile1.m hosted with ❤ by GitHub

執行結果:

想不到雪后的宣傳照太大張了，
足足有849*313 (pixel)
遠超過320*480的iPhone螢幕大小。
因此我們只看到左半邊的演出日期。

宣傳照片裡的最吸引人目光的莫過於可愛的雪后圖案了。
接下來彼得潘將利用圖片裁切的技巧，
特別剪裁出雪后的區塊。

	UIImage *imageToCrop = [UIImage imageNamed:@"peggy.jpg"];
	CGRect rect = CGRectMake(310, 20, 320, 280);
	CGImageRef imageRef = CGImageCreateWithImageInRect([imageToCrop CGImage], rect);
	UIImage *image = [UIImage imageWithCGImage:imageRef];
	CGImageRelease(imageRef);
	UIImageView *imageView = [[UIImageView alloc] initWithImage:image];
	[self.view addSubview:imageView];

view raw gistfile1.m hosted with ❤ by GitHub

說明:

CGRect rect = CGRectMake(310, 20, 320, 280);
CGImageRef imageRef = CGImageCreateWithImageInRect([imageToCrop CGImage], rect);

利用CGImageCreateWithImageInRect，裁切出原圖大小中，從x, y (310, 20)開始，寬高(320, 280)的長方形區塊。

執行結果:

太好了，雪后終於露臉了!  可惜的是雪后標題還是看不到，不知情的人可能還誤以為這是新版的白雪公主。因此彼得潘決定另外做一個圓形的雪后標題版以正視聽。為了將圖片做成可愛的圓形，在此彼得潘採用mask的技巧。mask的圓形圖片如下，到時候和雪后圖片起化學作用後，將只呈現圓形的部分。(一般做為mask的圖片，顏色將設為黑色。)

	- (UIImage*) maskImage:(UIImage *)image
	withMask:(UIImage *)maskImage
	{
	CGImageRef imageRef = image.CGImage;
	CGImageRef maskRef = maskImage.CGImage;
	CGImageRef mask = CGImageMaskCreate(CGImageGetWidth(maskRef),
	CGImageGetHeight(maskRef),
	CGImageGetBitsPerComponent(maskRef),
	CGImageGetBitsPerPixel(maskRef),
	CGImageGetBytesPerRow(maskRef),
	CGImageGetDataProvider(maskRef),
	NULL, // decode should be NULL
	FALSE // shouldInterpolate
	);
	CGImageRef masked = CGImageCreateWithMask(imageRef, mask);
	CGImageRelease(mask);
	UIImage *maskedImage = [UIImage imageWithCGImage:masked];
	CGImageRelease(masked);
	return maskedImage;
	}
	- (void)viewDidLoad
	{
	[super viewDidLoad];
	// Do any additional setup after loading the view, typically from a nib.
	UIImage *imageToCrop = [UIImage imageNamed:@"peggy.jpg"];
	CGRect rect = CGRectMake(615, 20, 220, 220);
	CGImageRef imageRef = CGImageCreateWithImageInRect([imageToCrop CGImage], rect);
	UIImage *image = [UIImage imageWithCGImage:imageRef];
	CGImageRelease(imageRef);
	UIImage *newImage = [self maskImage:image withMask:[UIImage imageNamed:@"mask.png"]];
	UIImageView *imageView = [[UIImageView alloc] initWithImage:newImage];
	[self.view addSubview:imageView];
	}

view raw gistfile1.m hosted with ❤ by GitHub

說明:


 CGImageRef mask = CGImageMaskCreate(CGImageGetWidth(maskRef),
                                        CGImageGetHeight(maskRef),
                                        CGImageGetBitsPerComponent(maskRef),
                                        CGImageGetBitsPerPixel(maskRef),
                                        CGImageGetBytesPerRow(maskRef),
                                        CGImageGetDataProvider(maskRef),
                                        NULL, // decode should be NULL
                                        FALSE // shouldInterpolate
                                        );

 CGImageRef masked = CGImageCreateWithMask(imageRef, mask);

利用CGImageMaskCreate和CGImageCreateWithMask對原圖做mask。


執行結果: