# FSPagerView
[](http://cocoadocs.org/docsets/FSPagerView)
| [SWIFT](https://github.com/WenchaoD/FSPagerView/blob/master/README.md) | OBJECTIVE-C |
|---|---|
**FSPagerView** is an elegant Screen Slide Library implemented primarily with ***UICollectionView***. It is extremely helpful for making Banner、Product Show、Welcome/Guide Pages、Screen/ViewController Sliders.
## Features
* ***Infinite*** scrolling.
* ***Automatic*** Sliding.
* Fully customizable item, with predefined banner-style item.
* Fully customizable ***page control***.
* Rich build-in 3D transformers.
* ***Simple*** and ***Delightful*** api usage.
* Support **SWIFT** and **OBJECTIVE-C**.
## Demo1 Banner
| Banner |
|---|
| |
### automaticSlidingInterval
The time interval of automatic sliding. 0 means disabling automatic sliding. Default is 0.
**e.g.**
```objc
pagerView.automaticSlidingInterval = 3.0;
```
### isInfinite
A boolean value indicates whether the pager view has infinite number of items. Default is false.
**e.g.**
```objc
pagerView.isInfinite = YES;
```
### itemSize
The item size of the pager view. .zero means always fill the bounds of the pager view. Default is .zero.
**e.g.**
```objc
pagerView.itemSize = CGSizeMake(200, 180);
```
### interitemSpacing
The spacing to use between items in the pager view. Default is 0.
**e.g.**
```objc
pagerView.interitemSpacing = 10;
```
## Demo2 - Transformers
|Cross Fading|
|---|
|  |
```objc
pagerView.transformer = [[FSPagerViewTransformer alloc] initWithType:FSPagerViewTransformerTypeCrossFading];
```
---
|Zoom Out|
|---|
|  |
```objc
pagerView.transformer = [[FSPagerViewTransformer alloc] initWithType:FSPagerViewTransformerTypeZoomOut];
```
---
|Depth|
|---|
|  |
```objc
pagerView.transformer = [[FSPagerViewTransformer alloc] initWithType:FSPagerViewTransformerTypeDepth];
```
---
|Linear|
|---|
|  |
```objc
pagerView.transformer = [[FSPagerViewTransformer alloc] initWithType:FSPagerViewTransformerTypeLinear];
```
---
|Overlap|
|---|
|  |
```objc
pagerView.transformer = [[FSPagerViewTransformer alloc] initWithType:FSPagerViewTransformerTypeOverlap];
```
---
|Ferris Wheel|
|------|
|  |
```objc
pagerView.transformer = [[FSPagerViewTransformer alloc] initWithType:FSPagerViewTransformerTypeFerrisWheel];
```
---
|Inverted Ferris Wheel|
|------|
|  |
```objc
pagerView.transformer = [[FSPagerViewTransformer alloc] initWithType:FSPagerViewTransformerTypeInvertedFerrisWheel];
```
---
|Cover Flow|
|------|
|  |
```objc
pagerView.transformer = [[FSPagerViewTransformer alloc] initWithType:FSPagerViewTransformerTypeCoverFlow];
```
---
> Customize your own transformer by subclassing`FSPagerViewTransformer.`
## Demo3 Page Control
|Page Control|
|---|
|
|
### numberOfPages
The number of page indicators of the page control. Default is 0.
**e.g.**
```objc
pageControl.numberOfPages = 5;
```
### currentPage
The current page, highlighted by the page control. Default is 0.
**e.g.**
```objc
pageControl.currentPage = 1;
```
### contentHorizontalAlignment
The horizontal alignment of content within the control’s bounds. Default is center.
**e.g.**
```swift
pageControl.contentHorizontalAlignment = UIControlContentHorizontalAlignmentRight;
```
### setStrokeColor:forState:
Sets the stroke color for page indicators to use for the specified state. (selected/normal).
**e.g.**
```objc
[pageControl setStrokeColor:[UIColor greenColor] forState:UIControlStateNormal];
[pageControl setStrokeColor:[UIColor yellowColor] forState:UIControlStateSelected];
```
### setFillColor:forState:
Sets the fill color for page indicators to use for the specified state. (selected/normal).
**e.g.**
```objc
[pageControl setFillColor:[UIColor grayColor] forState:UIControlStateNormal];
[pageControl setFillColor:[UIColor whiteColor] forState:UIControlStateSelected];
```
### setImage:forState:
Sets the image for page indicators to use for the specified state. (selected/normal).
**e.g.**
```objc
[pageControl setImage:[UIImage imageNamed:@"image1"] forState:UIControlStateNormal];
[pageControl setImage:[UIImage imageNamed:@"image2"] forState:UIControlStateSelected];
```
### setPath:forState:
Sets the path for page indicators to use for the specified state. (selected/normal).
**e.g.**
```objc
[pageControl setPath:[UIBezierPath bezierPathWithRect:CGRectMake(0, 0, 8, 8)] forState:UIControlStateNormal];
[pageControl setPath: [UIBezierPath bezierPathWithOvalInRect:CGRectMake(0, 0, 8, 8)] forState:UIControlStateSelected];
```
## Installation
* Manually
* Cocoapods
### Manually
1. ***[Download](#)*** the source code.
2. Extract the zip file, simply drag folder ***FSPagerView*** into your project.
3. Make sure ***Copy items if needed*** is checked.
### Cocoapods
```ruby
use_frameworks!
pod FSPagerView
```
## Tutorial
* [Get started](#get_started)
* [Implement FSPagerViewDataSource](#implement_fspagerviewdatasource)
* [Implement FSPagerViewDelegate](#implement_fspagerviewdelegate)
### 1. Get started
* Get started with code
```objc
// Create a pager view
FSPagerView *pagerView = [[FSPagerView alloc] initWithFrame:frame1];
pagerView.dataSource = self;
pagerView.delegate = self;
[pagerView registerClass:[FSPagerViewCell class] forCellWithReuseIdentifier:@"cell"];
[self.view addSubview:pagerView];
// Create a page control
FSPagerControl *pageControl = [[FSPagerControl alloc] initWithFrame:frame2];
[self.view addSubview:pageControl];
```
* Get started with Interface Builder
1、Simply drag **UIView** instance into your View Controller, Change the `Custom Class` to `FSPagerView`. (Or `FSPageControl`)
2、Link the `dataSource` and `delegate` property of **FSPagerView** to your View Controller.
3、Register a cell class.
```objc
- (void)viewDidLoad {
[self.pagerView registerClass:[FSPagerViewCell class] forCellWithReuseIdentifier:@"cell"];
}
```
### 2. Implement FSPagerViewDataSource
```objc
- (NSInteger)numberOfItemsInpagerView:(FSPagerView *)pagerView
{
return numberOfItems;
}
- (FSPagerViewCell *)pagerView:(FSPagerView *)pagerView cellForItemAtIndex:(NSInteger)index
{
FSPagerViewCell *cell = [pagerView dequeueReusableCellWithReuseIdentifier:@"cell" atIndex:index];
cell.imageView.image = ...;
cell.textLabel.text = ...;
return cell;
}
```
### 3. Implement FSPagerViewDelegate
```objc
- (BOOL)pagerView:(FSPagerView *)pagerView shouldHighlightItemAtIndex:(NSInteger)index;
```
> Asks the delegate if the item should be highlighted during tracking.
---
```objc
- (void)pagerView:(FSPagerView *)pagerView didHighlightItemAtIndex:(NSInteger)index;
```
> Tells the delegate that the item at the specified index was highlighted.
---
```objc
- (BOOL)pagerView:(FSPagerView *)pagerView shouldSelectItemAtIndex:(NSInteger)index;
```
> Asks the delegate if the specified item should be selected.
---
```objc
- (void)pagerView:(FSPagerView *)pagerView didSelectItemAtIndex:(NSInteger)index;
```
> Tells the delegate that the item at the specified index was selected.
---
```objc
- (void)pagerView:(FSPagerView *)pagerView willDisplayCell:(FSPagerViewCell *)cell forItemAtIndex:(NSInteger)index;
```
> Tells the delegate that the specified cell is about to be displayed in the pager view.
---
```objc
- (void)pagerView:(FSPagerView *)pagerView didEndDisplayingCell:(FSPagerViewCell *)cell forItemAtIndex:(NSInteger)index;
```
> Tells the delegate that the specified cell was removed from the pager view.
---
```objc
- (void)pagerViewWillBeginDragging:(FSPagerView *)pagerView;
```
> Tells the delegate when the pager view is about to start scrolling the content.
---
```objc
- (void)pagerViewWillEndDragging:(FSPagerView *) pagerView targetIndex:(NSInteger)index:
```
> Tells the delegate when the user finishes scrolling the content.
---
```objc
- (void)pagerViewDidScroll:(FSPagerView *)pagerView;
```
> Tells the delegate when the user scrolls the content view within the receiver.
---
```objc
- (void)pagerViewDidEndScrollAnimation:(FSPagerView *)pagerView;
```
> Tells the delegate when a scrolling animation in the pager view concludes.
---
```objc
- (void)pagerViewDidEndDecelerating:(FSPagerView *)pagerView;
```
> Tells the delegate that the pager view has ended decelerating the scrolling movement.
---
## Support this repo
* ***Star*** this repo
* Buy me a ***Coffee***. ☕️
|
|
---
## Author
* ***微博:[@WenchaoD](http://weibo.com/WenchaoD)***
* ***Twitter: [@WenchaoD](https://twitter.com/WenchaoD)***
* Other repos:
*
***[FSCalendar](https://github.com/WenchaoD/FSCalendar)***