仿UITableView制作廣告輪播器

最近在做一個項目需要用到一個滾動評論,當然前面的項目中也有許多地方用到了這一控件,雖然網絡上關于這種控件的封裝思想大致也就那么幾種,具體哪幾種大家可以去搜索一下,但是對于這種控件的使用,每次使用總是需要重新更改里面的代碼,雖說不是一個大的控件,但是,更改起來卻也是很煩人,所以自己就依據系統的UITableView的使用方法封裝了該控件.廢話不多說,程序員看的是實現效果以及代碼思想,希望能幫助到需要的朋友.

效果圖如下###

2.gif

使用方法如下###

  • 首先引入頭文件
    <pre><code>#import "GGCMTView.h"</code></pre>

  • 創建對象
    1.創建對象的時候類型有兩種一種是:CMTViewHorizontalStyle
    另一種是:CMTViewVerticalStyle
    其中CMTViewHorizontalStyle創建的是水平滾動類型的,就是平常縮減的廣告輪播圖
    而CMTViewVerticalStyle 創建的則是垂直滾動類型,常見的滾動評論
    //創建方法如下
    GGCMTView * cmtView = [[GGCMTView alloc]initWithFrame:CGRectMake(0, 100, self.view.width, 200) andCMTViewStyle:CMTViewHorizontalStyle];
    //GGCMTView * cmtView = [[GGCMTView alloc]initWithFrame:CGRectMake(0, 100, self.view.width, 200) andCMTViewStyle: CMTViewVerticalStyle];

  • 設置對象的屬性,數據源,代理,其中屬性包括設置滾動間隔,是否允許用戶拖動
    //用來設置每一次滾動的間隔時間,默認為0.5秒
    cmtView.timeInterval = 4.0f;
    //用來設置是否允許用戶拖動,默認為NO
    cmtView.enableUserScroll = YES;
    //將該view加到控制器中
    [self.view addSubview:cmtView];
    //為cmtView設置數據源
    cmtView.dataSource = self;
    //為cmtView設置代理
    cmtView.delegate = self;

  • GGCMTView的數據源cmtViewDataSource是一個協議包含兩個接口方法,都是必須實現的,一個是用來返回滾動的內容總共有多少條,另一個是用來返回滾動的自定義視圖,利用系統的UITableViewCell來接收,該創建方法與系統UITableViewCell的創建方法保持一致.

具體代碼如下:

@protocol cmtViewDataSource <NSObject>
@required
//返回有多少條
- (NSInteger)numberOfPageInCmtView:(GGCMTView *)cmtView;
//返回每一個滾動的自定義視圖,直接返回自定義的UITableViewCell
- (__kindof UITableViewCell *)cmtView:(GGCMTView *)cmtView cellForIndex:(NSInteger)index;
@end
  • GGCMTView的代理方法cmtViewDelegate只定義了一個可選實現的接口,該接口用來告訴代理點擊了某一個Cell,返回點擊cell的index

具體代碼如下:

@protocol cmtViewDelegate <NSObject>
@optional
//用來告訴點擊了某個index的cell
- (void)cmtView:(GGCMTView *)cmtView didSelectIndex:(NSInteger)index;
@end
  • GGCMTView暴露出來的對象方法有八個,有五個是關于生命周期的方法,具體每個方法的作用見下面的代碼注釋

用來創建cmtView CMTViewStyle在創建的時候給定,在此類的屬性中包含字段cmtViewStyle 但其僅是可讀的,僅用來讀取其類型
- (instancetype)initWithFrame:(CGRect)frame andCMTViewStyle:(CMTViewStyle)cmtViewStyle;
此方法用來從緩沖池中取得cell,如果沒有,則需要手動創建cell,用法與系統的UITableView保持一致
- (__kindof UITableViewCell *)dequeueReusableCMTViewCellWithIdentifier:(NSString *)identifier;
如果UITableViewCell 有使用xib,則可以使用此方法來進行注冊nib,用法與UITableView 保持一致
- (void)registerNib:(UINib *)nib forCMTViewCellReuseIdentifier:(NSString *)identifier;

此方法用來準備開始動畫
- (void)prepareScroll;
此方法用來開始動畫
- (void)startScroll;
此方法用來停止動畫
- (void)stopScroll;
此方法用來暫停動畫
- (void)pauseScroll;
此方法用來繼續動畫
- (void)continueScroll;

由于該類使用的定時器是NSTimer ,所以要求使用者,在controller中視圖將要消失的時候調用暫停或者停止方法,而在視圖將要出現的時候根據需要,用來開始,或者繼續動畫,首次開始滾動之前需要調用prepareScroll方法,初始化一下數據,若是想使數據重新從第0頁開始,也可以手動調用此方法

具體的使用Demo見下方源碼


#import "ViewController.h"
#import "GGCMTView.h"
#import "CustomTableViewCell.h"
#import "UIView+Frame.h"

static NSString * reuseIdentifier = @"cell";
@interface ViewController ()<cmtViewDelegate,cmtViewDataSource>

@property(nonatomic,strong)NSArray * dataArr1;
@property(nonatomic,strong)NSArray * dataArr2;
@property(nonatomic,strong)GGCMTView * cmtView1;
@property(nonatomic,strong)GGCMTView * cmtView2;

@end

@implementation ViewController

- (void)viewWillDisappear:(BOOL)animated
{
    [super viewWillDisappear:animated];
    [self.cmtView1 pauseScroll];
    [self.cmtView2 pauseScroll];
    
}

- (NSArray *)dataArr1{
    if (!_dataArr1) {
        _dataArr1 = @[@"1.jpg",@"2.jpg",@"3.jpg",@"4.jpg",@"5.jpg",@"6.jpg",@"7.jpg"];
    }
    return _dataArr1;
}
- (NSArray *)dataArr2{
    if (!_dataArr2) {
        _dataArr2 = @[@"7.jpg",@"6.jpg",@"5.jpg",@"4.jpg",@"3.jpg",@"2.jpg",@"1.jpg"];
    }
    return _dataArr2;
}

- (void)viewDidLoad {
    [super viewDidLoad];
    self.view.backgroundColor = [UIColor grayColor];
    [self testCMTView];
    [self testCMTView2];
    
}


- (void)testCMTView{
    GGCMTView * cmtView = [[GGCMTView alloc]initWithFrame:CGRectMake(0, 100, self.view.width, 200) andCMTViewStyle:CMTViewHorizontalStyle];
    cmtView.timeInterval = 4.0f;
    cmtView.enableUserScroll = YES;
    [self.view addSubview:cmtView];
    cmtView.dataSource = self;
    cmtView.delegate = self;
    self.cmtView1 = cmtView;
    
    [cmtView prepareScroll];
    [cmtView startScroll];
}

- (void)testCMTView2{
    GGCMTView * cmtView = [[GGCMTView alloc]initWithFrame:CGRectMake(0, 330, self.view.width, 200) andCMTViewStyle:CMTViewVerticalStyle];
    cmtView.timeInterval = 4.0f;
    cmtView.enableUserScroll = YES;
    [self.view addSubview:cmtView];
    cmtView.dataSource = self;
    cmtView.delegate = self;
    self.cmtView2 = cmtView;
    [cmtView prepareScroll];
    [cmtView startScroll];
}

- (UITableViewCell *)cmtView:(GGCMTView *)cmtView cellForIndex:(NSInteger)index{
    
    CustomTableViewCell * cell = [CustomTableViewCell customTableViewCellWithTableView:cmtView];
    if (cmtView == self.cmtView1) {
        cell.image.image = [UIImage imageNamed:self.dataArr1[index]];
        cell.cust.text = self.dataArr1[index];
    }else{
        cell.image.image = [UIImage imageNamed:self.dataArr2[index]];
        cell.cust.text = self.dataArr2[index];
    }
    return cell;
}

- (void)cmtView:(GGCMTView *)cmtView didSelectIndex:(NSInteger)index{
    if (cmtView == self.cmtView1) {
        NSLog(@"第%ld張   =====   名字是 %@",(long)index,self.dataArr1[index]);
    }else{
        NSLog(@"第%ld張   =====   名字是 %@",(long)index,self.dataArr2[index]);
    }
    
}

- (NSInteger)numberOfPageInCmtView:(GGCMTView *)cmtView{
    
    if (cmtView == self.cmtView1) {
        return self.dataArr1.count;
    }
    return self.dataArr2.count;
}


@end


總結:作為一個程序員,如果想提升自己,我個人覺得思想最為重要,一個好的解決方案,快速的建模反應,快速的接收速度以及學習能力,是一個好的程序員的必備素質,在我們自己嘗試著學習思想之前,那就先模仿系統的吧,學習成本低而且思想也比較成熟了,對吧,希望大家一起努力,另外在源碼中,對tableViewCell的復用我這兒處理的不是很好,希望有高人可以指點一二,大家共同進步,謝謝!

Github 源碼請點擊這里

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市,隨后出現的幾起案子,更是在濱河造成了極大的恐慌,老刑警劉巖,帶你破解...
    沈念sama閱讀 227,818評論 6 531
  • 序言:濱河連續發生了三起死亡事件,死亡現場離奇詭異,居然都是意外死亡,警方通過查閱死者的電腦和手機,發現死者居然都...
    沈念sama閱讀 98,185評論 3 414
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人,你說我怎么就攤上這事。” “怎么了?”我有些...
    開封第一講書人閱讀 175,656評論 0 373
  • 文/不壞的土叔 我叫張陵,是天一觀的道長。 經常有香客問我,道長,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 62,647評論 1 309
  • 正文 為了忘掉前任,我火速辦了婚禮,結果婚禮上,老公的妹妹穿的比我還像新娘。我一直安慰自己,他們只是感情好,可當我...
    茶點故事閱讀 71,446評論 6 405
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著,像睡著了一般。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發上,一...
    開封第一講書人閱讀 54,951評論 1 321
  • 那天,我揣著相機與錄音,去河邊找鬼。 笑死,一個胖子當著我的面吹牛,可吹牛的內容都是我干的。 我是一名探鬼主播,決...
    沈念sama閱讀 43,041評論 3 440
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了?” 一聲冷哼從身側響起,我...
    開封第一講書人閱讀 42,189評論 0 287
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后,有當地人在樹林里發現了一具尸體,經...
    沈念sama閱讀 48,718評論 1 333
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 40,602評論 3 354
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發現自己被綠了。 大學時的朋友給我發了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 42,800評論 1 369
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖,靈堂內的尸體忽然破棺而出,到底是詐尸還是另有隱情,我是刑警寧澤,帶...
    沈念sama閱讀 38,316評論 5 358
  • 正文 年R本政府宣布,位于F島的核電站,受9級特大地震影響,放射性物質發生泄漏。R本人自食惡果不足惜,卻給世界環境...
    茶點故事閱讀 44,045評論 3 347
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧,春花似錦、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 34,419評論 0 26
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至,卻和暖如春,著一層夾襖步出監牢的瞬間,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 35,671評論 1 281
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人。 一個月前我還...
    沈念sama閱讀 51,420評論 3 390
  • 正文 我出身青樓,卻偏偏與公主長得像,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當晚...
    茶點故事閱讀 47,755評論 2 371

推薦閱讀更多精彩內容