使用Swift开发一个贝乐虎启蒙App - 首页（二）

这是我参与8月更文挑战的第6天，活动详情查看：8月更文挑战

前言

上一篇咱们把首页的导航栏、banner以及圆弧背景处理好了，这篇咱们就开始处理接口数据

请求数据

前面封装网络请求的时候已经把首页的接口写好了，不过如今请求参数要加age，能够根据年龄来获取数据

extension Network {

    enum Home {
        case list(path: String, age: Int)
    }
}
复制代码

在RecViewController里面定义一个枚举，path是请求接口对应的不一样部分

enum RecFrom {
    case rec /// 推荐
    case song /// 唱儿歌
    case animation // 看动画
    case book /// 读绘本
    case story /// 听故事

    var path: String {
        switch self {
        case .rec:
            return "tj3"
        case .song:
            return "eg3"
        case .animation:
            return "dh3"
        case .book:
            return "hb3"
        case .story:
            return "gs3"
        }
    }
}
复制代码

数据请求

private func requestData() {
    Network.Home
        .list(path: from.path, age: 1)
        .request()
        .responseData(RecModel.self) { (model) in

    } failure: { (error) in
        Toast.show(info: error.errorMessage)
    }
}
复制代码

上下拉刷新咱们使用MJRefresh

let header = MJRefreshNormalHeader(refreshingBlock: { [weak self] in
    guard let `self` = self else { return }
    self.requestData()
})
header.lastUpdatedTimeLabel?.isHidden = true
header.stateLabel?.isHidden = true
collectionView.mj_header = header
collectionView.mj_header?.beginRefreshing()
复制代码

有没有感受若是每一个地方都这样写会有点恶心，并且每次都要import MJRefresh。无论是UICollectionView仍是UITableView，都是继承UIScrollView，因此咱们给UIScrollView来个extension来达到尽量的简便

extension UIScrollView {

    func mj_headerRefresh(_ handler: @escaping () -> Void) {
        let headerRefresh = MJRefreshNormalHeader()
        headerRefresh.lastUpdatedTimeLabel?.isHidden = true
        headerRefresh.stateLabel?.isHidden = true
        headerRefresh.refreshingBlock = hander
        mj_header = headerRefresh
    }

    func mj_footerRefresh(_ handler: @escaping () -> Void) {
        let footerRefresh = MJRefreshBackStateFooter()
        footerRefresh.refreshingBlock = hander
        mj_footer = footerRefresh
    }

    func beginRefreshing() {
        mj_header?.beginRefreshing()
    }

    func endHeaderRefresh() {
        if let mjHeader = mj_header, mjHeader.isRefreshing {
            mj_header?.endRefreshing()
        }
    }

    func endFooterRefresh() {
        if let mjFooter = mj_footer, mjFooter.isRefreshing {
            mj_footer?.endRefreshing()
        }
    }

    var isHeaderRefresh: Bool {
        if let mjHeader = mj_header {
            return mjHeader.isRefreshing
        }
        return false
    }

    var isFooterRefresh: Bool {
        if let mjFooter = mj_footer {
            return mjFooter.isRefreshing
        }
        return false
    }
}
复制代码

在RecViewController这样使用就能够了，是否是简便了不少

collectionView.mj_headerRefresh { [weak self] in
    guard let `self` = self else { return }
    self.requestData()
}
collectionView.beginRefreshing()
复制代码

接下来分别获取推荐、唱儿歌、看动、读绘本、听故事的数据。top_items就是banner的数据。能够看出有top_items就会有banner。

因此我这边的作法是：UICollectionView的组数等于more_items.count+2，top_items是一组和icon_items一组，因此是+2

func numberOfSections(in collectionView: UICollectionView) -> Int {
    return dataSource.count + 2
}

func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
    /// banner
    if section == 0 {
        return 1
    }
    /// banner下面的5个icon
    if section == 1 {
        return 1
    }
    /// 其余的cell
    switch dataSource[section - 2].layoutType {
    case .slide:
        return 1
    default:
        return dataSource[section - 2].viewP.itemCount
    }
}

func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {

    switch indexPath.section {
    case 0: /// banner
        let cell = collectionView.dequeueReusableCell(withClass: RecBannerCell.self, for: indexPath)
        cell.banners = banners
        return cell
    case 1: /// banner下面的5个icon
        let cell = collectionView.dequeueReusableCell(withClass: RecHeaderItemCell.self, for: indexPath)
        cell.items = items
        return cell
    default:
        let model = dataSource[indexPath.section - 2]
        switch model.layoutType {
        case .big:
            let cell = collectionView.dequeueReusableCell(withClass: RecCell.self, for: indexPath)
            cell.update(big: model.data.items[indexPath.item])
            return cell
        case .big_list:
            let cell = collectionView.dequeueReusableCell(withClass: RecBigListCell.self, for: indexPath)
            cell.update(model.data.items[indexPath.item])
            return cell
        case .slide:
            let cell = collectionView.dequeueReusableCell(withClass: RecSlideCell.self, for: indexPath)
            cell.items = model.data.items.prefix(model.viewP.itemCount).map({ $0
            })
            return cell
        case .book:
            let cell = collectionView.dequeueReusableCell(withClass: RecBigListCell.self, for: indexPath)
            cell.update(slide: model.data.items[indexPath.item])
            return cell
        case .store:
            let cell = collectionView.dequeueReusableCell(withClass: RecStoreCell.self, for: indexPath)
            cell.update(model.data.items[indexPath.item])
            return cell
        case .store_list:
            let cell = collectionView.dequeueReusableCell(withClass: RecStoreListCell.self, for: indexPath)
            cell.update(model.data.items[indexPath.item])
            return cell
        case .hot:
            let cell = collectionView.dequeueReusableCell(withClass: RecCell.self, for: indexPath)
            cell.update(hot: model.data.items[indexPath.item])
            return cell
        default:
            let cell = collectionView.dequeueReusableCell(withClass: RecCell.self, for: indexPath)
            cell.update(model.data.items[indexPath.item])
            return cell
        }
    }
}
复制代码

首页基本上就结束了，下面看下成果：