2
votes

I have collectionView inside a view controller. Inside the collectionView cell I have a button. Since there will be several cells each button will have a different location inside the vc. When a button is tapped, how can I get the frame of the button inside the ViewController (not the collectionView)? I want to get it from within the cell itself and not in cellForItem.

No matter which button I tap inside any cell, I tried this below but it always prints out (0.0, 64.0, 0.0, 0.0):

@objc func myButtonTapped() {
    let locationInSuperView = self.convert(myButton.frame, to: nil)
    print(locationInSuperView)
}

Code below:

CollectionViewCell:

class MyCell: UICollectionViewCell{

    lazy var myButton: UIButton = {
        let button = UIButton(type: .system)
        button.translatesAutoresizingMaskIntoConstraints = false
        button.setImage(UIImage(named: "myButton"), for: .normal)
        button.addTarget(self, action: #selector(myButtonTapped), for: .touchUpInside)
        return button
    }()

    override init(frame: CGRect) {
        super.init(frame: frame)

        backgroundColor = .white

        contentView.addSubview(myButton)
        myButton.rightAnchor.constraint(equalTo: self.rightAnchor, constant: -8).isActive = true
        myButton.topAnchor.constraint(equalTo: self.topAnchor, constant: 0).isActive = true
        myButton.heightAnchor.constraint(equalToConstant: 50).isActive = true
        myButton.widthAnchor.constraint(equalToConstant: 50).isActive = true
    }

    @objc func myButtonTapped() {

        let locationInSuperView = self.superview!.convert(myButton.frame, to: nil)
        print(locationInSuperView)
    }
}

ViewController:

ViewController: UIViewController, UICollectionViewDataSource, UICollectionViewDelegateFlowLayout {

    var collectionView: UICollectionView!
    let myCell = "myCell"

    override func viewDidLoad() {
        super.viewDidLoad()

        let layout = UICollectionViewFlowLayout()
        layout.sectionInset = UIEdgeInsetsMake(0, 0, 0, 0)
        layout.scrollDirection = .vertical

        collectionView = UICollectionView(frame: view.frame, collectionViewLayout: layout)
        collectionView.delegate = self
        collectionView.dataSource = self
        collectionView.register(MyCell.self, forCellWithReuseIdentifier: myCell)
        view.addSubview(collectionView)
    }

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

    func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
        let cell = collectionView.dequeueReusableCell(withReuseIdentifier: myCell, for: indexPath) as! MyCell

        return cell
    }

    func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
        return CGSize(width: view.frame.width, height: 50)
    }
}
2
Why you use nil in the convert?Kerberos
@Kerberos you was correct about the nil, thanksLance Samaria

2 Answers

2
votes

Try this code inside cellForItemAt of UICollectionView

cell.myButton.addTarget(self, action: #selector(myButtonTapped), for: .touchUpInside)

@objc func myButtonTapped(_ sender: UIButton) {
    let buttonPosition : CGPoint = sender.convert(sender.bounds.origin, to: self.collectionView)
}
2
votes

Using nil in the conversion was causing the problem. I used the app's window and switched it from nil to window and the problem was resolved.

@objc func myButtonTapped() {

    if let window = UIApplication.shared.keyWindow {
        
        let locationInWindow = self.convert(myButton.frame, to: window)
        print(locationInWindow)
    }
}

Update:

I found another way. It's a little more complicated but it works

// 1. use delegation inside the cell
protocol YourCellDelegate: class {
    func getReferenceTo(cell: YourCell)
}

class YourCell: UICollectionViewCell {

    lazy var someButton: UIButton = {
        // ...
    }()

    // 2. wherever you add someButton to the cell make sure it is a child of the cell's contentView
    func setAnchors() {

        self.contentView.addSubview(someButton)
        // set the x,y,w,h for the button
    }

    // 3. call the delegate in layoutSubviews
    override func layoutSubviews() {
        super.layoutSubviews()

        // 4. *** SUPER IMPORTANT *** call contentView.layoutIfNeeded() first
        contentView.layoutIfNeeded()

        // 5. second call your delegate method here after calling contentView.layoutIfNeeded()
        delegate?.getReferenceTo(cell: self)
    }
}

Inside the class that has your collectionView that conforms the to delegate

extension YourClass: YourCellDelegate {

    func getReferenceTo(cell: UICollectionViewCell) {

        // 6. get a reference to the main UIWindow
        guard let window = UIApplication.shared.windows.first(where: { $0.isKeyWindow }) else { return }

        // 7. get a reference to the button from the cell
        let someButton = cell.someButton

        // 8. call convert(_:) using the window, the button's frame, and the cell's contentView (make sure that the button is a subview of the cell's contentView and not the cell itself -step 2.)
        let buttonFrameInWindow = window.convert(someButton, from: cell.contentView)

        print(buttonFrameInWindow) // will print the button's CGRect in the UIWindow x,y,w,h { 100, 400, 40, 40 }
    }
}