iOS開發(fā)中關(guān)于UIImage的知識(shí)點(diǎn)總結(jié)
UIImage是iOS中層級(jí)比較高的一個(gè)用來(lái)加載和繪制圖像的一個(gè)類,更底層的類還有 CGImage,以及iOS5.0以后新增加的CIImage。今天我們主要聊一聊UIImage的三個(gè)屬性: imageOrientation, size, scale,幾個(gè)初始化的方法: imageNamed,imageWithContentsOfFile,以及繪制Image的幾個(gè)draw開頭的方法。
一、UIImage的size,scale屬性
先想一個(gè)問(wèn)題“一個(gè)圖像的尺寸到底是多大呢?”
***反應(yīng)可能就是image.size,恭喜你答錯(cuò)了,正確的答案是圖像的實(shí)際的尺寸(像 素)等于image.size乘以image.scale。如果做過(guò)界面貼圖的話你可能經(jīng)常會(huì)需要準(zhǔn)備至少兩套圖,一套1倍圖,一套圖已@2x命名的二倍 圖。這樣當(dāng)我們的程序運(yùn)行在retina屏幕的時(shí)候系統(tǒng)就會(huì)自動(dòng)的去加載@2x的圖片,它的size將和一倍圖加載進(jìn)來(lái)的size相等,但是scale卻 置為2,這點(diǎn)大家可以做個(gè)簡(jiǎn)單的小測(cè)試驗(yàn)證一下。然我們?cè)偕钊胍稽c(diǎn)兒為什么不直接加載到成二倍的尺寸呢,原因很簡(jiǎn)單因?yàn)槲覀冊(cè)诮缑娌季种羞壿嬜鴺?biāo)系中的 (單位是point),而實(shí)際的繪制都是在設(shè)備坐標(biāo)系(單位是pixel)進(jìn)行的,系統(tǒng)會(huì)自動(dòng)幫我們完成從point到pixel之間的轉(zhuǎn)化。其實(shí)這個(gè)比 例也就剛好和UIScreen中的scale對(duì)應(yīng),這樣整條scale的線就可以串通了。
二、UIImage的幾種初始化方法的對(duì)比
1、imageNamed:方法
imageNamed:是UIImage的一個(gè)類方法,它做的事情比我們看到的要稍微多一些。它的加載流程如下:
a. 系統(tǒng)回去檢查系統(tǒng)緩存中是否存在該名字的圖像,如果存在則直接返回。
b. 如果系統(tǒng)緩存中不存在該名字的圖像,則會(huì)先加載到緩存中,在返回該對(duì)象。
觀察上面的操作我們發(fā)現(xiàn)系統(tǒng)會(huì)緩存我們使用imageNamed:方法加載的圖像時(shí)候,系統(tǒng)會(huì)自動(dòng)幫我們緩存。這種機(jī)制適合于那種頻繁用到界面貼圖累的加載,但如果我們需要短時(shí)間內(nèi)頻繁的加載一些一次性的圖像的話,***不要使用這種方法。
2、imageWithContentsOfFile:和initWithContentsOfFile:方法
這兩個(gè)方法跟前一個(gè)方法一樣都是完成從文件加載圖像的功能。但是不會(huì)經(jīng)過(guò)系統(tǒng)緩存,直接從文件系統(tǒng)中加載并返回。
順便提一下,當(dāng)收到內(nèi)存警告的時(shí)候,系統(tǒng)可能會(huì)將UIImage內(nèi)部的存儲(chǔ)圖像的內(nèi)存釋放,下一次需要繪制的時(shí)候會(huì)重新去加載。
3、imageWithCGImage:scale:orientation:方法
該方面使用一個(gè)CGImageRef創(chuàng)建UIImage,在創(chuàng)建時(shí)還可以指定方法倍數(shù)以及旋轉(zhuǎn)方向。當(dāng)scale設(shè)置為1的時(shí)候,新創(chuàng)建的圖像將和原圖像尺寸一摸一樣,而orientaion則可以指定新的圖像的繪制方向。
三、UIImage的imageOrientation屬性
UIImage有一個(gè)imageOrientation的屬性,主要作用是控制image的繪制方向,共有以下8中方向:
- typedef NS_ENUM(NSInteger, UIImageOrientation) {
- UIImageOrientationUp, // default orientation
- UIImageOrientationDown, // 180 deg rotation
- UIImageOrientationLeft, // 90 deg CCW (編程發(fā)現(xiàn)官方文檔中,left和right圖像標(biāo)反了,此處更正過(guò)來(lái))
- UIImageOrientationRight, // 90 deg CW
- UIImageOrientationUpMirrored, // as above but image mirrored along other axis. horizontal flip
- UIImageOrientationDownMirrored, // horizontal flip
- UIImageOrientationLeftMirrored, // vertical flip
- UIImageOrientationRightMirrored, // vertical flip
- };
默認(rèn)的方向是UIImageOrientationUp,這8種方向?qū)?yīng)的繪制方如上面所示。我 們?cè)谌粘J褂弥薪?jīng)常會(huì)碰到把iPhone相冊(cè)中的照片導(dǎo)入到windows中,發(fā)現(xiàn)方向不對(duì)的問(wèn)題就是與這個(gè)屬性有關(guān),因?yàn)閷?dǎo)出照片的時(shí)候,寫exif中 的方向信息時(shí)候沒(méi)有考慮該方向的原因。既然這個(gè)屬性可以控制image的繪制方向,那我們能不能通過(guò)改過(guò)這個(gè)屬性來(lái)完成UIImage的旋轉(zhuǎn)和翻轉(zhuǎn)呢?帶 著這個(gè)問(wèn)題我們繼續(xù)往下看。
四、UIImage的幾個(gè)draw方法
UIImage的幾個(gè)draw方法是用來(lái)繪制圖像的利器,為什么這樣說(shuō)呢?因?yàn)樗鼈冊(cè)诶L制圖 像的時(shí)候會(huì)考慮當(dāng)前圖像的方向,即根據(jù)的imageOrientation繪制出不同的方向。由于圖像是繪制在當(dāng)前context中的,它同時(shí)還會(huì)考慮到 當(dāng)前context的transform的變化。利于這兩點(diǎn)我們就可以玩轉(zhuǎn)圖像的旋轉(zhuǎn)和翻轉(zhuǎn)了。
搜索了一些,目前網(wǎng)上大部分圖像旋轉(zhuǎn)都是通過(guò)創(chuàng)建CGBitmapContext,然后根據(jù)圖像方向設(shè)置context的transform來(lái)實(shí)現(xiàn)的,這種方法要求對(duì)整個(gè)矩陣變化的過(guò)程都非常清楚,一個(gè)參數(shù)設(shè)置不多,出來(lái)的結(jié)果就會(huì)有問(wèn)題。
下面我介紹一種實(shí)現(xiàn)起來(lái)簡(jiǎn)單方便的圖像旋轉(zhuǎn)方法,這種方法主要就是利用imageWithCGImage:scale:orientation:方法,指定不同的orientation來(lái)完成所需要的功能,先舉個(gè)簡(jiǎn)單的例子:
假設(shè)一副圖片顯示為
,我們要向左旋轉(zhuǎn)90°,那么轉(zhuǎn)過(guò)之后應(yīng)該就會(huì)顯示為 ,即將原圖從orientationUP轉(zhuǎn)到orientationLeft即可。以此類推為不同的方向旋轉(zhuǎn),只需要注意看R的顯示即可,這樣整個(gè)旋轉(zhuǎn)和翻轉(zhuǎn)的實(shí)現(xiàn)過(guò)程中完全可以不用考慮Transform那些東西,是不是很簡(jiǎn)單。下面是圖像旋轉(zhuǎn)和翻轉(zhuǎn)的完整代碼:
- //
- // UIImage+Rotate_Flip.h
- // SvImageEdit
- //
- // Created by maple on 5/14/13.
- // Copyright (c) 2013 smileEvday. All rights reserved.
- //
- //
- #import <UIKit/UIKit.h>
- @interface UIImage (Rotate_Flip)
- /*
- * @brief rotate image 90 withClockWise
- */
- - (UIImage*)rotate90Clockwise;
- /*
- * @brief rotate image 90 counterClockwise
- */
- - (UIImage*)rotate90CounterClockwise;
- /*
- * @brief rotate image 180 degree
- */
- - (UIImage*)rotate180;
- /*
- * @brief rotate image to default orientation
- */
- - (UIImage*)rotateImageToOrientationUp;
- /*
- * @brief flip horizontal
- */
- - (UIImage*)flipHorizontal;
- /*
- * @brief flip vertical
- */
- - (UIImage*)flipVertical;
- /*
- * @brief flip horizontal and vertical
- */
- - (UIImage*)flipAll;
- @end
- UIImage+Rotate_Flip.h
- //
- // UIImage+Rotate_Flip.m
- // SvImageEdit
- //
- // Created by maple on 5/14/13.
- // Copyright (c) 2013 smileEvday. All rights reserved.
- //
- #import "UIImage+Rotate_Flip.h"
- @implementation UIImage (Rotate_Flip)
- /*
- * @brief rotate image 90 with CounterClockWise
- */
- - (UIImage*)rotate90CounterClockwise
- {
- UIImage *image = nil;
- switch (self.imageOrientation) {
- case UIImageOrientationUp:
- {
- image = [UIImage imageWithCGImage:self.CGImage scale:1 orientation:UIImageOrientationLeft];
- break;
- }
- case UIImageOrientationDown:
- {
- image = [UIImage imageWithCGImage:self.CGImage scale:1 orientation:UIImageOrientationRight];
- break;
- }
- case UIImageOrientationLeft:
- {
- image = [UIImage imageWithCGImage:self.CGImage scale:1 orientation:UIImageOrientationDown];
- break;
- }
- case UIImageOrientationRight:
- {
- image = [UIImage imageWithCGImage:self.CGImage scale:1 orientation:UIImageOrientationUp];
- break;
- }
- case UIImageOrientationUpMirrored:
- {
- image = [UIImage imageWithCGImage:self.CGImage scale:1 orientation:UIImageOrientationRightMirrored];
- break;
- }
- case UIImageOrientationDownMirrored:
- {
- image = [UIImage imageWithCGImage:self.CGImage scale:1 orientation:UIImageOrientationLeftMirrored];
- break;
- }
- case UIImageOrientationLeftMirrored:
- {
- image = [UIImage imageWithCGImage:self.CGImage scale:1 orientation:UIImageOrientationUpMirrored];
- break;
- }
- case UIImageOrientationRightMirrored:
- {
- image = [UIImage imageWithCGImage:self.CGImage scale:1 orientation:UIImageOrientationDownMirrored];
- break;
- }
- default:
- break;
- }
- return image;
- }
- /*
- * @brief rotate image 90 with Clockwise
- */
- - (UIImage*)rotate90Clockwise
- {
- UIImage *image = nil;
- switch (self.imageOrientation) {
- case UIImageOrientationUp:
- {
- image = [UIImage imageWithCGImage:self.CGImage scale:1 orientation:UIImageOrientationRight];
- break;
- }
- case UIImageOrientationDown:
- {
- image = [UIImage imageWithCGImage:self.CGImage scale:1 orientation:UIImageOrientationLeft];
- break;
- }
- case UIImageOrientationLeft:
- {
- image = [UIImage imageWithCGImage:self.CGImage scale:1 orientation:UIImageOrientationUp];
- break;
- }
- case UIImageOrientationRight:
- {
- image = [UIImage imageWithCGImage:self.CGImage scale:1 orientation:UIImageOrientationDown];
- break;
- }
- case UIImageOrientationUpMirrored:
- {
- image = [UIImage imageWithCGImage:self.CGImage scale:1 orientation:UIImageOrientationLeftMirrored];
- break;
- }
- case UIImageOrientationDownMirrored:
- {
- image = [UIImage imageWithCGImage:self.CGImage scale:1 orientation:UIImageOrientationRightMirrored];
- break;
- }
- case UIImageOrientationLeftMirrored:
- {
- image = [UIImage imageWithCGImage:self.CGImage scale:1 orientation:UIImageOrientationDownMirrored];
- break;
- }
- case UIImageOrientationRightMirrored:
- {
- image = [UIImage imageWithCGImage:self.CGImage scale:1 orientation:UIImageOrientationUpMirrored];
- break;
- }
- default:
- break;
- }
- return image;
- }
- /*
- * @brief rotate image 180 degree
- */
- - (UIImage*)rotate180
- {
- UIImage *image = nil;
- switch (self.imageOrientation) {
- case UIImageOrientationUp:
- {
- image = [UIImage imageWithCGImage:self.CGImage scale:1 orientation:UIImageOrientationDown];
- break;
- }
- case UIImageOrientationDown:
- {
- image = [UIImage imageWithCGImage:self.CGImage scale:1 orientation:UIImageOrientationUp];
- break;
- }
- case UIImageOrientationLeft:
- {
- image = [UIImage imageWithCGImage:self.CGImage scale:1 orientation:UIImageOrientationRight];
- break;
- }
- case UIImageOrientationRight:
- {
- image = [UIImage imageWithCGImage:self.CGImage scale:1 orientation:UIImageOrientationLeft];
- break;
- }
- case UIImageOrientationUpMirrored:
- {
- image = [UIImage imageWithCGImage:self.CGImage scale:1 orientation:UIImageOrientationDownMirrored];
- break;
- }
- case UIImageOrientationDownMirrored:
- {
- image = [UIImage imageWithCGImage:self.CGImage scale:1 orientation:UIImageOrientationUpMirrored];
- break;
- }
- case UIImageOrientationLeftMirrored:
- {
- image = [UIImage imageWithCGImage:self.CGImage scale:1 orientation:UIImageOrientationRightMirrored];
- break;
- }
- case UIImageOrientationRightMirrored:
- {
- image = [UIImage imageWithCGImage:self.CGImage scale:1 orientation:UIImageOrientationLeftMirrored];
- break;
- }
- default:
- break;
- }
- return image;
- }
- /*
- * @brief rotate image to default orientation
- */
- - (UIImage*)rotateImageToOrientationUp
- {
- CGSize size = CGSizeMake(self.size.width * self.scale, self.size.height * self.scale);
- UIGraphicsBeginImageContext(size);
- CGContextRef context = UIGraphicsGetCurrentContext();
- CGContextClearRect(context, CGRectMake(0, 0, size.width, size.height));
- [self drawInRect:CGRectMake(0, 0, size.width, size.height)];
- UIImage *image = UIGraphicsGetImageFromCurrentImageContext();
- UIGraphicsEndImageContext();
- return image;
- }
- /*
- * @brief flip horizontal
- */
- - (UIImage*)flipHorizontal
- {
- UIImage *image = nil;
- switch (self.imageOrientation) {
- case UIImageOrientationUp:
- {
- image = [UIImage imageWithCGImage:self.CGImage scale:1 orientation:UIImageOrientationUpMirrored];
- break;
- }
- case UIImageOrientationDown:
- {
- image = [UIImage imageWithCGImage:self.CGImage scale:1 orientation:UIImageOrientationDownMirrored];
- break;
- }
- case UIImageOrientationLeft:
- {
- image = [UIImage imageWithCGImage:self.CGImage scale:1 orientation:UIImageOrientationRightMirrored];
- break;
- }
- case UIImageOrientationRight:
- {
- image = [UIImage imageWithCGImage:self.CGImage scale:1 orientation:UIImageOrientationLeftMirrored];
- break;
- }
- case UIImageOrientationUpMirrored:
- {
- image = [UIImage imageWithCGImage:self.CGImage scale:1 orientation:UIImageOrientationUp];
- break;
- }
- case UIImageOrientationDownMirrored:
- {
- image = [UIImage imageWithCGImage:self.CGImage scale:1 orientation:UIImageOrientationDown];
- break;
- }
- case UIImageOrientationLeftMirrored:
- {
- image = [UIImage imageWithCGImage:self.CGImage scale:1 orientation:UIImageOrientationRight];
- break;
- }
- case UIImageOrientationRightMirrored:
- {
- image = [UIImage imageWithCGImage:self.CGImage scale:1 orientation:UIImageOrientationLeft];
- break;
- }
- default:
- break;
- }
- return image;
- }
- /*
- * @brief flip vertical
- */
- - (UIImage*)flipVertical
- {
- UIImage *image = nil;
- switch (self.imageOrientation) {
- case UIImageOrientationUp:
- {
- image = [UIImage imageWithCGImage:self.CGImage scale:1 orientation:UIImageOrientationDownMirrored];
- break;
- }
- case UIImageOrientationDown:
- {
- image = [UIImage imageWithCGImage:self.CGImage scale:1 orientation:UIImageOrientationUpMirrored];
- break;
- }
- case UIImageOrientationLeft:
- {
- image = [UIImage imageWithCGImage:self.CGImage scale:1 orientation:UIImageOrientationLeftMirrored];
- break;
- }
- case UIImageOrientationRight:
- {
- image = [UIImage imageWithCGImage:self.CGImage scale:1 orientation:UIImageOrientationRightMirrored];
- break;
- }
- case UIImageOrientationUpMirrored:
- {
- image = [UIImage imageWithCGImage:self.CGImage scale:1 orientation:UIImageOrientationDown];
- break;
- }
- case UIImageOrientationDownMirrored:
- {
- image = [UIImage imageWithCGImage:self.CGImage scale:1 orientation:UIImageOrientationUp];
- break;
- }
- case UIImageOrientationLeftMirrored:
- {
- image = [UIImage imageWithCGImage:self.CGImage scale:1 orientation:UIImageOrientationLeft];
- break;
- }
- case UIImageOrientationRightMirrored:
- {
- image = [UIImage imageWithCGImage:self.CGImage scale:1 orientation:UIImageOrientationRight];
- break;
- }
- default:
- break;
- }
- return image;
- }
- /*
- * @brief flip horizontal and vertical
- */
- - (UIImage*)flipAll
- {
- return [self rotate180];
- }
- @end
- UIImage+Rotate_Flip.m
以上只是實(shí)現(xiàn)了圖像的順時(shí)針90°,逆時(shí)針90°,180°旋轉(zhuǎn),以及水平翻轉(zhuǎn),數(shù)值翻轉(zhuǎn)等。至 于任意角度旋轉(zhuǎn)怎么實(shí)現(xiàn)?其實(shí)也很簡(jiǎn)單,留著給大家思考吧。雖然我們可以通過(guò)orientation這種方法簡(jiǎn)單的完成圖像旋轉(zhuǎn),但是如果有時(shí)間的話還是 建議大家盡量的看一下那種通過(guò)transform來(lái)完成旋轉(zhuǎn)的代碼,你會(huì)徹底搞清楚旋轉(zhuǎn)矩陣是怎么回事兒。當(dāng)然程序中使用的時(shí)候推薦使用我上面提供的這種 方法,因?yàn)椴簧婕罢鎸?shí)的旋轉(zhuǎn)操作,速度會(huì)快很多。
通過(guò)上面的小例子,我們可以看出越高級(jí)別的API幫助我們做的事情就越多,越底層的API提 供了更多的靈活性,但同時(shí)也帶來(lái)了很多需要我們處理的東西。再編程的過(guò)程中盡量的使用高級(jí)別的API,同時(shí)***能搞懂底層的實(shí)現(xiàn)機(jī)制。這樣我們的程序才會(huì) 更高效,出了問(wèn)題才知道去哪里查找。
來(lái)自www.cnblogs.com/smileEvday/archive/2013/05/14/UIImage.html