I have a vertical UIStackView with multiple UIButtons stacked one on top of each other. I want the bottom of the view to have rounded corners.
So, I have this:
Where each colored bar is a UIButton, and I want the bottom section (the green button) to have rounded corners. I tried setting the corner radius of the UIStackView, but an error is logged at runtime saying that since the stack view is only a transform view, the corner radius setting has no effect. So next, I tried a solution I found on SO:
extension UIView {
/**
Rounds the given set of corners to the specified radius
- parameter corners: Corners to round
- parameter radius: Radius to round to
*/
func round(corners: UIRectCorner, radius: CGFloat) {
let path = UIBezierPath(roundedRect: bounds, byRoundingCorners: corners, cornerRadii: CGSize(width: radius, height: radius))
let mask = CAShapeLayer()
mask.path = path.CGPath
self.layer.mask = mask
}
}
Then I call:
greenButton.round([.BottomLeft, .BottomRight], radius: 10.0)
Which works, as in it rounds the corners, but it is changing the width of the bottom button. I'm guessing it's got something to do with the fact that applying the mask redraws the view and it messes with the stack's properties somehow?
That's what I'm getting. The space with the red arrows should be filled. The UIStackView distribution property is set to Fill, and I tried setting a width constraint on the green button to always match equal widths with the stack view, but still no success.
I'm stuck, any help will be appreciated. Thanks.