iOS中粘性動畫以及果凍效果的實現
Intro
A custom UIPageControl with multiple animations. With two animation styles:
自定義的UIPageControl。擁有兩種動畫樣式:
-
GooeyCircle
-
粘性小球
Detail 細節
The longer distance the bubble moves , the severer gooey effect it has.
粘性小球會根據移動距離的大小擁有不同的彈性程度。移動距離越大，彈性效果越明顯。
- RotateRect
- 旋轉方塊
You can not only scroll the UIScrollView subclasses such as UICollectionView ,UITableView and the KYAnimatedPageControl can automatically move with animation ,but also you can just TAP the target page in the KYAnimatedPageControl,and the scrollview will also automatically and intelligently scroll to the target position.
KYAnimatedPageControl 不僅可以在你滑動UIScrollView的時候自動以動畫的形式移動，而且你還可以直接在KYAnimatedPageControl上的點擊要滾動到的目標頁，此時除了KYAnimatedPageControl會以動畫的形式移動，UIScrollView會很智能地滑到目標頁面。
Blog
Installation
pod 'KYAnimatedPageControl', '~> 1.0.2'
Usage
Initialize:
self.pageControl = [[KYAnimatedPageControl alloc]initWithFrame:CGRectMake(20, 450, 280, 50)];
self.pageControl.pageCount = 8;
self.pageControl.unSelectedColor = [UIColor colorWithWhite:0.9 alpha:1];
self.pageControl.selectedColor = [UIColor redColor];
self.pageControl.bindScrollView = self.demoCollectionView;
self.pageControl.shouldShowProgressLine = YES;
self.pageControl.indicatorStyle = IndicatorStyleGooeyCircle;
self.pageControl.indicatorSize = 20;
[self.pageControl display];
[self.view addSubview:self.pageControl];Add methods to UIScrollViewDelegate:
#pragma mark -- UIScrollViewDelegate
-(void)scrollViewDidScroll:(UIScrollView *)scrollView{
//Indicator動畫
[self.pageControl.indicator animateIndicatorWithScrollView:scrollView andIndicator:self.pageControl];
if (scrollView.dragging || scrollView.isDecelerating || scrollView.tracking) {
//背景線條動畫
[self.pageControl.pageControlLine animateSelectedLineWithScrollView:scrollView];
}
}
-(void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView{
self.pageControl.indicator.lastContentOffset = scrollView.contentOffset.x;
}
-(void)scrollViewWillBeginDecelerating:(UIScrollView *)scrollView{
[self.pageControl.indicator restoreAnimation:@(1.0/self.pageControl.pageCount)];
}