iOS类似淘宝头条的文字滚动广告

最近两个项目都用到类似淘宝头条的功能,就是文字上下无限循环滚动,所以决定简单封装一下,以便以后使用。由于习惯用SDCycleScrollView来做广告图的无限循环滚动,所以这里文字无限滚动的核心是源于此。

效果如下:

demo效果

考虑到这种滚动需求样式的多变性,这里的封装还是基于 UICollectionView,提供上下和左右滚动两种方式,而且基于UICollectionView的复用特性,性能也是不错的。如果样式不一样,直接替换FHCTopLineCollectionViewCell为你自定义的cell即可。

FHCTopLineViewDelegate提供了两个代理方法

/**
 点击滚动文字回调
 @param topLine FHCTopLineView
 @param index 选中文字的index
 */
- (void)topLineView:(FHCTopLineView *)topLine didSelectItemAtIndex:(NSInteger)index;


/**
 文字滚动的回调
 @param topLine FHCTopLineView
 @param index 滚动到的位置index
 */
- (void)topLineView:(FHCTopLineView *)topLine didScrollToIndex:(NSInteger)index;

平时用习惯了,所以控制滚动的属性也是参照SDCycleScrollView

///////////////////////////  滚动控制接口 ///////////////////////////////

/** 自动滚动间隔时间,默认2s */
@property (nonatomic, assign) CGFloat autoScrollTimeInterval;

/** 是否无限循环,默认Yes */
@property (nonatomic,assign) BOOL infiniteLoop;

/** 是否自动滚动,默认Yes */
@property (nonatomic,assign) BOOL autoScroll;

/** 是否允许用户拖动,默认Yes */
@property (nonatomic, assign) BOOL enableDrag;

/** 文字滚动方向,默认为垂直滚动 */
@property (nonatomic, assign) UICollectionViewScrollDirection scrollDirection;

/** 代理 */
@property (nonatomic, weak) id<FHCTopLineViewDelegate> delegate;

///////////////////////////// 数据源接口 ////////////////////////////////////

/** 数据源数组 */
@property (nonatomic, strong) NSArray *titlesGroup;

Demo地址:FHCTopLineView

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏企鹅号快讯

《小白HTML5成长之路32》把自定义弹窗做成控件的第一步

“小白,今天上午布局的那个弹窗想法不错!” 小白说道:“我只是用CSS布了一个局,还没有添加用户交互呢!” 老朱说:“不着急,像这种常用的功能你可以尝试把它做成...

265100
来自专栏阿炬.NET

常用插件备份

32180
来自专栏听雨堂

对asp.net响应事件的试验

1、可否把bind独立出来,在page_load中只是初次时bind,以后都在具体事件的处理中bind    实验:        page_load中,只作d...

22780
来自专栏编程微刊

七个帮助你处理Web页面层布局的jQuery插件

23620
来自专栏coding for love

CSS常用布局实现02-垂直居中

css2.1本身没有提供垂直居中的属性,都是通过一些巧妙的方法来实现,当然,都会有或多或少的缺点。所以,还是那句话,如果不考虑兼容到特定的浏览器,建议使用fle...

11210
来自专栏从零开始学 Web 前端

从零开始学Web之HTML(二)标签、超链接、特殊符号、列表、音乐、滚动、head等

文本倾斜:<em></em> <i></i> <!-- 工作里尽量使用em,原因同strong -->

49020
来自专栏黒之染开发日记

我在移动web开发中遇到的各种问题

目前(2015年8月3日15:02:24)在大部分安卓手机都发现这个问题,触发bug的条件知道了,但是原因未知。触发bug的条件是需要横向滚动的层不能位于纵向滚...

13620
来自专栏韩东吉的Unity杂货铺

零基础入门 23: UGUI ScrollView

今天要分享的内容,是近期内关于UGUI的最后一篇,UGUI里的滚动视图ScrollView,后期的内容会根据项目实用的功能组件进行分享。

61210
来自专栏一个会写诗的程序员的博客

Vue.js 极简教程jsfiddle Hello World 例子:参考资料:

https://jsfiddle.net/chrisvfritz/50wL7mdz/

22410
来自专栏Web行业观察

可视化讲解 DOM 的构建过程

最近在看 Secrets of the JavaScript Ninja, 书中第二章讲到 DOM 的构建流程.

10220

扫码关注云+社区

领取腾讯云代金券