debug_cat 发表于 2021-4-2 08:54

[ios]ios首页分类列表的实现(连载14)

本帖最后由 莫问刀 于 2021-4-2 11:34 编辑




### 首页分类列表的实现

#### 多个分类数据的获取

```swift
                //获取分类的数据
    func getCategories() {
      Alamofire.request(UnionApi.getCategoryUrl()).responseObject{
            (response: DataResponse<CategoryClass>) in
            if let res = response.result.value?.data{
                //分类数据获取成功,设置到tab中
                self.setTabTitle(data: res)
            }
      }
    }
   
    func setTabTitle(data: ) {
      categories = data
      //把分类名字取出来
      for category in data {
            tabTitles.append(category.title ?? "")
      }
      //把获取的分类数组设置到tab中
      segmentedDataSource.titles = tabTitles
      //显示当前tab的第一个位置
      segmentedView.defaultSelectedIndex = 0
      //设置数据之后,需要刷新
      segmentedView.reloadData()
    }
```

> 先获取分类的数据,然后把数据设置到顶部的tab中。
>
> 我们获取成功之后,就可以根据分类的id,获取具体的商品了。
>
> 每个tab对应的商品id是不同的

---

#### 分类列表

因为之前已经做过了一次列表了,这一次,我们只需要复制过来,修改下获取分类的地址就好了。

以下是完整代码,已经注释好了。

```swift
//
//CategoryTabViewController.swift
//uitable
//
//Created by Alice on 2021/4/1.
//

import UIKit
import Alamofire
import ESPullToRefresh
import JXSegmentedView
//分类页面,提供一个分类id,获取具体分类内容
class CategoryTabViewController: BaseViewController, UITableViewDelegate, UITableViewDataSource{
   
    //需要提供一个分类id
    var categoryID = "9660"
   
    let cellId = "categoryCell"//默认加载第一页数据
    private var currentPage = 1
   
    //当前全部数据
    private var preferentialList = ()
   
    private lazy var uiTable: UITableView = {
      let tab = UITableView()
      //开始隐藏分割线
      tab.tableFooterView = UIView()
      //cell的高度自动计算
      tab.rowHeight = UITableView.automaticDimension
      return tab
    }()
   
    override func viewDidLoad() {
      super.viewDidLoad()
      view.addSubview(uiTable)
      //设置代{过}{滤}理
      uiTable.delegate = self
      uiTable.dataSource = self
      uiTable.register(PreferentialCellTableViewCell.self, forCellReuseIdentifier: cellId)
      uiTable.snp.makeConstraints { (make) in
            //安全区内
            make.top.equalTo(view.safeAreaLayoutGuide.snp.top)
            make.bottom.equalTo(view.safeAreaLayoutGuide.snp.bottom)
            //宽度等于屏幕
            make.width.equalToSuperview()
      }
      
      //设置刷新es工具
      uiTable.es.addPullToRefresh {
            print("refresh??")
            self.currentPage = 1
            //下拉刷新的时候,我们获取第一页的数据
            self.getData(page: self.currentPage)
      }
      uiTable.es.addInfiniteScrolling {
            print("load more")
            self.getData(page: self.currentPage)
      }
      
      //加载第一页数据
      uiTable.es.startPullToRefresh()
    }

    func getData(page: Int) {
      //获取数据
      let url = UnionApi.getCategoriesByID(id: categoryID, page: page)
      print("地址:\(url)")
      Alamofire.request(url)
            .responseObject {(response: DataResponse<CategoryListBean>) in
                //获取数据成功
                let result = response.result.value
                print("获取的数据page:\(page)")
                print(result?.message)
                //设置到数组中
                if let arr = result?.data{
                  if page == 1{
                        //清空全部数据
                        self.preferentialList.removeAll()
                        self.preferentialList = arr
                        //停止下拉刷新
                        self.uiTable.es.stopPullToRefresh()
                  } else{
                        //不是第一页的时候,我们需要把获取到的数据,加入到之前的数组中
                        
                        self.preferentialList += arr
                        self.uiTable.es.stopLoadingMore()
                  }
                  self.currentPage += 1
                  //刷新列表
                  self.uiTable.reloadData()
                } else {
                  //返回的数据是空的,那就没有数据了
                  self.uiTable.es.noticeNoMoreData()
                }
            }
    }
   
}
extension CategoryTabViewController{
    func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
      //返回数组的大小
      if preferentialList.isEmpty {
            tableView.separatorStyle = .none
            tableView.setEmptyDataView(image: UIImage(systemName: "tortoise") ?? UIImage(), title: "推荐商品正在赶来")
      }else{
            tableView.separatorStyle = .singleLine
            tableView.removeEmptyDataView()
      }
      return preferentialList.count
    }
   
    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
      //我们的cell处理
      let cell = tableView.dequeueReusableCell(withIdentifier: cellId, for: indexPath) as! PreferentialCellTableViewCell
      cell.setValueForCell(item: preferentialList)
      return cell
    }
   
    func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {
      //禁止cell点击之后显示灰色
      tableView.deselectRow(at: indexPath, animated: false)
      //进入详情页面
      let goodsVC = GoodsDetailControllerViewController()
      if let imgs = preferentialList.smallImages?.string{
            goodsVC.images = imgs
      } else {
            goodsVC.images = ["//imgs.sunofbeaches.com/group1/M00/00/46/rBsADWBlzGyAIR-tAABhL_YvXjs27.jpeg"]
      }
      goodsVC.goodsData = preferentialList
      navigationController?.pushViewController(goodsVC, animated: true)
    }
}

extension CategoryTabViewController: JXSegmentedListContainerViewListDelegate {
    func listView() -> UIView {
      return view
    }

    func listDidAppear() {
      //因为`JXSegmentedListContainerView`内部通过`UICollectionView`的cell加载列表。当切换tab的时候,之前的列表所在的cell就被回收到缓存池,就会从视图层级树里面被剔除掉,即没有显示出来且不在视图层级里面。这个时候MJRefreshHeader所持有的UIActivityIndicatorView就会被设置hidden。所以需要在列表显示的时候,且isRefreshing==YES的时候,再让UIActivityIndicatorView重新开启动画。
//      if (self.tableView.mj_header.isRefreshing) {
//            UIActivityIndicatorView *activity = ;
//            ;
//      }
//      if refreshControl?.isRefreshing == true {
//            refreshControl?.beginRefreshing()
//      }
//      print("listDidAppear")
    }

    func listDidDisappear() {
//      print("listDidDisappear")
    }
}


```

在点击商品的时候,我们跳转到商品的详情页面去,就和之前的连接起来了。



> 接下来的计划是完成另一个分类的页面,类似于第一个首页。
>
> 整体下来就是体力活了。
>
> 最后的页面是搜索页面,支持商品模糊搜索。



最近可能比较忙,也不知道什么时候更新啦。如果你喜欢,就关注我,我会继续更新的。

搭建了一个个人博客:

http://www.bbsios.xyz

代码地址:

https://github.com/cat13954/IOSUiTableViewSample

lyl610abc 发表于 2021-4-2 10:53

UITableViewDataSource好熟悉,我之前也用过,嘿嘿{:301_987:}

gallon 发表于 2021-4-2 11:14

不行了,swift的时候已经不做了。OC很熟悉

debug_cat 发表于 2021-4-2 11:35

lyl610abc 发表于 2021-4-2 10:53
UITableViewDataSource好熟悉,我之前也用过,嘿嘿

uikit。swift和oc都是差不多类名。这是为了迁移过来方便开发者。
有部分会有些小差别,但是用法几乎一样的

debug_cat 发表于 2021-4-2 11:39

gallon 发表于 2021-4-2 11:14
不行了,swift的时候已经不做了。OC很熟悉

ios大佬~~~~~~{:301_1001:}
页: [1]
查看完整版本: [ios]ios首页分类列表的实现(连载14)