Swift 空數(shù)據(jù)界面顯示模塊封裝實(shí)現(xiàn)

一個(gè)Swift語(yǔ)言封裝的EmptyView顯示庫(kù),可作用于WKWebView巧号、UITableView、UICollectionView

示例

  • WKWebView


    webViewEmptyGIF.gif
  • UITableView


    tableViewEmptyGIF.gif
  • UICollectionView
collectionViewEmptyGIF.gif

引言:

項(xiàng)目開(kāi)發(fā)過(guò)程中當(dāng)網(wǎng)絡(luò)斷開(kāi)或者數(shù)據(jù)獲取失敗導(dǎo)致的界面顯示為空的情況下保檐,我們常會(huì)用到圖片加文字加刷新按鈕、文字加刷新按鈕或者純文本提醒的空界面顯示瘾境,所以對(duì)該功能實(shí)現(xiàn)的封裝封裝就顯得很有必要。

該技術(shù)封裝模塊使用Swift語(yǔ)言镰惦,參考OC封裝模塊的內(nèi)部實(shí)現(xiàn)邏輯迷守,利用runtime的系統(tǒng)方法交換機(jī)制,實(shí)現(xiàn)在WKWebView網(wǎng)頁(yè)加載界面旺入、UITableView兑凿、UICollectionView列表視圖等界面數(shù)據(jù)獲取失敗情況下的提醒顯示和刷新操作功能。

一:內(nèi)部實(shí)現(xiàn)原理

1茵瘾、通過(guò)runtime key值關(guān)聯(lián)HDEmptyView顯示對(duì)象

創(chuàng)建UIScrollView的extension對(duì)象UIScrollView+Empty類礼华,通過(guò)runtime key值關(guān)聯(lián)HDEmptyView顯示界面對(duì)象ly_emptyView ,該對(duì)象可根據(jù)調(diào)用界面的參數(shù)設(shè)置來(lái)控制空界面顯示的內(nèi)容龄捡、布局樣式卓嫂、顏色等。

    struct RuntimeKey {
        static let kEmptyViewKey = UnsafeRawPointer.init(bitPattern: "kEmptyViewKey".hashValue)
    }
    
    public var ly_emptyView: HDEmptyView? {
        set {
            objc_setAssociatedObject(self, RuntimeKey.kEmptyViewKey!, newValue, .OBJC_ASSOCIATION_RETAIN_NONATOMIC)
            for view in self.subviews {
                if view.isKind(of: HDEmptyView.classForCoder()) {
                    view.removeFromSuperview()
                }
            }
         self.addSubview(ly_emptyView!)
         self.ly_emptyView?.isHidden = true
        }
        get {
            return objc_getAssociatedObject(self, RuntimeKey.kEmptyViewKey!) as? HDEmptyView
        }
    }
    

2聘殖、WKWebView 調(diào)用顯隱方法

如果是WKWebView的空數(shù)據(jù)界面顯示晨雳,根據(jù)界面加載成功或失敗的情況,調(diào)用顯示/隱藏空界面方法

    public func ly_showEmptyView() {
        self.ly_emptyView?.superview?.layoutSubviews()
        self.ly_emptyView?.isHidden = false
        //始終保持顯示在最上層
        if self.ly_emptyView != nil {
            self.bringSubview(toFront: self.ly_emptyView!)
        }
    }
    
    public func ly_hideEmptyView() {
        self.ly_emptyView?.isHidden = true
    }  

3奸腺、列表視圖顯隱控制

如果是UITableView餐禁、UICollectionView則根據(jù)DataSource判斷是否自動(dòng)顯示emptyView

首先獲取當(dāng)前列表視圖上cell的個(gè)數(shù)

   //MARK: - Private Method
    fileprivate func totalDataCount() -> NSInteger {
        var totalCount: NSInteger = 0
        if self.isKind(of: UITableView.classForCoder()) {
            let tableView = self as? UITableView
            if (tableView?.numberOfSections)! >= 1 {
                for section in 0...(tableView?.numberOfSections)!-1 {
                    totalCount += (tableView?.numberOfRows(inSection: section))!
                }
            }
        }
        else if self.isKind(of: UICollectionView.classForCoder()) {
            let collectionView = self as? UICollectionView
            if (collectionView?.numberOfSections)! >= 1 {
                for section in 0...(collectionView?.numberOfSections)!-1 {
                    totalCount += (collectionView?.numberOfItems(inSection: section))!
                }
            }
        }
        return totalCount
    }

然后根據(jù)cell的個(gè)數(shù)判斷是否顯示 emptyView

    fileprivate func getDataAndSet() {
        if self.totalDataCount() == 0 {
            show()
        } else {
            hide()
        }
    }
    
    fileprivate func show() {
        if self.ly_emptyView?.autoShowEmptyView == false {
            self.ly_emptyView?.isHidden = true
            return
        }
        ly_showEmptyView()
    }

    fileprivate func hide() {
        if self.ly_emptyView?.autoShowEmptyView == false {
            self.ly_emptyView?.isHidden = true
            return
        }
        ly_hideEmptyView()
    }

4、列表視圖的方法交換與界面刷新顯示

    private static let swizzleMethod: Void = {
        //insertSections
        let originalSelector = #selector(insertSections(_:with:))
        let swizzledSelector = #selector(ly_insertSections(_:with:))
        HDRunTime.exchangeMethod(selector: originalSelector, replace: swizzledSelector, class: UITableView.self)
        
        //deleteSections
        let originalSelector1 = #selector(deleteSections(_:with:))
        let swizzledSelector1 = #selector(ly_deleteSections(_:with:))
        HDRunTime.exchangeMethod(selector: originalSelector1, replace: swizzledSelector1, class: UITableView.self)
        
        //insertRows
        let originalSelector2 = #selector(insertRows(at:with:))
        let swizzledSelector2 = #selector(ly_insertRowsAtIndexPaths(at:with:))
        HDRunTime.exchangeMethod(selector: originalSelector2, replace: swizzledSelector2, class: UITableView.self)
        
        //deleteRows
        let originalSelector3 = #selector(deleteRows(at:with:))
        let swizzledSelector3 = #selector(ly_deleteRowsAtIndexPaths(at:with:))
        HDRunTime.exchangeMethod(selector: originalSelector3, replace: swizzledSelector3, class: UITableView.self)
        
        //reload
        let originalSelector4 = #selector(reloadData)
        let swizzledSelector4 = #selector(ly_reloadData)
        HDRunTime.exchangeMethod(selector: originalSelector4, replace: swizzledSelector4, class: UITableView.self)
        
    }()
    

    //section
    @objc  func ly_insertSections(_ sections: NSIndexSet, with animation: UITableViewRowAnimation) {
        ly_insertSections(sections, with: animation)
        getDataAndSet()
    }
    
    @objc  func ly_deleteSections(_ sections: NSIndexSet, with animation: UITableViewRowAnimation) {
        ly_deleteSections(sections, with: animation)
        getDataAndSet()
    }
    
    //row
    @objc  func ly_insertRowsAtIndexPaths(at indexPaths: [IndexPath], with animation: UITableViewRowAnimation){
        ly_insertRowsAtIndexPaths(at: indexPaths, with: animation)
        getDataAndSet()
    }
    
    @objc func ly_deleteRowsAtIndexPaths(at indexPaths: [IndexPath], with animation: UITableViewRowAnimation){
        ly_deleteRowsAtIndexPaths(at: indexPaths, with: animation)
        getDataAndSet()
    }
    
    //reloadData
    @objc func ly_reloadData() {
        self.ly_reloadData()
        self.getDataAndSet()
    }

二:使用方法

1突照、創(chuàng)建 HDEmptyView 界面顯示對(duì)象

      //創(chuàng)建方式一:Block回調(diào)
     let emptyV:HDEmptyView = HDEmptyView.emptyActionViewWithImageStr(imageStr: "net_error_tip", titleStr: "暫無(wú)數(shù)據(jù)帮非,點(diǎn)擊重新加載", detailStr: "", btnTitleStr: "點(diǎn)擊刷新") {
            print("點(diǎn)擊刷新")
            weakSelf?.reloadDataWithCount(count: 4)
        }
        
        //創(chuàng)建方式二:target/action
    let emptyV:HDEmptyView = HDEmptyView.emptyActionViewWithImageStr(imageStr: "net_error_tip", titleStr: "暫無(wú)數(shù)據(jù),點(diǎn)擊重新加載", detailStr: "", btnTitleStr: "點(diǎn)擊刷新", target: self, action: #selector(reloadBtnAction)) as! HDEmptyView
 

2讹蘑、設(shè)置顯示參數(shù)屬性

        emptyV.titleLabTextColor = UIColor.red
        emptyV.actionBtnFont = UIFont.systemFont(ofSize: 19)
        emptyV.contentViewOffset = -50
        emptyV.actionBtnBackGroundColor = .white
        emptyV.actionBtnBorderWidth = 0.7
        emptyV.actionBtnBorderColor = UIColor.gray
        emptyV.actionBtnCornerRadius = 10

3末盔、賦值給當(dāng)前顯示對(duì)象的ly_emptyView

webView.scrollView.ly_emptyView = emptyV

tableView.ly_emptyView = emptyV

collectionView.ly_emptyView = emptyV

//設(shè)置點(diǎn)擊空白區(qū)域是否有刷新操作
        self.webView.scrollView.ly_emptyView?.tapContentViewBlock = {
            //weakSelf!.loadingURL(urltring: "http://news.baidu.com/")
        }


4、自定義空數(shù)據(jù)界面顯示

    //自定義空數(shù)據(jù)界面顯示
    func setupMyEmptyView() {
        let emptyView: MyEmptyView = Bundle.main.loadNibNamed("MyEmptyView", owner: self, options: nil)?.last as! MyEmptyView
        emptyView.reloadBtn.addTarget(self, action: #selector(reloadBtnAction(_:)), for: UIControlEvents.touchUpInside)
        emptyView.frame = view.bounds
        //空數(shù)據(jù)界面顯示
        let emptyV:HDEmptyView = HDEmptyView.emptyViewWithCustomView(customView: emptyView) as! HDEmptyView
        tableView.ly_emptyView = emptyV
        tableView.ly_emptyView?.tapContentViewBlock = {
            print("點(diǎn)擊界面空白區(qū)域")
        }
        tableView.ly_showEmptyView()
    }
    

注意事項(xiàng):

是否自動(dòng)顯隱EmptyView的參數(shù) autoShowEmptyView 默認(rèn)設(shè)置是true座慰,列表視圖會(huì)根據(jù)界面cell的count數(shù)量自動(dòng)顯隱空界面陨舱。
當(dāng)設(shè)置成false時(shí)只能手動(dòng)調(diào)用 ly_showEmptyView() 和 ly_hideEmptyView() 方法進(jìn)行顯隱操作

下載地址

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個(gè)濱河市版仔,隨后出現(xiàn)的幾起案子游盲,更是在濱河造成了極大的恐慌,老刑警劉巖蛮粮,帶你破解...
    沈念sama閱讀 222,590評(píng)論 6 517
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件益缎,死亡現(xiàn)場(chǎng)離奇詭異,居然都是意外死亡然想,警方通過(guò)查閱死者的電腦和手機(jī)莺奔,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 95,157評(píng)論 3 399
  • 文/潘曉璐 我一進(jìn)店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來(lái)变泄,“玉大人弊仪,你說(shuō)我怎么就攤上這事熙卡≌人ⅲ” “怎么了励饵?”我有些...
    開(kāi)封第一講書人閱讀 169,301評(píng)論 0 362
  • 文/不壞的土叔 我叫張陵,是天一觀的道長(zhǎng)滑燃。 經(jīng)常有香客問(wèn)我役听,道長(zhǎng),這世上最難降的妖魔是什么表窘? 我笑而不...
    開(kāi)封第一講書人閱讀 60,078評(píng)論 1 300
  • 正文 為了忘掉前任典予,我火速辦了婚禮,結(jié)果婚禮上乐严,老公的妹妹穿的比我還像新娘瘤袖。我一直安慰自己,他們只是感情好昂验,可當(dāng)我...
    茶點(diǎn)故事閱讀 69,082評(píng)論 6 398
  • 文/花漫 我一把揭開(kāi)白布捂敌。 她就那樣靜靜地躺著,像睡著了一般既琴。 火紅的嫁衣襯著肌膚如雪占婉。 梳的紋絲不亂的頭發(fā)上,一...
    開(kāi)封第一講書人閱讀 52,682評(píng)論 1 312
  • 那天甫恩,我揣著相機(jī)與錄音逆济,去河邊找鬼。 笑死磺箕,一個(gè)胖子當(dāng)著我的面吹牛奖慌,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播松靡,決...
    沈念sama閱讀 41,155評(píng)論 3 422
  • 文/蒼蘭香墨 我猛地睜開(kāi)眼简僧,長(zhǎng)吁一口氣:“原來(lái)是場(chǎng)噩夢(mèng)啊……” “哼!你這毒婦竟也來(lái)了击困?” 一聲冷哼從身側(cè)響起涎劈,我...
    開(kāi)封第一講書人閱讀 40,098評(píng)論 0 277
  • 序言:老撾萬(wàn)榮一對(duì)情侶失蹤,失蹤者是張志新(化名)和其女友劉穎阅茶,沒(méi)想到半個(gè)月后蛛枚,有當(dāng)?shù)厝嗽跇?shù)林里發(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 46,638評(píng)論 1 319
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡脸哀,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 38,701評(píng)論 3 342
  • 正文 我和宋清朗相戀三年蹦浦,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片撞蜂。...
    茶點(diǎn)故事閱讀 40,852評(píng)論 1 353
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡盲镶,死狀恐怖侥袜,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情溉贿,我是刑警寧澤枫吧,帶...
    沈念sama閱讀 36,520評(píng)論 5 351
  • 正文 年R本政府宣布,位于F島的核電站宇色,受9級(jí)特大地震影響九杂,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜宣蠕,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 42,181評(píng)論 3 335
  • 文/蒙蒙 一例隆、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧抢蚀,春花似錦镀层、人聲如沸。這莊子的主人今日做“春日...
    開(kāi)封第一講書人閱讀 32,674評(píng)論 0 25
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)。三九已至谷饿,卻和暖如春惶我,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背博投。 一陣腳步聲響...
    開(kāi)封第一講書人閱讀 33,788評(píng)論 1 274
  • 我被黑心中介騙來(lái)泰國(guó)打工绸贡, 沒(méi)想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留,地道東北人毅哗。 一個(gè)月前我還...
    沈念sama閱讀 49,279評(píng)論 3 379
  • 正文 我出身青樓听怕,卻偏偏與公主長(zhǎng)得像,于是被迫代替她去往敵國(guó)和親虑绵。 傳聞我的和親對(duì)象是個(gè)殘疾皇子尿瞭,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 45,851評(píng)論 2 361

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

  • Swift1> Swift和OC的區(qū)別1.1> Swift沒(méi)有地址/指針的概念1.2> 泛型1.3> 類型嚴(yán)謹(jǐn) 對(duì)...
    cosWriter閱讀 11,113評(píng)論 1 32
  • 1、通過(guò)CocoaPods安裝項(xiàng)目名稱項(xiàng)目信息 AFNetworking網(wǎng)絡(luò)請(qǐng)求組件 FMDB本地?cái)?shù)據(jù)庫(kù)組件 SD...
    陽(yáng)明先生_X自主閱讀 15,988評(píng)論 3 119
  • 一 猴子和豬老是說(shuō)我 禿頭 和尚也可以禿的啊? 他們老是說(shuō) 老是說(shuō) 我只好去找?guī)煾?師傅說(shuō):阿彌陀佛 禿了干凈 你...
    氷熊貓閱讀 320評(píng)論 0 0
  • 今天的日記是補(bǔ)寫的,昨天晚上忙著和孩他爸吵架捕发,忘了寫疏旨。因?yàn)樗趾茸砹耍吹剿茸砭蜔┑幕旁幔€不知好歹的找我湊近乎...
    輕描淡寫的小情緒晴閱讀 117評(píng)論 0 1
  • 兒子愛(ài)吃熟牛肉檐涝,買回的成品不管是從顏色還是從口感上總覺(jué)得差那么一些;自己去鹵牛肉卻總也把握不好火候和時(shí)間,不但口感...