Animation of scrolling in collectionview in ios

Question

I have one one collectionview in that I have 10 images loaded from webservice. I want to autoscroll that imageview from 1st to last position and then last to 1st position continuously whenever that page appears. I use below method

-(void)scrollSlowly 
{
    CATransition *transition = [CATransition animation];
    transition.duration = 4.0f;
    transition.type = kCATransitionPush;
    transition.subtype = kCATransitionFromLeft;
    [transition setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut]];
    [UIView animateWithDuration:5.0f
                          delay:3.0f
                        options:UIViewAnimationOptionRepeat | UIViewAnimationOptionAutoreverse
                     animations:^{

                         [self.CollectionView setContentOffset:CGPointMake(CGFLOAT_MAX ,0)];

                     }
                     completion:nil];
    [self.CollectionView.layer addAnimation:transition forKey:@"transition"];
}

-(void)scrollSlowlyToPoint 
{
   self.CollectionView.contentOffset = self.scrollingPoint;
    //    Here you have to respond to user interactions or else the scrolling will not stop until it reaches the endPoint.
   if (CGPointEqualToPoint(self.scrollingPoint, self.endPoint))
   {
       [self.scrollingTimer invalidate];
   }
    //    Going one pixel to the right.
   self.scrollingPoint = CGPointMake(self.scrollingPoint.x+1, self.scrollingPoint.y);
}

I want to autoscroll horizontally in Objective-C. thanks in advance

Why wouldn't you use `- (void)scrollToItemAtIndexPath:(NSIndexPath *)indexPath atScrollPosition:(UICollectionViewScrollPosition)scrollPosition animated:(BOOL)animated` ? — s0urcer, Apr 12 '16 at 06:56
Yes i too use this but it wont give me repetitive slow scrolling... @sourcer — Aashi, Apr 12 '16 at 08:59

Akash KR · Accepted Answer · 2016-05-05T12:51:08.217

1

Create a custom UICollectionViewCell class, create and connect an outlet for image view.

In .h file:

    NSMutableArray *imgArr;
    NSInteger testIndexPath;

I guess you can implement the datasource methods for UICollectionView.

In cellForItemAtIndexPath add this line after adding images to the imageview

    testIndexPath=indexPath.row;//this will give you the indexPath for cell

Now add this two methods in your .m file:

   -(void)autoScroll{
    CGFloat point = self.collectionVw.contentOffset.x;
    CGFloat lo = point + 1;
    [UIView animateWithDuration:0 delay:0 options:UIViewAnimationOptionCurveEaseIn animations:^{
    self.collectionVw.contentOffset = CGPointMake(lo, 0);
}completion:^(BOOL finished){
    if (testIndexPath==8)
    {
        [self autoScrollReverse];
    }
    else{
      [self autoScroll];
    }
  }];
 }

  -(void)autoScrollReverse{
    CGFloat point = self.collectionVw.contentOffset.x;
    CGFloat lo = point - 1;
    [UIView animateWithDuration:0 delay:0 options:UIViewAnimationOptionCurveEaseIn animations:^{
    self.collectionVw.contentOffset = CGPointMake(lo, 0);
}completion:^(BOOL finished){
    if(testIndexPath == 0){
        [self autoScroll];
    }else{
       [self autoScrollReverse];

    }

  }];
 }

 //Call [self autoScroll] in your viewDidLoad

edited May 05 '16 at 12:51

answered Apr 12 '16 at 07:28

Akash KR

718
3
10

i have my imageview in the cell of collectionview....How could i achieve continuous scrolling animation horizontally through above code...couldnt get it..@Akash KR – Aashi Apr 12 '16 at 09:02
follow this: http://stackoverflow.com/questions/13006972/creating-slow-scrolling-to-indexpath-in-uicollectionview – Akash KR Apr 12 '16 at 10:01
That was the same method i used and mentioned above @Akash KR – Aashi Apr 12 '16 at 10:23
Well I have a logic..check for indexPath, if indexPath is equal to count then use this [self.collectionView scrollToItemAtIndexPath:indexPath atScrollPosition:UICollectionViewScrollPositionCenteredVertically animated:YES]; else reverse it. – Akash KR May 04 '16 at 09:00
Can u help me with A code please??Get u what u r telling bt dnt knw how to do it...Because i tried to repeat it bt it wont go from left to right after going to right to left... And also when it goes from right to left Though images over still it shows me blank scrolling and images vanished @Akash KR – Aashi May 04 '16 at 09:30
You might be doing something wrong somewhere..because I have implemented this logic in both swift and objective c and works fine – Akash KR May 05 '16 at 13:38
Thanx ... I Used Bit Differently But it too worked very well thanx Aussum Thanx For ur efforts @Akash KR – Aashi May 06 '16 at 11:22
I m glad that it worked..I did it only for you..@Aashi – Akash KR May 06 '16 at 12:56

score 0 · Answer 2 · answered May 05 '16 at 13:16

Better way to scroll index from top to bottom and bottom to top.

This will move to index 10 means scroll top to bottom

[self.collectionView scrollToItemAtIndexPath:[NSIndexPath indexPathForItem:9 inSection:0] atScrollPosition:UICollectionViewScrollPositionNone animated:YES];

For again scroll bottom to top which move to index 0

 [UIView animateWithDuration:3
                      delay:0.1
                    options:UIViewAnimationOptionCurveEaseInOut
                 animations:^{
                     [self.collectionView scrollToItemAtIndexPath:[NSIndexPath indexPathForItem:0 inSection:0] atScrollPosition:UICollectionViewScrollPositionNone animated:YES];
                 }
                 completion:nil];

You can also set scrolling from top to bottom in UIVIew animation like above. Set the first method in ViewWillAppear and set second method in ViewDidAppear if you need animation for every time page appear

score 0 · Answer 3 · answered May 05 '16 at 13:18

Please apply this one. May be its help to you

   - (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath
  {
    MyCollectionViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:@"MyCollectionViewCell" forIndexPath:indexPath];

    [UIView animateWithDuration:0.2 animations:^{
     cell.transform = CGAffineTransformMakeTranslation(0.0, -50);
    }];
    [self delayBy:0.5 code:^{ // call block of code after time interval
    [UIView animateWithDuration:0.3 animations:^{
        cell.transform = CGAffineTransformIdentity;
    }];
  }];
  return cell;
}

[self delayBy :]; this self method is missing can you add the delay by method .. Thanks — MANCHIKANTI KRISHNAKISHORE, Nov 25 '16 at 09:31

score 0 · Answer 4 · edited Feb 02 '17 at 14:36

0

This may help solve your problem:

int maxDelay = 4;
int delayInSeconds = arc4random() % maxDelay;
dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(delayInSeconds * NSEC_PER_SEC)), dispatch_get_main_queue(), ^{
    //your codes//
});

edited Feb 02 '17 at 14:36

Benjamin Lowry

3,392
1
20
25

answered Feb 02 '17 at 12:41

Shakti

908
9
21

Animation of scrolling in collectionview in ios

4 Answers4