如何为下一个/后一个UIImageView创建滑动

时间:2014-03-25 09:55:16

标签: ios json xcode uicollectionview uicollectionviewcell

我有UIImageView就像简单的Gallery,可以从JSON获取数据。

-(void)connectionDidFinishLoading:(NSURLConnection *)connection
{
    NSDictionary *allDataDictionary = [NSJSONSerialization JSONObjectWithData:webdata options:0 error:nil];
    NSArray *tmp =[allDataDictionary objectForKey:@"gallery"];
    if (tmp.count>0){

        for (NSDictionary *diction in tmp) {
            [self.patternImagesArray addObject:diction];
        }

        NSLog(@"%@", self.patternImagesArray);
      //  [loading stopAnimating];

    }

    [self.collectionView reloadData];
}

-(UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath{

    PatternView *cell = [collectionView dequeueReusableCellWithReuseIdentifier:@"PatternCell" forIndexPath:indexPath];

    NSString *myPatternString = [[self.patternImagesArray objectAtIndex:indexPath.row] valueForKey:@"thumb"];

    NSData *data = [NSData dataWithContentsOfURL:[NSURL URLWithString:myPatternString]];
    cell.patternImageView.image = [UIImage imageWithData:data];

    return cell;


}

为了给出完整的图像我用这个:

-(void)viewDidLoad{

    NSString *path=[_newsData valueForKey:@"bigimg"];

    NSData* imageData = [NSData dataWithContentsOfURL: [NSURL URLWithString: path]];

    UIImage* image = [UIImage imageWithData: imageData];

        NSLog(@"%@", image);

    _imageParse.image = image;

    [_PanelTools setHidden:YES];


}

当我按下我的CollectionViewCell中的任何图像时,我可以看到完整的图像,但是如何为下一个图像或向后创建左/右滑动。我知道如何向任何一侧滑动,但如何创建向下/向后滑动图像。

enter image description here

2 个答案:

答案 0 :(得分:5)

首先,创建两个方法-nextImage和-prevImage,并分别放入代码以显示下一个和上一个图像。

然后使用-viewDidLoad中的以下代码添加滑动手势识别器:

UISwipeGestureRecognizer *swipeLeft = [[UISwipeGestureRecognizer alloc]initWithTarget:self action:@selector(swipeImage:)];
swipeLeft.direction = UISwipeGestureRecognizerDirectionLeft;
[_imageParse addGestureRecognizer:swipeLeft];

UISwipeGestureRecognizer *swipeRight = [[UISwipeGestureRecognizer alloc]initWithTarget:self action:@selector(swipeImage:)];
swipeRight.direction = UISwipeGestureRecognizerDirectionRight;
[_imageParse addGestureRecognizer:swipeRight];

为了能够显示图像,您需要首先使用当前项目发送整个数据数组而不是字典。为此,将_newsData属性转换为NSArray,并在新viewController中设置当前项的字典,而是设置整个数据。另外,引入一个新变量。像这样:

@property (strong, nonatomic) NSArray *newsData;
@property NSInteger currentIndex;

介绍一种基于索引显示图像的方法

-(void)showImageAtIndex:(NSInteger)index
{
    NSString *path=[[_newsData objectAtIndex:index] objectForKey:@"bigimg"];
    NSData* imageData = [NSData dataWithContentsOfURL: [NSURL URLWithString: path]];

    UIImage* image = [UIImage imageWithData: imageData];

    NSLog(@"%@", image);

    _imageParse.image = image;
}

现在,在viewDidLoad方法中,将当前图像设置为:

[self showImageAtIndex:_currentIndex];

-swipeImage方法应如下所示:

-(void)swipeImage:(UISwipeGestureRecognizer*)recognizer
{
    NSInteger index = _currentIndex;

    if (recognizer.direction == UISwipeGestureRecognizerDirectionLeft)
    {
        index++;
    }
    else if (recognizer.direction == UISwipeGestureRecognizerDirectionRight)
    {
        index--;
    }

    if (index > 0 || index < ([_newsData count] - 1))
    {
        _currentIndex = index;
        [self showImageAtIndex:_currentIndex];
    }
    else
    {
        NSLog(@"Reached the end, swipe in opposite direction");
    }

}

这里是GalleryControllerCollection类的-prepareForSegue方法应该是什么样的:

-(void)prepareForSegue:(UIStoryboardSegue *)segue sender:(id)sender
{
    PatternView *cell = (PatternView *)sender;
    NSIndexPath *indexPath = [self.collectionView indexPathForCell:cell];

    GalleryControllerFullmage *vc = (GalleryControllerFullmage*)segue.destinationViewController;
    vc.newsData = [_patternImagesArray copy];
    vc.currentIndex = indexPath.row;
}

将从集合转换到图像视图的segue命名为&#34; goToFullImage&#34;

-(void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath
{
    [self performSegueWithIdentifier:@"goToFullImage" sender:[collectionView cellForItemAtIndexPath:indexPath]];
}

答案 1 :(得分:1)

启用默认情况下禁用的UIImage视图用户交互。

[imageView setUserInteractionEnabled:YES];

添加滑动手势事件

UISwipeGestureRecognizer *swipeLeft = [[UISwipeGestureRecognizer alloc] initWithTarget:self action:@selector(handleSwipe:)];

UISwipeGestureRecognizer *swipeRight = [[UISwipeGestureRecognizer alloc] initWithTarget:self action:@selector(handleSwipe:)];

//设置滑动方向。

[swipeLeft setDirection:UISwipeGestureRecognizerDirectionLeft];
[swipeRight setDirection:UISwipeGestureRecognizerDirectionRight];

处理滑动手势事件

- (void)handleSwipe:(UISwipeGestureRecognizer *)swipe {

    if (swipe.direction == UISwipeGestureRecognizerDirectionLeft) {

        NSLog(@"Left Swipe");

    }

    if (swipe.direction == UISwipeGestureRecognizerDirectionRight) {

        NSLog(@"Right Swipe");   

    } 

}