如何将可滚动/可缩放图像添加到基于实用程序的iPhone应用程序的MainView.xib中 [英] How do I add a scrollable/zoomable image into the MainView.xib of a Utility Based iPhone Application

查看:70
本文介绍了如何将可滚动/可缩放图像添加到基于实用程序的iPhone应用程序的MainView.xib中的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我在xcode中为iphone创建了一个基于实用程序的应用程序。基本上我有主视图和侧视图。



在主视图中,我有一个图像以及一个按钮和一个标签,可以转到侧面视图。



但是,如何使图像可缩放/可捏合?我所看到的所有教程和代码都基于一个基于视图的应用程序,当我来复制它时,就会出现大量的错误。



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

解决方案

好的,看到你想要一些代码,我认为它适合做一个完整的教程(我很无聊,让我们这样做!)。



打开Xcode并开始一个新的基于公用事业的项目(不要乱扔旧的)并将其命名为'PinchZoomingImages'(不带引号)。确保ARC已经 OFF ,我喜欢用老式的方式编码;)。



我们将使用 UIScrollView 其中包含 UIImage 。进入适当命名的'MainViewController.h'并粘贴以下代码:

  #importFlipsideViewController.h

@interface MainViewController:UIViewController< FlipsideViewControllerDelegate,UIScrollViewDelegate> {
//无论是否有ARC,这两个iVar都是不必要的,
IBOutlet UIScrollView * scrollView;
IBOutlet UIImageView * demoImageView;
}
//你可以使用'strong'代替retain,它们都意味着同样的东西
@property(nonatomic,retain)IBOutlet UIImageView * demoImageView;
@ property(nonatomic,retain)IBOutlet UIScrollView * scrollView;

- (IBAction)showInfo:(id)sender;

@end

我们需要 UIImageView UIScrollView 指针,因为我们将在.m文件中定义它们。在.m中说出魔鬼,将其粘贴到整个事物中:

  #importMainViewControll er.h

@implementation MainViewController
//如果您的Xcode版本是> = 4.5
@synthesize scrollView,demoImageView,则没有必要@synthesize任何属性。

#pragma mark - 查看生命周期

- (void)viewDidLoad
{
[scrollView setBackgroundColor:[UIColor blackColor]];
[scrollView setCanCancelContentTouches:NO];
scrollView.clipsToBounds = YES; //默认为NO,我们想在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];
//加载视图后进行任何其他设置,通常是从笔尖。
}
- (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];
//释放主视图的所有保留子视图。
//例如self.myOutlet = nil;
}

- (BOOL)shouldAutorotateToInterfaceOrientation:(UIInterfaceOrientation)interfaceOrientation
{
//除了纵向倒置方向以外的所有内容都返回YES
return(interfaceOrientation!= UIInterfaceOrientationPortraitUpsideDown);
}

#pragma mark - Flipside View

- (void)flipsideViewControllerDidFinish:(FlipsideViewController *)controller
{
[self dismissModalViewControllerAnimated :是];
}

- (IBAction)showInfo:(id)sender
{
//由Utilities Template创建的代码
FlipsideViewController * controller = [[ [FlipsideViewController alloc] initWithNibName:@FlipsideViewControllerbundle:nil] autorelease];
controller.delegate = self;
controller.modalTransitionStyle = UIModalTransitionStyleFlipHorizo​​ntal;
[self presentModalViewController:controller animated:YES];
}
- (UIView *)viewForZoomingInScrollView:(UIScrollView *)scrollView {
return demoImageView;
}
@end

SCREECH! 你在这里注意到这一行吗?:

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

会使您的项目崩溃。你需要拖动一个图像并在 [UIImage imageNamed:@//你的图像名称+扩展名] 消息中逐字复制它的名字(它是cAsE SeNsTiVe)。 / p>

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

  scrollView.delegate = self; 

这就是为什么我们将 UIScrollViewDelegate 放入一对:.h文件中的<>,因为我们需要向编译器宣布我们要符合 UIScrollViewDelegate 协议。



最后,连接这些IBOutlets(如果它不存在,请先将视图挂起来。这是一个基本的,容易忘记的事情):



这是什么最终产品看起来像(启动时):



(缩放时,您可以通过按住模拟器中的选项按钮并拖动鼠标来执行此操作):




I have created a Utility based application for the iphone in xcode. Basically i have a mainview and a flipside view.

On the main view i have an image as well as a button and a label to go to the flipside view.

However, how do i make the image zoomable/pinchable? All the tutorials and code i have seen has been based on a View Based Application and when i come to copy it in it just comes up with tonnes of errors.

For example, i don't have a Classes folder. Can somebody please provide some sample code for this when you choose Utility Based Application from the new project window when you open xcode.

解决方案

OK, seeing as you want some code, I see it fitting to do a full tutorial (I'm bored, let's do this!).

Open up Xcode and start a new Utilities based project (DO NOT TRASH THE OLD ONE) and name it 'PinchZoomingImages' (without the quotes). Make sure ARC is turned OFF, I like to code the old fashioned way ;).

We will be using a UIScrollView with a UIImage in it. Go into the appropriately named 'MainViewController.h" and paste in this code:

    #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

We need the UIImageView and UIScrollView pointers because we will be defining them in the .m file. Speak of the devil, in the .m, paste this in over the whole thing:

#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.
    // e.g. 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

SCREECH! Did you notice this line here?:

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

That will crash your project. you need to drag in an image and copy it's name verbatim (it's cAsE SeNsTiVe) in the [UIImage imageNamed:@"//your image name + extension"] message.

Also, notice this line in the -(void)viewDidLoad method:

scrollView.delegate = self;  

This is why we put UIScrollViewDelegate in a pair of these: "<>" in the .h file, because we need to announce to the compiler that we want to "conform" to the UIScrollViewDelegate protocol.

And finally, hook up those IBOutlets (Please, Please hook up the view one first if it isn't already there. It's a basic and easily forgettable thing):

and here's what the final product looks like (Upon Launch):

(Upon zooming, which you can do by holding down the 'option' button in the simulator and dragging the mouse):

这篇关于如何将可滚动/可缩放图像添加到基于实用程序的iPhone应用程序的MainView.xib中的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
相关文章
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆