Hide button in stackview break the layout in tableview

Question

I have a tableviewcell which has two button inside stackview. One of the button name is topupButton and the other one is details button. Topupbutton hidden if one flag is true. You can find below the code.

 self.topupButton.isHidden = self.selectedSim.operator_?.is_prepaid ?? false

When I hide the topup button details button should stretch in stackview. But in one of my cell, it's not in correct size. When I do visual debug I saw that the frame of button is correct but background is not stretch through the button. You can see the image's below.

I've tried layoutsubviews, setneedsdisplay, layoutifneeded for cell, stackview and buttons. Nothing changed. You can also find my stackview config below.

I've added the constraint between the stackview and the contentview @nayem — Alihan
– Alihan, Commented Dec 23, 2019 at 8:16
It seems the constraints are correct. Did you use any kind of CALayer on the buttons? — nayem
– nayem, Commented Dec 23, 2019 at 8:19
I've used UIBezierPath for round the button corner. I did layer.layoutIfNeeded, layer.layoutSublayers, layer.setNeedsLayout but it's not solved @nayem — Alihan
– Alihan, Commented Dec 23, 2019 at 8:22
Can you try if the other button fills the stack view or not by commenting out the UIBeizerPath related code? — nayem
– nayem, Commented Dec 23, 2019 at 8:24
Yeap if I remove the code it's working perfectly. But I need rounded corner button :) @nayem — Alihan
– Alihan, Commented Dec 23, 2019 at 8:28

nayem · Accepted Answer · 2019-12-23 09:31:59Z

As per your comments, it's evident that the usage of UIBeizerPath created the issue in the first place. It's because:

Auto-Layout works best with UIView. But layers don't auto-resize.

Look at this question & answer for more on the above lines.

As you are likely adding mask layer to the buttons, you need to find the ideal method for that addition of mask layer. And according to this answer, the correct place would be draw(_:). So basically you will do something like below:

class TableViewCell: UITableViewCell { . . . override func draw(_ rect: CGRect) { super.draw(rect) topupButton.roundButton() detailsButton.roundButton() } . . . } // extension for rounding button with UIBezierPath extension UIButton { func roundButton(){ let size = CGSize(width: bounds.width / 2, height: bounds.width / 2) let maskPath = UIBezierPath(roundedRect: bounds, byRoundingCorners: .allCorners, cornerRadii: size) let maskLayer = CAShapeLayer() maskLayer.frame = bounds maskLayer.path = maskPath.cgPath layer.mask = maskLayer } }

Collectives™ on Stack Overflow

Hide button in stackview break the layout in tableview

1 Answer 1

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Linked

Related