Finally I found an idea,
I kept all within a TableView,
The first two (the banner image and the explore lable are the first cell of my tableview)
The second PrototypeCell is the category Titles(where the cloths, bags and belts)
The Third Prototype cell is a what with the filter and sort buttons and I used this cell as section Header View
And finally the last prototype cell is a one which have the collection View and its cell (I just design it and add it into a cell)
And sample code is as follows,
My CollectionViewCell
import UIKit
class CollectionViewCell: UICollectionViewCell {
@IBOutlet weak var imgFav: UIImageView!
@IBOutlet weak var title: UILabel!
@IBOutlet weak var pinImage: UIImageView!
@IBOutlet weak var priceLbl: UILabel!
@IBOutlet var splPriceLbl: UILabel!
@IBOutlet weak var addToFav: UIButton!
override func awakeFromNib()
{
super.awakeFromNib()
self.contentView.autoresizingMask = [UIViewAutoresizing.flexibleRightMargin, UIViewAutoresizing.flexibleLeftMargin, UIViewAutoresizing.flexibleBottomMargin, UIViewAutoresizing.flexibleTopMargin]
self.contentView.translatesAutoresizingMaskIntoConstraints = true
}
}
My TableViewCell
import UIKit
class SubCategoryTableViewCell: UITableViewCell {
@IBOutlet weak var productListCollectVw: UICollectionView!
@IBOutlet weak var btnSort: UIButton!
@IBOutlet weak var btnFilter: UIButton!
@IBOutlet weak var subCategryTitle: UILabel!
@IBOutlet weak var lblExplore: UILabel!
@IBOutlet weak var imgBanner: UIImageView!
override func awakeFromNib() {
super.awakeFromNib()
// Initialization code
}
override func setSelected(_ selected: Bool, animated: Bool) {
super.setSelected(selected, animated: animated)
// Configure the view for the selected state
}
}
And Finally My ViewController
@IBOutlet weak var mainTableView: UITableView!
var subCategoryAry2 = NSMutableArray()
var imageUrl:URL!
var imageUrlStr:String = ""
var productListAry:NSMutableArray = []
func numberOfSections(in tableView: UITableView) -> Int
{
return 2
}
func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int
{
if section == 0
{
return subCategoryAry2.count + 1
}
else
{
return 1
}
}
func tableView(_ tableView: UITableView, viewForHeaderInSection section: Int) -> UIView?
{
if section == 0
{
return nil
}
else
{
let CellIdentifier: String = "section2Cell"
let headerView: SubCategoryTableViewCell? = tableView.dequeueReusableCell(withIdentifier: CellIdentifier) as! SubCategoryTableViewCell?
headerView?.btnFilter.addTarget(self, action: #selector(self.filterAction(_:)), for: .touchUpInside)
headerView?.btnSort.addTarget(self, action: #selector(self.sortAction(_:)), for: .touchUpInside)
if headerView == nil
{
print("No cells with matching CellIdentifier loaded from your storyboard")
}
return headerView!
}
}
func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell
{
if indexPath.section == 0
{
if indexPath.row == 0
{
let cell:SubCategoryTableViewCell = self.mainTableView.dequeueReusableCell(withIdentifier: "bannerCell") as! SubCategoryTableViewCell!
if self.imageUrlStr == "no_image.png" || self.imageUrlStr == ""
{
cell.imgBanner.isHidden = true
cell.imgBanner.frame.size.height = 0
cell.lblExplore.frame.origin.y = 0
}
else
{
cell.imgBanner.isHidden = false
let imageUrl1 = "\(self.imageUrl!)"
let trimmedUrl = imageUrl1.trimmingCharacters(in: CharacterSet(charactersIn: "")).replacingOccurrences(of: " ", with: "%20") as String
cell.imgBanner.sd_setImage(with: URL(string: trimmedUrl), completed: { (image, error, imageCacheType, imageUrl) in
if image != nil
{
}
else
{
cell.imgBanner.isHidden = true
cell.imgBanner.frame.size.height = 0
cell.lblExplore.frame.origin.y = 0
}
})
}
return cell
}
else //if indexPath.row == 1
{
let cell:SubCategoryTableViewCell = self.mainTableView.dequeueReusableCell(withIdentifier: "listCell") as! SubCategoryTableViewCell!
cell.subCategryTitle.text = (subCategoryAry2.object(at: (indexPath as NSIndexPath).row - 1) as AnyObject).value(forKey: "name") as? String
return cell
}
}
else
{
let cell:SubCategoryTableViewCell = (self.mainTableView.dequeueReusableCell(withIdentifier: "collectionCell") as? SubCategoryTableViewCell!)!
// Load Your CollectionView
cell.productListCollectVw.dataSource = self
cell.productListCollectVw.delegate = self
cell.productListCollectVw.reloadData()
return cell
}
}
func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath)
{
if indexPath.section == 0
{
if indexPath.row != 0
{
//***************** Do whatever you need to do if user did selected the row but remain the indexpath.row or indexpath.row - 1 *****************//
subCategoryID = ((subCategoryAry2.object(at: (indexPath as NSIndexPath).row - 1) as! NSObject).value(forKey: "category_id") as? String)! as NSString
print("tableView - didSelectRowAt \(indexPath.row)")
}
}
}
func tableView(_ tableView: UITableView, heightForRowAt indexPath: IndexPath) -> CGFloat
{
if indexPath.section == 0
{
var height = CGFloat()
if indexPath.row == 0
{
if self.imageUrlStr == "no_image.png" || self.imageUrlStr == ""
{
//***************** Reduce banner image height if it is nil *****************//
height = 38
}
else
{
height = 175 + 38
}
}
else
{
height = 44
}
return height
}
else
{
let height = (255 * self.productListAry.count/2) + (2 * (self.productListAry.count) + 4)
//***************** increase height as per your need *****************//
return CGFloat(height)
}
}
func tableView(_ tableView: UITableView, heightForHeaderInSection section: Int) -> CGFloat
{
if section == 0
{
return 0
}
else
{
return 44
}
}
func collectionView(_ collectionView: UICollectionView,
numberOfItemsInSection section: Int) -> Int
{
return self.productListAry.count
}
func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell
{
let cell = collectionView.dequeueReusableCell(withReuseIdentifier: self.reuseIdentifier, for: indexPath) as! CollectionViewCell
cell.title.text = (self.productListAry.object(at: (indexPath as NSIndexPath).row) as! NSDictionary).value(forKey: "name") as? String
//***************** Load your cell as per your need *****************//
return cell
}
func collectionView(_ collectionView: UICollectionView, didSelectItemAt indexPath: IndexPath)
{
print("didSelectItemAt \(indexPath.row)")
}
My Storyboard will look like the screenshot added
https://drive.google.com/file/d/0B2JNfyRRcL0GYjJsckpyaGpoMkE/view?usp=sharing