如何在基于Utility的iPhone应用程序的MainView.xib中添加可滚动/可缩放的图像

我已经在xcode中为iphone创build了一个基于工具的应用程序。 基本上我有一个主视图和flipside视图。

在主视图中,我有一个图像以及一个button和一个标签,可以进入反面视图。

但是,如何使图像可缩放/可捏? 我所看到的所有教程和代码都是基于View Based Application的,当我把它复制到它的时候,只是出现了大量的错误。

例如,我没有一个Classes文件夹。 有人可以提供一些示例代码,当你从新的项目窗口中select基于应用程序的应用程序,当你打开xcode。

好吧,看你想要的代码,我觉得适合做一个完整的教程(我很无聊,让我们这样做!)。

打开Xcode并启动一个新的基于工具的项目(不要破坏旧版本)并将其命名为“PinchZoomingImages”(不带引号)。 确保ARC closures ,我喜欢用旧的方式编码;)。 Xcode模板选择器

我们将在其中使用带有UIImage的UIScrollView 。 进入适当命名的“MainViewController.h”并粘贴这个代码:

#import "FlipsideViewController.h" @interface MainViewController : UIViewController <FlipsideViewControllerDelegate, UIScrollViewDelegate> { //Both of these iVars are unnecessary with or without ARC, IBOutlet UIScrollView *scrollView; IBOutlet UIImageView * demoImageView; } //You can use 'strong' instead of retain, they both mean the same thing @property (nonatomic, retain) IBOutlet UIImageView * demoImageView; @property (nonatomic, retain) IBOutlet UIScrollView *scrollView; - (IBAction)showInfo:(id)sender; @end 

我们需要UIImageViewUIScrollView指针,因为我们将在.m文件中定义它们。 说到魔鬼,在.m中,粘贴这个在整个事情:

 #import "MainViewController.h" @implementation MainViewController //It is not necessary to @synthesize any properties if your Xcode version is >=4.5 @synthesize scrollView, demoImageView; #pragma mark - View lifecycle - (void)viewDidLoad { [scrollView setBackgroundColor:[UIColor blackColor]]; [scrollView setCanCancelContentTouches:NO]; scrollView.clipsToBounds = YES; // default is NO, we want to restrict drawing within our scrollview scrollView.indicatorStyle = UIScrollViewIndicatorStyleWhite; demoImageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"PDF-icon.png"]]; [scrollView addSubview:demoImageView]; [scrollView setContentSize:CGSizeMake(demoImageView.frame.size.width, demoImageView.frame.size.height)]; scrollView.minimumZoomScale = 1; scrollView.maximumZoomScale = 3; scrollView.delegate = self; [scrollView setScrollEnabled:YES]; [super viewDidLoad]; // Do any additional setup after loading the view, typically from a nib. } - (void)scrollViewDidZoom:(UIScrollView *)aScrollView {  CGFloat offsetX = (scrollView.bounds.size.width > scrollView.contentSize.width)?           (scrollView.bounds.size.width - scrollView.contentSize.width) * 0.5 : 0.0;  CGFloat offsetY = (scrollView.bounds.size.height > scrollView.contentSize.height)?           (scrollView.bounds.size.height - scrollView.contentSize.height) * 0.5 : 0.0;  mySubView.center = CGPointMake(scrollView.contentSize.width * 0.5 + offsetX,                  scrollView.contentSize.height * 0.5 + offsetY); } - (void)viewDidUnload { [super viewDidUnload]; // Release any retained subviews of the main view. // eg self.myOutlet = nil; } - (BOOL)shouldAutorotateToInterfaceOrientation:(UIInterfaceOrientation)interfaceOrientation { // Return YES for everything but the portrait-upside-down orientation return (interfaceOrientation != UIInterfaceOrientationPortraitUpsideDown); } #pragma mark - Flipside View - (void)flipsideViewControllerDidFinish:(FlipsideViewController *)controller { [self dismissModalViewControllerAnimated:YES]; } - (IBAction)showInfo:(id)sender { //Code created by the Utilities Template FlipsideViewController *controller = [[[FlipsideViewController alloc] initWithNibName:@"FlipsideViewController" bundle:nil] autorelease]; controller.delegate = self; controller.modalTransitionStyle = UIModalTransitionStyleFlipHorizontal; [self presentModalViewController:controller animated:YES]; } -(UIView *) viewForZoomingInScrollView:(UIScrollView *)scrollView { return demoImageView; } @end 

尖叫! 你有没有注意到这条线?

 demoImageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"PDF-icon.png"]]; 

会使你的项目崩溃 你需要拖动一个图像,并在[UIImage imageNamed:@"//your image name + extension"]消息中将其名称逐字(它是cAsE SeNsTiVe)复制。

另外,请注意-(void)viewDidLoad方法中的这一行:

 scrollView.delegate = self; 

这就是为什么我们把UIScrollViewDelegate放在.h文件中的一对“<>”中,因为我们需要通知编译器我们要“符合”到UIScrollViewDelegate协议。

最后,挂上那些IBOutlets(如果它不在那里,请先把视图挂钩,这是一个基本的,容易忘记的事情): 在这里输入图像说明

这是最终产品的样子(推出时): 在这里输入图像说明

(在缩放时,您可以按住模拟器中的“选项”button并拖动鼠标):

在这里输入图像说明