Change UICollectionView cell X position - swift

Question

How can I change the X position of every single cell programmatically? I can change the width and height of the cell as my wish but it is unable to complete the project because of XY position.

My result ,
Expected result is,

and my full view controller code is,

import UIKit

class ReviewVC: UIViewController , UICollectionViewDataSource , UICollectionViewDelegate , UICollectionViewDelegateFlowLayout{


    var cellWidthArr : [CGFloat] = [60.0 , 170.0 , 110.0 , 120.0]


    var titleArr = ["  Polite  " , "  Showed up on time  ", "  Quick responses  " , "  Fair prices  "]

    override func viewDidLoad() {
        super.viewDidLoad()


        self.navigationItem.title = "Review your experiance"

        let layout: UICollectionViewFlowLayout = UICollectionViewFlowLayout()
        layout.sectionInset = UIEdgeInsets(top: 0, left: 0, bottom: 0, right: 0)
        layout.minimumInteritemSpacing = 0
        layout.minimumLineSpacing = 0
        collectionView!.collectionViewLayout = layout

    }


    func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
        return 4
    }

    func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
        let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "ReviewCollectionCell", for: indexPath)as? ReviewCollectionCell

        cell?.titleLabel.text = self.titleArr[indexPath.row]

        cell?.titleLabel.layer.cornerRadius = (cell?.titleLabel.bounds.size.height)!/2
        cell?.titleLabel.clipsToBounds = true

        cell?.titleLabel.layer.borderColor = (UIColor.init(red: 240/255, green: 36/255, blue: 70/255, alpha: 1.0)).cgColor
        cell?.titleLabel.layer.borderWidth = 1.0

        return cell!
    }

    func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, insetForSectionAt section: Int) -> UIEdgeInsets {
        return UIEdgeInsets(top: 0, left: 0, bottom: 0, right: 0)
    }

    func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize
    {
        return CGSize(width: self.cellWidthArr[indexPath.row], height: 30)
    }
}

Anyone please help me to findout the solution.Thanks...

try calculating the width of your label inside `sizeForItemAt`and set your cell width according to calculated label width. — Awais Fayyaz, Dec 05 '18 at 06:37

score 2 · Accepted Answer · answered Dec 05 '18 at 06:45

You can use the open source project TagCellLayout written by riteshhgupta in GitHub.

Sample Code to initialize the layout:

import TagCellLayout

let tagCellLayout = TagCellLayout(alignment: .left, delegate: self)
collectionView.collectionViewLayout = tagCellLayout

I know you might write the lots of code for this, but it would be helpful greatly and even you can customize to different layout alignments.

Ruban4Axis · Answer 2 · 2018-12-05T06:27:45.813

1

func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {

    return (ArrayName[indexPath.row] as NSString).size(withAttributes: nil)
}

Rather than giving Cell Fixed Size in an Array there is a way to find label size in sizeForItemAtIndexPath return the size of the text So it will find the size and work

edited Dec 05 '18 at 06:27

answered Dec 05 '18 at 06:18

Ruban4Axis

821
6
27

Hi thanks for your answer. But while execute the codes the labels are overlapping each others I think need some more helps...please – Angel F Syrus Dec 05 '18 at 06:51

Change UICollectionView cell X position - swift

2 Answers2