How to create mixed static and dynamic rows on UICollectionView?

714 Views Asked by At

I'm currently working on an app. I need to create mixed static and dynamic rows in a UIViewCollection. I need to fill the first and the second row with static UIImage and UILabel. Then the dynamic content should be started from 3rd row. How to do that?

I'm creating this programmatically using Swift 3 without Storyboard.

My App

Any help would be appreciated!

2

There are 2 best solutions below

1
On

The reason why you would like to use static cells, is because the user interface on these cells will be always the same. Also, you would like to no separator between the cells.

I would rather recommend to place UIView above the UICollectionView, than introducing static cells for this purpose. You can draw the UIView to be mimicking the look of the cells, what would also solve the problem of not having the separator between the "static cells".

The other reason, why a UIView would be a better approach, because you do not mess up your dataSource, especially, when it comes to IndexPath's.

Last thing, the UI really looks like something, what could be solved with a UITableView. Is there a particular reason, why u are using UICollectionView?

EDIT: If you are using UITableView, you can just assign this view to the tableView's tableHeaderView property in viewDidLayoutSubviews or in viewWillAppear.

Example:

// Create headerView from Nib 
// Make sure you override the init() function, so it will read it from xib
let headerView = YourHeaderView()

// Set the width to be equal to your tableView's width, and set the height according to how height it is in your xib files
headerView.frame =  CGRect(x: 0, y: 0, width: self.tableView.frame.width, height: 200)

// UITableView has a tableViewHeader property. just assign the view to it
self.tableView.tableViewHeader = headerView
0
On

Try below line of codes:

 override func numberOfSectionsInCollectionView(collectionView: UICollectionView) -> Int {
      return 1
    }

    override func collectionView(collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {

    //assuming, arrLabelDynamic.count = arrImageDynamic.count and arrLabelStatic.count = arrImageStatic.count

        return arrImageDynamic.count + arrImageStatic.count
    }
    func collectionView(collectionView: UICollectionView, cellForItemAtIndexPath indexPath:NSIndexPath)->UICollectionViewCell
        {
           var  cell = collectionView.dequeueReusableCellWithReuseIdentifier("CELL", forIndexPath: indexPath) as CollectionCell

        // if my cell is 3rd or greater then 3.
            if ( indexPath.row > 1 )    {
            cell.imageView.image = [UIImage imageNamed: arrImageDynamic[indexPath.row - 2]] ;
            cell.myLabel.text= [UIImage imageNamed: arrLabelDynamic[indexPath.row - 2]] ;
             }
       //if cell is first and second.
        else{
            cell.imageView.image = [UIImage imageNamed: arrImageStatic[indexPath.row ]] ;
            cell.myLabel.text= [UIImage imageNamed: arrLabelStatic[indexPath.row]] ;
             }
         return cell
        }

If you are usingTableview, do the same with tableview in its delegates. Making two different array for static and dynamic is easy to maintain. There are more few methods you can do like:

  1. Add Static data is Mutable array and then add Dynamic data into the same array. (easiest solution, But you have to take care about the array that data will not shuffle or edited. And again you wanted to use these mutable array use removeAllObject otherwise you have replication of data.)

  2. You can maintain dictionary for label and image, and so on.. Its all about how you understand the problem ,your requirement and how you manage the things.