advertScroll.gif
調(diào)用示例代碼如下：
_labelView = [[LFAdvertScrollView alloc] initWithFrame:CGRectMake(0, 100, ScreenWidth, 40)];
_labelView.totalCount = 4;
_labelView.dataSource = self;
_labelView.delegate = self;
[self.view addSubview:_labelView];
_attbriuteView = [[LFAdvertScrollView alloc] initWithFrame:CGRectMake(0, 160, ScreenWidth, 60)];
_attbriuteView.totalCount = 4;
_attbriuteView.dataSource = self;
_attbriuteView.delegate = self;
[self.view addSubview:_attbriuteView];
_imageView = [[LFAdvertScrollView alloc] initWithFrame:CGRectMake(0, 240, ScreenWidth, 200)];
_imageView.totalCount = 4;
_imageView.dataSource = self;
_imageView.delegate = self;
[self.view addSubview:_imageView];
遵循代理要實(shí)現(xiàn)的方法：
- (Class)customViewClassForAdvertScrollView:(LFAdvertScrollView *)view {
if (view == _labelView) {
return [UILabel class];
} else if (view == _imageView) {
return [UIImageView class];
} else {
return [CustomAdvertView class];
}
}
- (void)configCustomView:(UIView *)view forIndex:(NSInteger)index advertView:(nonnull LFAdvertScrollView *)advertView {
if (advertView == _labelView) {
UILabel *testLabel = (UILabel *)view;
testLabel.text = @[@"I'm Li Bai",@"I'm Du Fu",@"I'm Bai Ju Yi",@"I'm Wang An Shi"][index];
testLabel.textAlignment = NSTextAlignmentCenter;
testLabel.textColor = [UIColor purpleColor];
testLabel.font = [UIFont boldSystemFontOfSize:16];
testLabel.backgroundColor = [UIColor cyanColor];
} else if (advertView == _imageView) {
UIImageView *imageView = (UIImageView *)view;
imageView.image = [UIImage imageNamed:@[@"h1.jpg",
@"h2.jpg",
@"h3.jpg",
@"h4.jpg"][index]];
} else {
CustomAdvertView *customView = (CustomAdvertView *)view;
customView.leftImage.image = [UIImage imageNamed:@[@"h1.jpg",
@"h2.jpg",
@"h3.jpg",
@"h4.jpg"][index]];
customView.rightLabel.text = @[@"I'm Li Bai,I'm Li Bai,I'm Li Bai,I'm Li Bai,I'm Li Bai",@"I'm Du Fu",@"I'm Bai Ju Yi",@"I'm Wang An Shi"][index];
}
}
重點(diǎn)來了，看了很多都是基于UICollectionView實(shí)現(xiàn)的，自動(dòng)滾動(dòng)模式下，會(huì)返回很多個(gè)Item，我這里嘗試用UIScrollview復(fù)用三個(gè)view來實(shí)現(xiàn)自動(dòng)滾動(dòng)，核心思路是用戶看到的永遠(yuǎn)是中間的那個(gè)view，通過控制偏移量來實(shí)現(xiàn)自動(dòng)滾動(dòng)效果。
LFAdvertScrollView.h文件內(nèi)容：
@class LFAdvertScrollView;
@protocol LFAdvertScrollViewDataSource <NSObject>
/**
返回要滾動(dòng)的視圖類型
@param view LFAdvertScrollView
@return 返回要滾動(dòng)的視圖類型,!!!:必須是繼承于UIView實(shí)現(xiàn)的類
*/
- (Class)customViewClassForAdvertScrollView:(LFAdvertScrollView *)view;
@end
@protocol LFAdvertScrollViewDelegate <NSObject>
/**
給自定義視圖賦值
@param view 賦值的視圖
@param index 第幾個(gè)視圖
@param advertView LFAdvertScrollView
*/
- (void)configCustomView:(UIView *)view forIndex:(NSInteger)index advertView:(LFAdvertScrollView *)advertView;
/**
點(diǎn)擊回調(diào)
@param advertView LFAdvertScrollView
@param index 第幾個(gè)視圖
*/
- (void)advertView:(LFAdvertScrollView *)advertView didSelectViewIndex:(NSInteger )index;
@end
@interface LFAdvertScrollView : UIView
/**
數(shù)據(jù)源個(gè)數(shù)，必傳項(xiàng)
*/
@property (nonatomic, assign) NSInteger totalCount;
/**
滾動(dòng)時(shí)間間隔
*/
@property (nonatomic, assign) NSTimeInterval autoScrollInterval;
@property (nonatomic, weak) id<LFAdvertScrollViewDelegate>delegate;
@property (nonatomic, weak) id<LFAdvertScrollViewDataSource>dataSource;
@end
實(shí)現(xiàn)方式很簡單，就是復(fù)用三個(gè)view實(shí)現(xiàn)無限輪播，點(diǎn)擊事件只添加到中間的view上面，然后點(diǎn)擊回調(diào)出當(dāng)前頁碼
這是主要實(shí)現(xiàn)部分：
///設(shè)置事件代理
- (void)setDelegate:(id<LFAdvertScrollViewDelegate>)delegate {
_delegate = delegate;
if ([_delegate respondsToSelector:@selector(configCustomView:forIndex:advertView:)]) {
[self.delegate configCustomView:self.topView forIndex:self.totalCount - 1 advertView:self];
[self.delegate configCustomView:self.middleView forIndex:0 advertView:self];
[self.delegate configCustomView:self.bottomView forIndex:1 advertView:self];
}
}
///設(shè)置視圖類型代理
- (void)setDataSource:(id<LFAdvertScrollViewDataSource>)dataSource {
_dataSource = dataSource;
if (self.dataSource && [self.dataSource respondsToSelector:@selector(customViewClassForAdvertScrollView:)]) {
///拿到用戶自定義的視圖類名
Class CustomClass = [self.dataSource customViewClassForAdvertScrollView:self];
self.topView = [[CustomClass alloc] initWithFrame:CGRectMake(0, 0, self.frame.size.width, self.frame.size.height)];
self.middleView = [[CustomClass alloc] initWithFrame:CGRectMake(0, self.frame.size.height * 1, self.frame.size.width, self.frame.size.height)];
///用戶看到的只有中間視圖，所以為了簡單起見，只需要添加中間視圖的點(diǎn)擊響應(yīng)
UITapGestureRecognizer *tap = [[UITapGestureRecognizer alloc]initWithTarget:self action:@selector(customViewTap)];
[self.middleView addGestureRecognizer:tap];
self.bottomView = [[CustomClass alloc] initWithFrame:CGRectMake(0, self.frame.size.height * 2, self.frame.size.width, self.frame.size.height)];
[self.contentView addSubview:self.topView];
[self.contentView addSubview:self.middleView];
[self.contentView addSubview:self.bottomView];
}
}
#pragma mark - timer執(zhí)行的方法
- (void)automaticScroll
{
self.currentPage++;
if (self.currentPage == self.totalCount) {
self.currentPage = 0;
}
[UIView animateWithDuration:1 animations:^{
///動(dòng)畫發(fā)生的滑動(dòng)
self.middleView.userInteractionEnabled =NO;
self.contentView.contentOffset =CGPointMake(0, CGRectGetHeight(self.contentView.frame) * 2);
} completion:^(BOOL finished) {
///滑動(dòng)完成后，把當(dāng)前現(xiàn)實(shí)的imageview重現(xiàn)移動(dòng)回中間位置，此處不能使用動(dòng)畫，用戶感覺不到
///移動(dòng)前,先把中間imageview的image設(shè)置成當(dāng)前現(xiàn)實(shí)的iamge
self.middleView.userInteractionEnabled = YES;
if (self.delegate && [self.delegate respondsToSelector:@selector(configCustomView:forIndex:advertView:)]) {
[self.delegate configCustomView:self.topView forIndex:self.currentPage == 0 ?self.totalCount - 1 : self.currentPage - 1 advertView:self];
[self.delegate configCustomView:self.middleView forIndex:self.currentPage advertView:self];
[self.delegate configCustomView:self.bottomView forIndex:self.currentPage == self.totalCount - 1 ? 0 : self.currentPage + 1 advertView:self];
}
self.contentView.contentOffset =CGPointMake(0, CGRectGetHeight(self.contentView.frame) * 1);
}];
}
#pragma mark - 用戶點(diǎn)擊
-(void)customViewTap{
if (self.delegate && [self.delegate respondsToSelector:@selector(advertView:didSelectViewIndex:)]) {
[self.delegate advertView:self didSelectViewIndex:self.currentPage];
}
}
代碼基本就這些了， 寫這篇純屬算是個(gè)人筆記，不喜勿噴，有更好的想法或者意見的歡迎大家指出。
