美文网首页UIScrollView常用组件网站制作
循环展示广告的控件:SLAdsSliderView

循环展示广告的控件:SLAdsSliderView

作者: 一声雷 | 来源:发表于2016-02-23 18:34 被阅读466次

一、效果展示(无限循环)

效果展示.gif

二、原码下载地址

SLAdsSliderView控件的原码上传在我的github上。
下载地址:https://github.com/SLconst/SLAdsSliderView

三、如何使用

1.快速创建

- (void)viewDidLoad {
// 创建广告滚动的控件
    SLAdsSliderView *adsSliderView = [[SLAdsSliderView alloc] init];
    adsSliderView.frame = CGRectMake(0, 0, 375 , 200);
    adsSliderView.images = @[
                             [UIImage imageNamed:@"image0"],
                             [UIImage imageNamed:@"image1"],
                             [UIImage imageNamed:@"image2"],
                             [UIImage imageNamed:@"image3"],
                             [UIImage imageNamed:@"image4"]
                             ];
    [self.view addSubview:adsSliderView];
}
    // 设置代理(可以用代理方法监听图片的点击)
    adsSliderView.delegate = self;
    

2.设置图片的滚动方向

    // 设置图片的滚动方向(默认是水平方向滚动)
    adsSliderView.direction = SLAdsSliderViewDirectionVertical;

3.监听是点击了哪张图片(代理协议:SLAdsSliderViewDelegate

    // 设置代理(可以用代理方法监听图片的点击)
    adsSliderView.delegate = self;
    
  // 实现代理方法
   -(void)adsSliderView:(SLAdsSliderView *)adsSliderView   didSelectItemAtIndex:(NSInteger)index
   {
        NSLog(@"%ld",(long)index);
   }

4.关于pageControl

1.如果是想设置pageControl的某些样式,我提供了pageControl属性的接口
       adsSliderView.pageControl.××× 
2.如果是想改变pageControl的frame,就继承自我这个控件,在layoutSubviews中修改
        - (void)layoutSubviews
       {
           [super layoutSubviews];
           self.pageControl.frame = CGRectMake(0, 0, 100, 25);
        }

四、如何实现无限滚动的思路

层级图

监听scrollview的滚动,每当滚动结束后,同时完成以下两步:

1.重置scrollView.contentOffset.x 等于 scrollview控件的宽度。
2.更改三个imageview上显示的图片。

比如我设置了image0、image1、image2、image3、image4、image5、image6一共7张图片。contentOffset如上图。
左边显示:image1
中间显示:image2
右边显示:image3
那么此时我们屏幕上显示的是image2,当我们向右慢慢滚动时 -->, 右边显示的image3会慢慢出现在我们眼前。

向右滑动
当右边显示的image3即将完全显示在眼前的时候,
立刻将scrollView.contentOffset.x置为scrollview的宽度,
并立马改变三个图片显示的内容。
左边显示:image2
中间显示:image3
右边显示:image4
那么这个时候显示在我们眼前的就是image3的图片。
如此往复执行下去,就实现了无限滚动的效果。

相关文章

网友评论

本文标题:循环展示广告的控件:SLAdsSliderView

本文链接:https://www.haomeiwen.com/subject/panbkttx.html