瘋狂ios講義之實例：通過捏合手勢縮放圖片

實例：通過捏合手勢縮放圖片

捏合手勢處理器可以檢測到用戶手勢捏合的比例，解析該捏合比例即可對圖片進行縮放。本實例將通過捏合手勢對圖片進行縮放。創建一個Single View Application，該應用包含一個應用程序委托類、一個視圖控制器類以及配套的Main.storyboard界面設計文件。在Interface Builder中打開該界面設計文件，將一個UIImageView拖入界面設計文件中，并讓該UIImageView控件與應用界面保持相同大小。為了在程序中能訪問UIImageView控件，需要將該控件綁定到控制器的p_w_picpathView IBOutlet屬性。

由于該程序需要對圖片進行縮放，因此我們將《瘋狂iOS講義》上冊第12章介紹繪圖時開發的UIImage(FKCategory)分類添加到該應用中，這樣就可為UIImage類增加圖片縮放、旋轉等方法。

接下來修改視圖控制器類，在視圖控制器類中使用UIPinchGestureRecognizer來檢測用戶捏合手勢，并根據捏合手勢對圖片進行縮放。下面是該控制器類的實現代碼。

程序清單：codes/01/1.3/PinchImage/PinchImage/FKViewController.m

@implementation FKViewController

UIImage* srcImage;

CGFloat currentScale;

- (void)viewDidLoad

{

[superviewDidLoad];

[UIApplication sharedApplication].statusBarHidden = YES;

srcImage= [UIImage p_w_picpathNamed:@"seashore.png"];

// 設置圖片直接顯示在中間（不進行任何縮放）

self.view.contentMode = UIViewContentModeCenter;

// 設置p_w_picpathView初始顯示的圖片

self.p_w_picpathView.p_w_picpath = srcImage;

// 設置初始的縮放比例

currentScale = 1;

// 設置p_w_picpathView允許用戶交互，支持多點觸碰

self.p_w_picpathView.userInteractionEnabled = YES;

self.p_w_picpathView.multipleTouchEnabled = YES;

// 創建UIPinchGestureRecognizer手勢處理器，該手勢處理器激發scaleImage:方法

UIPinchGestureRecognizer* gesture = [[UIPinchGestureRecognizer alloc]

initWithTarget:self action:@selector(scaleImage:)];

// 為p_w_picpathView添加手勢處理器

[self.p_w_picpathView addGestureRecognizer:gesture];

}

- (void)scaleImage:(UIPinchGestureRecognizer*)gesture

{

CGFloatscale = gesture.scale;

// 如果捏合手勢剛剛開始

if (gesture.state ==UIGestureRecognizerStateBegan)

{

// 計算當前縮放比

currentScale= self.p_w_picpathView.p_w_picpath.size.width / srcImage.size.width;

}

// 根據手勢處理器的縮放比例計算圖片縮放后的目標大小

CGSizetargetSize = CGSizeMake(srcImage.size.width * scale * currentScale,

srcImage.size.height * scale * currentScale);

// 對圖片進行縮放

self.p_w_picpathView.p_w_picpath = [srcImage p_w_picpathByScalingToSize:targetSize];

}

@end

該實例使用捏合手勢處理器的方法與前面介紹的沒有任何區別，只是程序中增加了粗體字代碼的判斷。該粗體字代碼判斷當捏合手勢開始時，程序會把當前圖片的縮放比例記錄下來作為圖片的當前縮放比例，然后用捏合手勢的縮放比例乘以當前縮放比例作為圖片真正的縮放比例，接下來調用UIImage(FKCategory)分類中的方法對圖片進行縮放。

編譯、運行該程序，按下option鍵與鼠標配合模擬用戶的兩個手指進行捏合，即可看到如圖1.4所示的效果。

圖1.4　使用捏合手勢處理器縮放圖片