iOS 開發(fā)中UITableView的空數(shù)據(jù)頁面、網(wǎng)絡(luò)加載失敗頁面的封裝使用

在寫這篇文章共勉前，先感謝一下DZNEmptyDataSet的作者提供這個庫，本篇文章是基于DZNEmptyDataSet上進行封裝的，如若不允許，請聯(lián)系本菜鳥，將第一時間刪除。謝謝。

本菜鳥之所以封裝這個頁面，是因為在開發(fā)過程總，很多頁面用戶無操作的情況下，頁面是空的、又如果僅用DZNEmptyDataSet這個，每個頁面都要寫很多。所以就做簡單的封裝，滿足項目的需求。封裝的也許不好，不喜勿噴，多多指教。共勉...

我的項目遇到的情景有以下情況（也是比較常用到的商城類型頁面吧...）
1、無訂單頁面 2、購物車為空 3、無收藏頁面
4、無關(guān)注頁面 5、無流水頁面 6、網(wǎng)絡(luò)加載失敗
還有很多無數(shù)據(jù)顯示的頁面... 那么這些頁面不作處理的情況下...頁面空空的別說用戶體驗差...自己的開發(fā)的過程都很討厭...

下面進入這篇文章的正題 . . .

-------------------封裝需求--------------------
1、默認空數(shù)據(jù)頁面為：顯示默認圖片+默認文字（暫無數(shù)據(jù)）
2、網(wǎng)絡(luò)加載失敗的頁面：顯示加載失敗的圖片+文字（網(wǎng)絡(luò)出現(xiàn)問題）
3、在1的基礎(chǔ)上修改默認圖片以及文字，比如：無收藏頁面，顯示自定義圖片+文字
4、空數(shù)據(jù)頁面進行操作：比如：無訂單頁面，顯示自定義圖片+文字+按鈕（去逛逛，下單按鈕）

以上四種情況基本滿足項目需求了. . . 還是直接貼效果圖. . . 代碼 . . .

默認顯示頁面
//創(chuàng)建UITableView
- (void)createUI
{
    self.title = @"我的訂單";
    self.xlTableView.delegate = self;
    self.xlTableView.dataSource = self;
}
修改默認顯示頁面圖片+文字
//創(chuàng)建UITableView
- (void)createUI
{
    self.title = @"我的訂單";
    self.xlTableView.delegate = self;
    self.xlTableView.dataSource = self;
    self.noDataImgName = @"NoOrderData";
    self.noDataTitle = @"親，您沒有訂單任何訂單消息哦！";
}
添加副標題
//創(chuàng)建UITableView
- (void)createUI
{
    self.title = @"我的訂單";
    self.xlTableView.delegate = self;
    self.xlTableView.dataSource = self;
    self.noDataImgName = @"NoOrderData";
    self.noDataTitle = @"親，您沒有訂單任何訂單消息哦！";
    self.noDataDetailTitle = @"您購買的寶貝將會呈現(xiàn)在這里";
}
添加按鈕
//創(chuàng)建UITableView
- (void)createUI
{
    self.title = @"我的訂單";
    self.xlTableView.delegate = self;
    self.xlTableView.dataSource = self;
    self.noDataImgName = @"NoOrderData";
    self.noDataTitle = @"親，您沒有訂單任何訂單消息哦！";
    self.noDataDetailTitle = @"您購買的寶貝將會呈現(xiàn)在這里";
    self.btnTitle = @"馬上逛逛";
    //需要修改按鈕背景圖片，可以這樣做
    self.btnImgName = @"noOrderImage";
}

-(void)buttonEvent
{
    NSLog(@"馬上逛逛");
}

第一步：下載DZNEmptyDataSet，將DZNEmptyDataSet里面的UIScrollView+EmptyDataSet.h、UIScrollView+EmptyDataSet.m拉到自己的項目中。（再次感謝該第三方的作者）

第二部：將我封裝的這個類拉進去(直接copy)，然后創(chuàng)建的新控制器的時候，繼承這個類就可以。封裝的這個類繼承：UIViewController

#import <UIKit/UIKit.h>

@interface XLBaseTableController : UIViewController

@property(nonatomic,retain) UITableView *xlTableView;

//是否顯示空數(shù)據(jù)頁面  默認為顯示
@property(nonatomic,assign) BOOL isShowEmptyData;

//空數(shù)據(jù)頁面的title -- 可不傳，默認為：暫無任何數(shù)據(jù)
@property(nonatomic,strong) NSString *noDataTitle;
//空數(shù)據(jù)頁面的圖片 -- 可不傳，默認圖片為：NoData
@property(nonatomic,strong) NSString *noDataImgName;

//顯示副標題的時候，需要賦值副標題，否則不顯示
@property(nonatomic,strong) NSString *noDataDetailTitle;

//按鈕標題、圖片 --不常用
@property(nonatomic,strong) NSString *btnTitle;
@property(nonatomic,strong) NSString *btnImgName;

@end

#import "XLBaseTableController.h"
#import "UIScrollView+EmptyDataSet.h"

@interface XLBaseTableController ()<DZNEmptyDataSetSource, DZNEmptyDataSetDelegate>

@end

@implementation XLBaseTableController

- (void)viewDidLoad {
    [super viewDidLoad];
    
    self.isShowEmptyData = YES;
    
    [self.view addSubview:self.myTableView];
    
    self.xlTableView.emptyDataSetSource = self;
    self.xlTableView.emptyDataSetDelegate = self;

}

-(UIImage *)imageForEmptyDataSet:(UIScrollView *)scrollView
{
    if (self.noDataImgName) {
        return [UIImage imageNamed:self.noDataImgName];
    }
    return [UIImage imageNamed:@"NoData"];
}

- (NSAttributedString *)titleForEmptyDataSet:(UIScrollView *)scrollView
{
    NSString *text = self.noDataTitle?self.noDataTitle:@"暫無任何數(shù)據(jù)";
    
    NSDictionary *attributes = @{NSFontAttributeName: [UIFont boldSystemFontOfSize:16.0f],
                                 NSForegroundColorAttributeName: [UIColor grayColor]};
    
    return [[NSAttributedString alloc] initWithString:text attributes:attributes];
}

- (NSAttributedString *)descriptionForEmptyDataSet:(UIScrollView *)scrollView
{
    NSString *text = self.noDataDetailTitle;
    
    NSMutableParagraphStyle *paragraph = [NSMutableParagraphStyle new];
    paragraph.lineBreakMode = NSLineBreakByWordWrapping;
    paragraph.alignment = NSTextAlignmentCenter;
    
    NSDictionary *attributes = @{NSFontAttributeName: [UIFont systemFontOfSize:14.0f],
                                 NSForegroundColorAttributeName: [UIColor lightGrayColor],
                                 NSParagraphStyleAttributeName: paragraph};
    
    return self.noDataDetailTitle?[[NSAttributedString alloc] initWithString:text attributes:attributes]:nil;
}

- (BOOL)emptyDataSetShouldAllowTouch:(UIScrollView *)scrollView
{
    return YES;
}

- (BOOL)emptyDataSetShouldDisplay:(UIScrollView *)scrollView
{
    return self.isShowEmptyData;
}

- (CGFloat)verticalOffsetForEmptyDataSet:(UIScrollView *)scrollView
{
    return -self.xlTableView.tableHeaderView.frame.size.height/2.0f;
}

- (NSAttributedString *)buttonTitleForEmptyDataSet:(UIScrollView *)scrollView forState:(UIControlState)state
{
    NSDictionary *attributes = @{NSFontAttributeName: [UIFont boldSystemFontOfSize:16.0f]};
    
    return self.btnTitle?[[NSAttributedString alloc] initWithString:self.btnTitle attributes:attributes]:nil;
}

- (UIImage *)buttonImageForEmptyDataSet:(UIScrollView *)scrollView forState:(UIControlState)state
{
    return self.btnImgName?[UIImage imageNamed:self.btnImgName]:nil;
}

- (void)emptyDataSet:(UIScrollView *)scrollView didTapButton:(UIButton *)button
{
    [self buttonEvent];
}

#pragma mark 按鈕事件
-(void)buttonEvent
{
    
}

-(UITableView *)xlTableView
{
    if(_xlTableView == nil)
    {
        _xlTableView = [[UITableView alloc] initWithFrame:CGRectMake(0, 0, [[UIScreen mainScreen] bounds].size.width, [[UIScreen mainScreen] bounds].size.height) style:UITableViewStyleGrouped];
        _xlTableView.tableFooterView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, [[UIScreen mainScreen] bounds].size.width, 1)];
        _xlTableView.tableHeaderView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, [[UIScreen mainScreen] bounds].size.width, 1)];
        
        _xlTableView.showsVerticalScrollIndicator = NO;
        _xlTableView.showsHorizontalScrollIndicator = NO;
    }
    
    return _xlTableView;
}

- (void)didReceiveMemoryWarning {
    [super didReceiveMemoryWarning];
}

@end

如果此文對您作用很大，接受打賞，多多益善 . . . 肯定了我的勞動成果 . . .

總結(jié)：本封裝滿足了大部分項目的需求，我的項目可以說幾乎都是直接繼承這個類的。互相學(xué)習(xí)，這個類還可以進一步進行封裝，由于時間關(guān)系，就先與大家共勉到這里。

因為是共勉的，所有都是經(jīng)過重寫的，目的就是為了可以讓大家直接使用，不像有的作者，只提供部分代碼，然后你懂的 . . . 但是本菜鳥還是建議大家自己敲一遍代碼，掌握了、學(xué)習(xí)了才是自己的 . . .

由于后期會將項目中此類的封裝繼續(xù)整理更新上來 . . .
所以，有興趣與本菜鳥一起共勉的，請評論收藏...
demo下載：EmptyDataHandle
歡迎關(guān)注 . . . stars

最后編輯于 ：
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
平臺聲明：文章內(nèi)容（如有圖片或視頻亦包括在內(nèi)）由作者上傳并發(fā)布，文章內(nèi)容僅代表作者本人觀點，簡書系信息發(fā)布平臺，僅提供信息存儲服務(wù)。

推薦閱讀更多精彩內(nèi)容