CODEWITHSUNDEEP
iosswiftuibuttonautolayoutconstraints
mclovin
mclovin

Reputation: 107

UIButton as subview programmatically constraint

I have one UIScrollView (IBOutlet) with success constraint inside a storyboard. then I programmatically create UIButton and put them as a subview to UIScrollView. how do I programmatically set these UIButton constraints so their height and size would tally with their super view? 

class ViewController: UIViewController {

@IBOutlet weak var aScrollView: UIScrollView!


override func viewDidLoad() {
    super.viewDidLoad()
    // Do any additional setup after loading the view, typically from a nib.

    var xCoord: CGFloat = 5
    let yCoord: CGFloat = 5
    let buttonWidth:CGFloat = 100
    let buttonHeight: CGFloat = 100

    let gapBetweenButtons: CGFloat = 10


    var itemCount = 0

    // MARK: - filter buttons
    for i in 0..<6 {

        itemCount = i

        let aButton = UIButton(type: .custom)
        aButton.frame = CGRect(x: xCoord, y: yCoord, width: buttonWidth, height: buttonHeight)
        aButton.backgroundColor = UIColor.blue
        aButton.layer.cornerRadius = aButton.frame.size.width / 2
        aButton.clipsToBounds = true

        xCoord += buttonWidth + gapBetweenButtons

        aScrollView.addSubview(aButton)   
    }
}

Upvotes: 0

Views: 2507

Answers (3)

caldera.sac
caldera.sac

Reputation: 5088

This is how to do it. I made a video tutorial for you add unbutton programmatically to scrollview in iOS, swift. please refer the link.

  1. add a scrollview (add constraints -> top, bottom, left, right).
  2. then add a view to your scroll view (add constraints -> top, bottom, left, right, width, height and set width and height as you need. explain in the video)
  3. add those two views as subviews.
  4. then add the button and its constraints programmatically.

follow the video tutorial. add UIButton(outlet) to scrollview programmatically

Upvotes: 0

javimuu
javimuu

Reputation: 1859

Change your code to: 

    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view, typically from a nib.

        var xCoord: CGFloat = 5
        let yCoord: CGFloat = 5

        let gapBetweenButtons: CGFloat = 10


        let buttonCount = 6
        let buttonWidth = (aScrollView.frame.width - CGFloat(buttonCount - 1) * gapBetweenButtons - xCoord - xCoord) / CGFloat(buttonCount) // - (2 * xCoord) = - (margin left + margin right).
        let buttonHeight = buttonWidth

        var itemCount = 0

        // MARK: - filter buttons
        for i in 0..<buttonCount {

            itemCount = i

            let aButton = UIButton(type: .custom)
            aButton.frame = CGRect(x: xCoord, y: yCoord, width: buttonWidth, height: buttonHeight)
            aButton.backgroundColor = UIColor.blue
            aButton.layer.cornerRadius = aButton.frame.size.width / 2
            aButton.clipsToBounds = true

            xCoord += buttonWidth + gapBetweenButtons

            aScrollView.addSubview(aButton)
        }
    }

Upvotes: 0

Prema Janoti
Prema Janoti

Reputation: 856

Try this --

This is just an idea about how to add constraint programmatically.

For more understanding you can go through below link - https://developer.apple.com/reference/appkit/nslayoutanchor

 let myButton = UIButton()
 self.aScrollView.addSubview(myButton)

 self.view.translatesAutoresizingMaskIntoConstraints = false
 let margins = self.view.layoutMarginsGuide
 myButton.leadingAnchor.constraint(equalTo: forView. aScrollView.leadingAnchor, constant: 5).active = true
 myButton.topAnchor.constraint(equalTo: forView. aScrollView.topAnchor, constant: 5).active = true
 myButton.heightAnchor.constraintEqualToConstant(100.0).active = true
 myButton.widthAnchor.constraintEqualToConstant(100.0).active = true

Upvotes: 1

Related Questions