スクロールが柔らかいbanner
3535 ワード
2017-08-15 11_16_24.gif
開発時に一般的なバンナーよりもソフトな効果に遭遇し、YouXianMingのAnimationsを参考にした後、彼のdemoには良い効果があることを発見し、この効果を最も多くのバンナーコントロールSDCycleScrollViewに移し、私のdemodevliuhuan/SDycleScrollView
私が言及した2つのサードパーティ製ライブラリまたはdemoは、UIcollectionViewを使用して実現されています.この比較的柔らかいスクロールを実現するには、2つのポイントが含まれています.見えるセルをUICOLLectionViewのcontentOffsetに従って変化させる1.1 collectionViewのcontentOffset変化通知Cell
1.2 CellはcontentOffsetの変化を受けた後、横方向または縦方向にスクロールするかによってCellの操作を行う
2、自動スクロールを開く時、SDCycleScrollVievはUIcollectionViewの独自のスクロール方法で実現された.このアニメーションは比較的に短くて、そんなに柔らかくないように見える.ここでPOPのカスタムアニメーションを使って、スクロールの過程を定義スクロールから
開発時に一般的なバンナーよりもソフトな効果に遭遇し、YouXianMingのAnimationsを参考にした後、彼のdemoには良い効果があることを発見し、この効果を最も多くのバンナーコントロールSDCycleScrollViewに移し、私のdemodevliuhuan/SDycleScrollView
私が言及した2つのサードパーティ製ライブラリまたはdemoは、UIcollectionViewを使用して実現されています.この比較的柔らかいスクロールを実現するには、2つのポイントが含まれています.
- (void)scrollViewDidScroll:(UIScrollView *)scrollView
{
if (!self.imagePathsGroup.count) return; // timer
if (self.scrollAnimationStyle == SDCycleScrollAnimationStyleLight) {
__weak typeof(self) weakSelf = self;
[self.mainView.visibleCells enumerateObjectsUsingBlock:^(__kindof SDCollectionViewCell *obj, NSUInteger idx, BOOL * _Nonnull stop) {
//
CGPoint point = [obj convertPoint:obj.bounds.origin fromView:weakSelf];
if ([obj respondsToSelector:@selector(contentOffset:)]) {
[obj contentOffset:point];
}
}];
}
}
1.2 CellはcontentOffsetの変化を受けた後、横方向または縦方向にスクロールするかによってCellの操作を行う
- (void)contentOffset:(CGPoint)offset {
if (self.scrollDirection == UICollectionViewScrollDirectionVertical) {
self.imageView.frame = CGRectMake(self.imageView.frame.origin.x, offset.y * 0.85f, self.imageView.frame.size.width, self.imageView.frame.size.height);
}else{
[self resetImageViewCenterPoint];
}
}
- (void)resetImageViewCenterPoint {
CGPoint point = [self convertPoint:CGPointZero toView:self.window];
CGPoint newCenter = self.center;
newCenter.x = -0.9 * point.x + 187.5; // ?
self.imageView.center = newCenter;
}
2、自動スクロールを開く時、SDCycleScrollVievはUIcollectionViewの独自のスクロール方法で実現された.このアニメーションは比較的に短くて、そんなに柔らかくないように見える.ここでPOPのカスタムアニメーションを使って、スクロールの過程を定義スクロールから
__weak typeof(self) weakSelf = self;
POPAnimatableProperty *prop = [POPAnimatableProperty propertyWithName:@"prop" initializer:^(POPMutableAnimatableProperty *prop) {
// read value
prop.readBlock = ^(id obj, CGFloat values[]) {
};
// write value
prop.writeBlock = ^(id obj, const CGFloat values[]) {
//NSLog(@"old:%f current:%f,to:%f",offsetX,values[0],offsetX);
weakSelf.mainView.contentOffset = self.flowLayout.scrollDirection == UICollectionViewScrollDirectionHorizontal ? CGPointMake(values[0], 0) : CGPointMake(0,values[0]);
};
// dynamics threshold
prop.threshold = 0.01;
}];
CGFloat oldOffsetValue = self.flowLayout.scrollDirection == UICollectionViewScrollDirectionHorizontal ? self.mainView.contentOffset.x : self.mainView.contentOffset.y;
CGFloat newOffsetValue = self.flowLayout.scrollDirection == UICollectionViewScrollDirectionHorizontal ? self.flowLayout.itemSize.width*targetIndex : self.flowLayout.itemSize.height*targetIndex;
POPBasicAnimation *anBasic = [POPBasicAnimation easeInEaseOutAnimation]; //
anBasic.property = prop; //
anBasic.fromValue = @(oldOffsetValue); // 0
anBasic.toValue = @(newOffsetValue);
anBasic.duration = 1.5; // 1.5
anBasic.beginTime = CACurrentMediaTime() + 0.0f; // 1
[self.mainView pop_addAnimation:anBasic forKey:@"autoScroll"];