Asyncdisplaykit: ASPagerNode animation duration and custom curve

[stephenkopylov]

Hello guys!
Firstly, I want to say thanks to all, who develop this useful framework!
My question is:
How can I customise scrolling animation's duration in ASPagerNode's "scrollToPageAtIndex: animated:" method?
I tried this:

 [UIView animateWithDuration:0.2 animations:^{
        [_pagerNode scrollToPageAtIndex:button.pageNumber animated:NO];
 }];

It works, but no correctly - animation's duration changes, but current cell disappears before animation ends.

And yep - if it possible, how can I change animation curve to, for example, EaseIn?

Thank and sorry for my English.

[appleguy]

Hmm, good question. I think your best bet for now may be to do the page x-offset calculation manually, and do _pagerNode.view setContentOffset: inside of an animation block.

I don’t think you can use setContentOffset:animated:. It has to be a regular set operation, inside an animation block. If setContentOffset doesn’t work, try doing setBounds: instead. Something like:

CGRect bounds = self.bounds;
bounds.origin = exactSameCGPointAsContentOffsetForDestinationPage;
// Set self.bounds = bounds inside an animation block.

    — Scott

On May 28, 2016, at 7:07 PM, Stephen [email protected] wrote:

Hello guys!
Firstly, I want to say thanks to all, who develop this useful framework!
My question is:
How can I customise scrolling animation's duration in ASPagerNode's "scrollToPageAtIndex: animated:" method?
I tried this:

[UIView animateWithDuration:0.2 animations:^{
[_pagerNode scrollToPageAtIndex:button.pageNumber animated:NO];
}];
It works, but no correctly - animation's duration changes, but current cell disappears before animation ends.

Thank and sorry for my English.

—
You are receiving this because you are subscribed to this thread.
Reply to this email directly, view it on GitHub https://github.com/facebook/AsyncDisplayKit/issues/1699, or mute the thread https://github.com/notifications/unsubscribe/AAigAwBFLRI9N6HiVsVCGvSURYbp5BRZks5qGDAMgaJpZM4IpD95.

[maicki]

You cannot change the animation curve via ASPagerNode's scrollToPageAtIndex:animated: as we use internally UICollectionView's scrollToItemAtIndexPath:atScrollPosition:animated:. I think the only way to achieve that is the way @appleguy is proposing.

[maicki]

I looked into that a bit. The disappearing cells is a general problem of UICollectionView if you use setContentOffset without animation and within an animation block.

One way to have an animation duration with a custom curve is to drive the animation manually via CADisplayLink. Either you roll it by your own or you use a library like AnimationEngine. The code would look something like:

CGPoint startOffset = self.node.view.contentOffset;
CGPoint endOffset = CGPointMake((self.node.currentPageIndex+1) * CGRectGetWidth(self.node.view.bounds),
                               self.node.view.contentOffset.y);

[INTUAnimationEngine animateWithDuration:1.0 delay:0.0 easing:INTULinear animations:^(CGFloat percentage) {
    self.node.view.contentOffset = INTUInterpolateCGPoint(startOffset, endOffset, percentage);
} completion:^(BOOL finished) {

}];

cc @hannahmbanana In case this question comes up again

[appleguy]

@maicki good suggestion. @stephenkopylov I would say that Pop is much better for this! :-D https://github.com/facebook/pop

[stephenkopylov]

@appleguy @maicki
Thank you, guys! Will try it!