1

我用下面的代码iPhoto的风格,左右滑动即可用UISwipeGestureRecognizer展现在我的应用程序的照片以类似的方式到iPhoto。“适应”我目前UISwipeGestureRecognizer代码通过图像弹到利用UIPanGestureRecognizer

CATransition *animation = [CATransition animation]; 
    [animation setDuration:0.5]; 
    [animation setType:kCATransitionPush]; 
    [animation setSubtype:kCATransitionFromRight]; 
    [animation setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut]]; 
    [[self.imageHolder layer] addAnimation:animation forKey:@"SwitchToView"]; 

此滑动在下一图像和旧图像出像示于下面的照片:

图像中的一个:

Image One

过渡:

Transitional View

图片二:

Image Two

我想知道如何使这个像iPhoto中时,我明白了,我应该使用一个UIPanGestureRecognizer代替。

我需要“控制”与我在iPhoto中做,顺便手指动画即通过让我开始拖动到下一个图像,然后反向拖动方向。此外,与iPhoto类似,如果在下一张图像显示的第一张图像比下一张图像更多时释放手指,则希望下一张图像能够滑入(在上面的过渡图片中未发生此情况,如果我已发布。我的手指在iPhoto中这一点上,将滑回第一图像

我以前从来没有这样,如果有人可以帮助我走出那简直太好了使用UIPanGestureRecognizer

编辑:

使用由列维提供的代码,我已经创建了与3样本图像很好地工作的解决方案。对于任何人埃尔斯Ë谁是有兴趣在使用UIPanGestureRecognizer,代码:

接口:

#import <UIKit/UIKit.h> 

@interface ViewController : UIViewController <UIGestureRecognizerDelegate> 
{ 
int imageIndex; 
} 

@property (nonatomic, strong) UIImageView* imageView; 
@property (nonatomic, strong) UIImageView* leftImageView; 
@property (nonatomic, strong) UIImageView* rightImageView; 

@end 

实现:

#import "ViewController.h" 

@interface ViewController() 

@end 

@implementation ViewController 

- (void)viewDidLoad 
{ 
[super viewDidLoad]; 

self->imageIndex = 0; 

float xFactor; 

UIInterfaceOrientation currentOrientation = self.interfaceOrientation; 
if(UIInterfaceOrientationIsLandscape(currentOrientation)){ 

    xFactor = 256; 

} 
else{ 

    xFactor = 0; 

} 

self.imageView = [[UIImageView alloc] initWithFrame:self.view.frame]; 
self.imageView.contentMode = UIViewContentModeScaleAspectFit; 
self.imageView.image = [UIImage imageNamed:@"69B4356B-1CB2-4A2F-867E-9C086251DF11-12668-0000036A534E9B6D"]; 
self.imageView.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight; 

CGRect leftFrame = self.view.frame; 
leftFrame.origin.x -= leftFrame.size.width+xFactor; 
self.leftImageView = [[UIImageView alloc] initWithFrame:leftFrame]; 
self.leftImageView.contentMode = UIViewContentModeScaleAspectFit; 
self.leftImageView.image = [UIImage imageNamed:@"42517D93-F8BF-42E7-BB44-53B099A482AA-12668-0000036A49BCECAA"]; 
self.leftImageView.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight; 

CGRect rightFrame = self.view.frame; 
rightFrame.origin.x += rightFrame.size.width+xFactor; 
self.rightImageView = [[UIImageView alloc] initWithFrame:rightFrame]; 
self.rightImageView.contentMode = UIViewContentModeScaleAspectFit; 
self.rightImageView.image = [UIImage imageNamed:@"C6AC2508-243B-464B-A71F-96DD7F18673D-12668-00000369F3AFD3FC"]; 
self.rightImageView.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight; 

[self.view addSubview:self.imageView]; 
[self.view addSubview:self.leftImageView]; 
[self.view addSubview:self.rightImageView]; 

UIPanGestureRecognizer *recognizer = [[UIPanGestureRecognizer alloc] initWithTarget:self action:@selector(handlePan:)]; 
[self.view addGestureRecognizer:recognizer]; 
} 

- (void)didReceiveMemoryWarning 
{ 
[super didReceiveMemoryWarning]; 

} 

- (void)handlePan:(UIPanGestureRecognizer *)recognizer { 
if (recognizer.state == UIGestureRecognizerStateEnded) { 
    CGRect leftFrame = self.leftImageView.frame; 
    CGRect currentFrame = self.imageView.frame; 
    CGRect rightFrame = self.rightImageView.frame; 

    float duration = 0.0; 

    float factor; 

    UIInterfaceOrientation currentOrientation = self.interfaceOrientation; 
    if(UIInterfaceOrientationIsPortrait(currentOrientation)){ 

     factor = 768; 
    } 
    else{ 
     factor = 1024; 
    } 

    if (self.imageView.center.x < 0) { // Present the right image 
     duration = 0.3 * ABS(self.rightImageView.frame.origin.x/factor); 
     leftFrame.origin.x = -2 * factor; 
     currentFrame.origin.x = -1 * factor; 
     rightFrame.origin.x = 0; 
     self->imageIndex = 1; 

    } else if (self.imageView.center.x > factor) { // Present the left image 
     duration = 0.3 * ABS(self.leftImageView.frame.origin.x/factor); 
     leftFrame.origin.x = 0; 
     currentFrame.origin.x = factor; 
     rightFrame.origin.x = 2 * factor; 
     self->imageIndex = -1; 

    } else { // leave the middle image 
     duration = 0.3 * ABS(self.imageView.frame.origin.x/factor); 
     leftFrame.origin.x = -1 * factor; 
     currentFrame.origin.x = 0; 
     rightFrame.origin.x = factor; 
     self->imageIndex = 0; 

    } 

    [UIView animateWithDuration:duration 
          delay:0 
         options:UIViewAnimationOptionCurveEaseInOut 
        animations:^{ 
         self.leftImageView.frame = leftFrame; 
         self.imageView.frame = currentFrame; 
         self.rightImageView.frame = rightFrame; 
        } completion:^(BOOL finished) { 
        }]; 

} else { 
    CGPoint translation = [recognizer translationInView:recognizer.view]; 
    CGPoint leftCenter = self.leftImageView.center; 
    CGPoint currentCenter = self.imageView.center;   
    CGPoint rightCenter = self.rightImageView.center; 

    leftCenter.x += translation.x; 
    currentCenter.x += translation.x; 
    rightCenter.x += translation.x; 
    self.leftImageView.center = leftCenter; 
    self.imageView.center = currentCenter; 
    self.rightImageView.center = rightCenter; 

    [recognizer setTranslation:CGPointMake(0, 0) inView:self.imageView]; 
} 

} 

- (void)willAnimateRotationToInterfaceOrientation: 
(UIInterfaceOrientation)toInterfaceOrientation 
            duration:(NSTimeInterval)duration 
{ 
CGPoint leftCenter = self.leftImageView.center; 
CGPoint currentCenter = self.imageView.center; 
CGPoint rightCenter = self.rightImageView.center; 

if(UIInterfaceOrientationIsPortrait(toInterfaceOrientation)){ 

    leftCenter.x = 384+(((-self->imageIndex)-1)*768); 
    currentCenter.x = 384+((-self->imageIndex)*768); 
    rightCenter.x = 384+(((-self->imageIndex)+1)*768); 

} 
else{ 

    leftCenter.x = 512+(((-self->imageIndex)-1)*1024); 
    currentCenter.x = 512+((-self->imageIndex)*1024); 
    rightCenter.x = 512+(((-self->imageIndex)+1)*1024); 

} 

self.leftImageView.center = leftCenter; 
self.imageView.center = currentCenter; 
self.rightImageView.center = rightCenter; 

} 

@end 

回答

1

您可以将UIPanGestureRecognizer添加到您的图像视图。你必须分配给它的方法,你做这样的事情:

- (void)handlePan:(UIPanGestureRecognizer *)recognizer { 
    if (recognizer.state == UIGestureRecognizerStateEnded) { 

    } else { 
     CGPoint translation = [recognizer translationInView:recognizer.view]; 
     CGPoint center = recognizer.view.center; 
     UIImageView *imageViewToPresent = nil; 
     if (translation.x > 0) { 
      imageViewToPresent = [self leftImageView]; 
     } else { 
      imageViewToPresent = [self leftImageView]; 
     } 
     CGPoint actualCenter = recognizer.view.center; 
     CGPoint nextCenter = imageViewToPresent.center; 
     actualCenter.x += translation.x; 
     nextCenter.x += translation.x; 
     recognizer.view.center = actualCenter; 
     imageViewToPresent.view.center = nextCenter; 
     [recognizer setTranslation:CGPointMake(0, 0) inView:self.imageView]; 
    } 
} 

UIGestureRecognizerStateEnded部分,你可以决定要显示的图片。

或者只是使用ScrollView启用分页功能。它应该有同样的效果。但是,它需要同时加载所有图像。使用平移识别器,您需要3个图像视图顶部(左,右,当前)。

希望这会有所帮助!

编辑:

在头文件中应添加2个图片浏览次数:

#import <UIKit/UIKit.h> 

@interface ViewController : UIViewController <UIGestureRecognizerDelegate> 

@property (nonatomic, strong) UIImageView* imageView; 
@property (nonatomic, strong) UIImageView* leftImageView; 
@property (nonatomic, strong) UIImageView* rightImageView; 

@end 

的实施将是:

#import "ViewController.h" 

@interface ViewController() 

@end 

@implementation ViewController 

- (void)viewDidLoad 
{ 
    [super viewDidLoad]; 

    self.imageView = [[UIImageView alloc] initWithFrame:self.view.frame]; 
    self.imageView.contentMode = UIViewContentModeScaleAspectFit; 
    self.imageView.image = [UIImage imageNamed:@"69B4356B-1CB2-4A2F-867E-9C086251DF11-12668-0000036A534E9B6D"]; 
    self.imageView.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight; 

    CGRect leftFrame = self.view.frame; 
    leftFrame.origin.x -= leftFrame.size.width; 
    self.leftImageView = [[UIImageView alloc] initWithFrame:leftFrame]; 
    self.leftImageView.contentMode = UIViewContentModeScaleAspectFit; 
    self.leftImageView.image = [UIImage imageNamed:@"42517D93-F8BF-42E7-BB44-53B099A482AA-12668-0000036A49BCECAA"]; 
    self.leftImageView.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight; 

    CGRect rightFrame = self.view.frame; 
    rightFrame.origin.x += rightFrame.size.width; 
    self.rightImageView = [[UIImageView alloc] initWithFrame:rightFrame]; 
    self.rightImageView.contentMode = UIViewContentModeScaleAspectFit; 
    self.rightImageView.image = [UIImage imageNamed:@"C6AC2508-243B-464B-A71F-96DD7F18673D-12668-00000369F3AFD3FC"]; 
    self.rightImageView.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight; 

    [self.view addSubview:self.imageView]; 
    [self.view addSubview:self.leftImageView]; 
    [self.view addSubview:self.rightImageView]; 

    UIPanGestureRecognizer *recognizer = [[UIPanGestureRecognizer alloc] initWithTarget:self action:@selector(handlePan:)]; 
    [self.view addGestureRecognizer:recognizer]; 
} 

- (void)didReceiveMemoryWarning 
{ 
    [super didReceiveMemoryWarning]; 

} 

- (void)handlePan:(UIPanGestureRecognizer *)recognizer { 
    if (recognizer.state == UIGestureRecognizerStateEnded) { 
     CGRect leftFrame = self.leftImageView.frame; 
     CGRect currentFrame = self.imageView.frame; 
     CGRect rightFrame = self.rightImageView.frame; 
     float duration = 0.0; 
     if (self.imageView.center.x < 0) { // Present the right image 
      duration = 0.3 * ABS(self.rightImageView.frame.origin.x/self.view.frame.size.width); 
      leftFrame.origin.x = -2 * self.view.frame.size.width; 
      currentFrame.origin.x = -1 * self.view.frame.size.width; 
      rightFrame.origin.x = 0; 
     } else if (self.imageView.center.x > self.view.frame.size.width) { // Present the left image 
      duration = 0.3 * ABS(self.leftImageView.frame.origin.x/self.view.frame.size.width); 
      leftFrame.origin.x = 0; 
      currentFrame.origin.x = self.view.frame.size.width; 
      rightFrame.origin.x = 2 * self.view.frame.size.width; 
     } else { // leave the middle image 
      duration = 0.3 * ABS(self.imageView.frame.origin.x/self.view.frame.size.width); 
      leftFrame.origin.x = -1 * self.view.frame.size.width; 
      currentFrame.origin.x = 0; 
      rightFrame.origin.x = self.view.frame.size.width; 
     } 

     [UIView animateWithDuration:duration 
           delay:0 
          options:UIViewAnimationOptionCurveEaseInOut 
         animations:^{ 
      self.leftImageView.frame = leftFrame; 
      self.imageView.frame = currentFrame; 
      self.rightImageView.frame = rightFrame; 
     } completion:^(BOOL finished) { 
     }]; 
    } else { 
     CGPoint translation = [recognizer translationInView:recognizer.view]; 
     CGPoint currnetCenter = self.imageView.center; 
     CGPoint leftCenter = self.leftImageView.center; 
     CGPoint rightCenter = self.rightImageView.center; 

     currnetCenter.x += translation.x; 
     leftCenter.x += translation.x; 
     rightCenter.x += translation.x; 
     self.imageView.center = currnetCenter; 
     self.leftImageView.center = leftCenter; 
     self.rightImageView.center = rightCenter; 


     [recognizer setTranslation:CGPointMake(0, 0) inView:self.imageView]; 
    } 

} 

@end 

当然,它仍然需要工作(例如,为了支持超过3个硬编码图像)。如果您使用IBOutlet,它可能会帮助您解决旋转问题,并从Interface Builder中设置自动调整大小的遮罩。

玩得开心!

+0

嗨。我希望能够接受你的答案,因为这听起来像是我需要的,但是我做了一个新的项目,简化了你的想法,但却无法实现。请看看你是否有时间。 [下载链接](http://rapidshare.com/files/1837376668/scrollTest.zip)'imageViewToPresent.view.center = nextCenter;'提供了一个错误,所以我想你的意思是'imageViewToPresent.center = nextCenter;'?然而,在这一行上给出了一个未使用的警告:'CGPoint center = recognizer.view.center;'如果你有机会,请看看我不想实现带分页的scrollView。谢谢 –

+0

哇!非常感谢。明天我会检查一下。欢呼声 –

+0

不客气。目前它只能用于肖像模式。在风景中,图像重叠。 – Levi

1

如果你想要像照片应用程序中的滚动行为,你不该”根本不使用UIGestureRecognizer。使用UIPageViewControllerUIPageViewControllerTransitionStyleScroll,或者如果你需要支持的版本比iOS6的低,使用UIScrollView

检查出使用UIScrollView为例苹果的样本项目PhotoScroller

+0

谢谢。你说的是真的。正如Levi在本页的其他地方所建议的,启用分页的scrollView是一种解决方案。但是,我接受了Levi的答案,因为它提供了一个额外的解决方案,我已经能够适应3幅图像的情况,并根据需要使用** UIPanGestureRecognizer **。感谢你的回答。 –

相关问题