在SWIFT中自定义UITableview的第一行

Question

我正在尝试自定义UITableView的第一行。

我从API中获取JSON数据，其中包含商店名称和商店徽标。其中5家店铺设计有背景，比顶部的其他单元大。

我可以遍历JSON并检查商店是否有设计，但我还无法做到：

在数组中添加背景设计商店

让它们首先出现在没有设计的其他商店之前。

以下是我打算做的图片

Answer 1

在您的tableview中，您使用两个单元格。在这两个单元格中，一个单元格更大，并根据需要设置背景图像。在第二个细胞中使用较小的细胞。然后在cellForRowAtIndexPath方法中检查设计商店。如果Shop设计为true，则在函数的else部分调用First Cell或其他。

  

示例代码......

 func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell {

    if self.design[indexPath.row] == true {
        let cell: UITableViewCell = UITableViewCell(style: UITableViewCellStyle.Default, reuseIdentifier: "firstCustomCell")
        //set the data here
        return cell
    }
    else {
        let cell: UITableViewCell = UITableViewCell(style: UITableViewCellStyle.Default, reuseIdentifier: "thirdCustomCell")
        //set the data here
        return cell
    }
}

Answer 2

首先，您的 Shop 类需要具有带背景图片的可选属性，例如：

class Shop {
   ...
   var backgroundImage: UIImage?
   ...
}

只有那5家商店有背景图片，其余的 backgroundImage = nil 。

假设您已经从服务器获取并序列化了数据，那么让我们从过滤商店阵列并重新排列它的顺序开始：

//"fetchedShops" is array of serialized shops: [Shop]()
let shopsWithBackgroundImage = fetchedShops.filter( { $0.backgroundImg != nil } )
let showWithNoImage = shops.filter( { $0.backgroundImg == nil } 
let allShops = shopsWithBackgroundImage + showWithNoImage

现在，您必须创建两个不同的自定义单元格（如XIB或在Storyboard中） - 具有背景的单元格和不具有背景的单元格。 之后，只需实现 cellForRowAtIndexPath ：

func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell {
 let shop = allShops[indexPath.row]
 if shop.backgroundImage != nil {
  //"shop" has background image - use custom cell with background image
  let cell = tableView.dequeueReusableCell(withReuseIdentifier: cellWithBackgroundImageID, for: indexPath) as! CellWithBackground
  cell.backgroundImageView.image = shop.backgroundImage

  //other cell's config

  return cell
 }
 //"shop" has no backgroundImage - let's use normal cell
 let cell = tableView.dequeueReusableCell(withReuseIdentifier: normalShopCellID, for: indexPath) as! NormalShopCell

 //other cell's config

 return cell
}

希望有所帮助：）