如何使用 SwipeGestureRecognizer 更改 UIImageView 图像？答案

【问题标题】：How to change UIImageView image using SwipeGestureRecognizer?如何使用 SwipeGestureRecognizer 更改 UIImageView 图像？
【发布时间】：2013-09-20 08:41:47
【问题描述】：

大家好，我有一个UIViewController 和 UIImageView，我有一个 SwipeGestureRecognizer。因此，如果用户向左或向右滑动，它将changeUIImageView 图像。到目前为止它的工作。我不能使用UIScrollView 一个图像的大小，启用分页。我想实现拖动的效果并查看下一个UIImageView 的部分，就像在图像的UIScrollView 中一样。

【问题讨论】：

所以你想用滑动而不是滚动视图来改变图像，但具有相同的“效果”？
是的，更改图像部分正在向左或向右滑动。是的，我试图达到与图像在图像的 uiscrollview 中一样的效果，当您开始拖动时，您可以看到部分下一张或上一张图片
没有 UIScrollview 你不能期望像 UIImage2 这样的效果需要紧接着 UIImage1 出现。但是您可以使用 UISwipeGesture Reconozer 根据滑动来更改图像。为此，您需要动态地从 NSArray 图像中获取图像。
我已经能够更改图像.. 所以没有工作可以产生与 uiscrollview 中相同的效果？
我添加了一个答案veereef，检查一下

标签： ios objective-c uiscrollview uiimageview uiswipegesturerecognizer

【解决方案1】：

简单回答：

为图像视图添加两个手势并放置一个计数变量，根据滑动和否切换计数变量。的图像。最后根据计数更改图像。

使用此代码也可以正常工作且简单。

- (void)addAnimationPresentToView:(UIView *)viewTobeAnimated
{
    CATransition *transition = [CATransition animation];
    transition.duration = 0.30;
    transition.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionLinear];
    [transition setValue:@"IntroSwipeIn" forKey:@"IntroAnimation"];
    transition.fillMode=kCAFillModeForwards;
    transition.type = kCATransitionPush;
    transition.subtype =kCATransitionFromRight;
    [viewTobeAnimated.layer addAnimation:transition forKey:nil];

}

- (void)addAnimationPresentToViewOut:(UIView *)viewTobeAnimated
{
    CATransition *transition = [CATransition animation];
    transition.duration = 0.30;
    transition.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionLinear];
    [transition setValue:@"IntroSwipeIn" forKey:@"IntroAnimation"];
    transition.fillMode=kCAFillModeForwards;
    transition.type = kCATransitionPush;
    transition.subtype =kCATransitionFromLeft;
    [viewTobeAnimated.layer addAnimation:transition forKey:nil];

}
                - (void)viewDidLoad
                {
                    [super viewDidLoad];
                    count = 0;
                    // Do any additional setup after loading the view from its nib.
                    [self.imageViewSwipe setUserInteractionEnabled:YES];
                    UISwipeGestureRecognizer *swipeLeft = [[UISwipeGestureRecognizer alloc] initWithTarget:self action:@selector(handleSwipe:)];
                    UISwipeGestureRecognizer *swipeRight = [[UISwipeGestureRecognizer alloc] initWithTarget:self action:@selector(handleSwipeRight:)];

                    // Setting the swipe direction.
                    [swipeLeft setDirection:UISwipeGestureRecognizerDirectionLeft];
                    [swipeRight setDirection:UISwipeGestureRecognizerDirectionRight];

                    // Adding the swipe gesture on image view
                    [self.imageViewSwipe addGestureRecognizer:swipeLeft];
                    [self.imageViewSwipe addGestureRecognizer:swipeRight];


                }
                -(void)changeImage
                {
                    switch (count) {
                        case 1:
                            self.imageViewSwipe.image = [UIImage imageNamed:@"Screen Shot 2013-09-17 at 10.57.51 AM.png"];
                            break;
                        case 2:
                            self.imageViewSwipe.image = [UIImage imageNamed:@"Screen Shot 2013-09-17 at 10.58.04 AM.png"];
                            break;
                        case 3:
                            self.imageViewSwipe.image = [UIImage imageNamed:@"Screen Shot 2013-09-17 at 10.58.00 AM.png"];
                            break;

                        default:
                            break;
                    }
                }
                -(void)handleSwipe:(id)sender
                {
                 if(count < 4)
                 {
                     count++;
                     UIImageView *moveIMageView = self.imageViewSwipe;
                     [self addAnimationPresentToView:moveIMageView];
                     [self changeImage];
                 }

                }
                -(void)handleSwipeRight:(id)sender
                {
                    if(count>0)
                    {
                        count--;
                  UIImageView *moveIMageView = self.imageViewSwipe;
                 [self addAnimationPresentToViewOut:moveIMageView];
                        [self changeImage];
                    }

                }
                    -(void)handleSwipe:(id)sender
                    {
                     if(count < 4)
                     {
                         count++;
                         [self changeImage];
                     }

                    }
                    -(void)handleSwipeRight:(id)sender
                    {
                        if(count>0)
                        {
                            count--;
                            [self changeImage];
                        }

                    }

【讨论】：

这个答案不好，这只会改变图像，不会改变具有滚动视图效果的图像，所以它不是问题的答案
现在检查为左右滑动完美修复添加的动画效果。

【解决方案2】：

将scrollview添加到主视图（适当设置框架）

[mainview addSubview:scr];

写一个类似的方法：

- (void)setupScrollView:(UIScrollView*)scrMain {
}

然后在viewDidLoad 中将滚动视图传递给方法，

 [self setupScrollView:scr];



- (void)setupScrollView:(UIScrollView*)scrMain {
    // we have 10 images here.
    // we will add all images into a scrollView & set the appropriate size.

    for (int i=1; i<=5; i++) {
        // create image
//        UIImage *image = [UIImage imageNamed:[NSString stringWithFormat:@"sti%02i.png",i]];
        UIImage *image = [UIImage imageNamed:[NSString stringWithFormat:@"sti%02i.png",i]];
        // create imageView
//        NSLog(@"===============>%d",i);
        UIImageView *imgV = [[UIImageView alloc] initWithFrame:CGRectMake((i-1)*scrMain.frame.size.width, 0, scrMain.frame.size.width, scrMain.frame.size.height)];
        // set scale to fill
        imgV.contentMode=UIViewContentModeScaleToFill;
        // set image
        [imgV setImage:image];
        // apply tag to access in future
        imgV.tag=i+1;
        // add to scrollView
        [scrMain addSubview:imgV];
    }
    // set the content size to 10 image width
    [scrMain setContentSize:CGSizeMake(scrMain.frame.size.width*5, scrMain.frame.size.height)];
    // enable timer after each 2 seconds for scrolling.
    // [NSTimer scheduledTimerWithTimeInterval:2 target:self selector:nil userInfo:nil repeats:YES];
}

它可以让你手动在两个方向上移动。

【讨论】：

scrollview 只是为了包含所有图像框架。您可以使用相同的代码拖动图像...尝试使用它，然后让我知道您想要什么。

【解决方案3】：

*你可以尝试使用 imageView.layer 来提供一些动画效果。 *

【讨论】：

您好，谢谢您的回复.. 我正在看动画，您能举个例子吗？

【解决方案4】：

我认为最好使用UIPanGestureRecognizer:

UIPanGestureRecognizer * pan1 = [[UIPanGestureRecognizer alloc]initWithTarget:self action:@selector(moveObject:)];
pan1.minimumNumberOfTouches = 1;
[image1 addGestureRecognizer:pan1];

-(void)moveObject:(UIPanGestureRecognizer *)pan;
{
 image1.center = [pan locationInView:image1.superview];
}

当您开始拖动时，请检查方向。如果方向是从左到右，则使用 -image.width 将“之前”图像添加到屏幕，并在 move 方法中移动此 imageBefore.center = [pan locationInView:image1.superview];也。如果方向是从右到左，则使用+screensize+image.width 将“下一个”图像添加到scree，并在移动方法中移动此imageNext.center = [pan locationInView:image1.superview];也是。

我还没有尝试过，但我认为它应该可以工作。希望对你有帮助

编辑：

我为你找到了如何检测方向：

-(void)moveObject:(UIPanGestureRecognizer *)pan;
{

    CGPoint vel = [pan velocityInView:self.view];
    if (vel.x > 0)
    {
        // user dragged towards the right
        counter++;
    }  
    else
    {
        // user dragged towards the left
        counter--;
    }
}

【讨论】：

你好谢谢我正在尝试你的代码..什么是“rec”？在 CGPoint vel = [rec velocityInView:self.view];?
你好，好的，谢谢..你能给我更多的细节如果方向是从右到左，使用+screensize+image.width将“下一个”图像添加到scree，并使用移动方法, 移动这个 imageNext.center = [pan locationInView:image1.superview];也。 ..虽然我没明白:)
我认为使用泛识别器是最好的方法

【解决方案5】：

-(void)panTableView:(UISwipeGestureRecognizer *)pan{
    if (pan.state==UIGestureRecognizerStateEnded) {
        int curr=currentPage;

        if (pan==self.panGestureLeft)
        {
            // user dragged towards the right

                CATransition *transition = [CATransition animation];
                transition.duration = 0.35;
                transition.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];
                transition.type = kCATransitionPush;
                transition.subtype =kCATransitionFromRight;
                transition.delegate = self;
                [scrollview.layer addAnimation:transition forKey:nil];


        }
        else if (pan==self.panGestureRight)
        {
            // user dragged towards the left

                CATransition *transition = [CATransition animation];
                transition.duration = 0.35;
                transition.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];
                transition.type = kCATransitionPush;
                transition.subtype =kCATransitionFromLeft;
                transition.delegate = self;
                [scrollview.layer addAnimation:transition forKey:nil];


        }



}

}

【讨论】：

【解决方案6】：

实现水平表格滚动

创建一个 TableView 并转换表格

self.horizontalTableView.transform = CGAffineTransformMakeRotation(-M_PI * 0.5);

然后，对单元格内的内容进行反向转换。

CGAffineTransformMakeRotation(M_PI * 0.5)

如果需要，您可以将其放入自定义 UITableViewCell 内的另一个 TableView 中，并有一个水平表的垂直表。

您将获得原生滚动的所有好处

请参阅本教程：

http://www.raywenderlich.com/4723/how-to-make-an-interface-with-horizontal-tables-like-the-pulse-news-app-part-2

【讨论】：