CODEWITHSUNDEEP
iosswiftuiview
Tonespy
Tonespy

Reputation: 3407

Creating a centered View with Labels

I am trying to create a UIView A that's has a UIView B which is centered in UIView A and holds two UILabel A & B, but it's not centering the UILabels. This is my code

private func generateView(header: String, below: String) {
    let size: CGSize = self.view.frame.size
    let mainView = UIView(frame: CGRectMake(0, 0, size.width, size.height))
    mainView.backgroundColor = UIColor.clearColor()
    let contentHolderView = UIView(frame: CGRectMake(0, 0, 350, 172))
    contentHolderView.backgroundColor = UIColor.clearColor()
    let headerLabel = UILabel(frame: CGRectMake(38, 24, 298, 34))
    let belowLabel = UILabel(frame: CGRectMake(14, 66, 344, 83))
    belowLabel.numberOfLines = 0

    headerLabel.text = header
    belowLabel.text = below

    headerLabel.textColor = UIColor.blackColor()
    belowLabel.textColor = UIColor.blackColor()

    headerLabel.font = UIFont(name: "BrandonGrotesque-Bold", size: 30)
    belowLabel.font = UIFont(name: "BrandonGrotesque-Light", size: 20)

    headerLabel.textAlignment = .Center
    belowLabel.textAlignment = .Center

    contentHolderView.addSubview(headerLabel)
    contentHolderView.addSubview(belowLabel)
    contentHolderView.center = mainView.center
    mainView.addSubview(contentHolderView)
    mainView.center = self.view.center
    self.view.addSubview(mainView)
}

And this is what I'm trying to achieve and this is what I'm getting and what I'm trying to achieve

My Achievement

Upvotes: 0

Views: 44

Answers (1)

Paulw11
Paulw11

Reputation: 115051

Rather than attempting to code frame values directly, I would suggest you adopt auto layout. Here is the basis of a UIView subclass that does what you want (I haven't bothered with the fonts, but you can add that easily) -

import UIKit

@IBDesignable
class MyView: UIView {

    var headerLabel:UILabel!
    var bodyLabel:UILabel!

    override init(frame: CGRect) {
        super.init(frame: frame)
        self.addLabels()
    }

    required init?(coder aDecoder: NSCoder) {
        super.init(coder: aDecoder)
        self.addLabels()
    }


    func addLabels() {

        self.translatesAutoresizingMaskIntoConstraints=false

        self.headerLabel=UILabel()
        self.headerLabel.translatesAutoresizingMaskIntoConstraints=false
        self.headerLabel.textAlignment=NSTextAlignment.Center

        self.addSubview(self.headerLabel)

        self.bodyLabel=UILabel()
        self.bodyLabel.translatesAutoresizingMaskIntoConstraints=false
        self.bodyLabel.numberOfLines=0
        self.bodyLabel.textAlignment=NSTextAlignment.Center

        self.addSubview(self.bodyLabel)
    }

    override func updateConstraints() {
        self.addConstraint(NSLayoutConstraint(item: self.headerLabel, attribute: NSLayoutAttribute.Top, relatedBy: NSLayoutRelation.Equal, toItem: self, attribute: NSLayoutAttribute.Top, multiplier: 1.0, constant: 24))

        self.addConstraint(NSLayoutConstraint(item: self, attribute: NSLayoutAttribute.CenterX, relatedBy: NSLayoutRelation.Equal, toItem: self.headerLabel, attribute: NSLayoutAttribute.CenterX, multiplier: 1.0, constant: 0))

        self.addConstraint(NSLayoutConstraint(item: self, attribute: NSLayoutAttribute.CenterX, relatedBy: NSLayoutRelation.Equal, toItem: self.bodyLabel, attribute: NSLayoutAttribute.CenterX, multiplier: 1.0, constant: 0))

        self.addConstraint(NSLayoutConstraint(item: self, attribute: NSLayoutAttribute.Bottom, relatedBy: NSLayoutRelation.Equal, toItem: self.bodyLabel, attribute: NSLayoutAttribute.Bottom, multiplier: 1.0, constant: 24))

        self.addConstraint(NSLayoutConstraint(item: self.bodyLabel, attribute: NSLayoutAttribute.Top, relatedBy: NSLayoutRelation.Equal, toItem: self.headerLabel, attribute: NSLayoutAttribute.Bottom, multiplier: 1.0, constant: 12))

        self.addConstraint(NSLayoutConstraint(item: self, attribute: NSLayoutAttribute.LeadingMargin, relatedBy: NSLayoutRelation.Equal, toItem: self.bodyLabel, attribute: NSLayoutAttribute.Leading, multiplier: 1.0, constant: 0))
        self.addConstraint(NSLayoutConstraint(item: self, attribute: NSLayoutAttribute.TrailingMargin, relatedBy: NSLayoutRelation.Equal, toItem: self.bodyLabel, attribute: NSLayoutAttribute.Trailing, multiplier: 1.0, constant: 0))

        super.updateConstraints()
    }

    override func prepareForInterfaceBuilder() {
        self.headerLabel.text="Header"
        self.bodyLabel.text="Lorum Ipsum Lorum Ipsum Lorum Ipsum Lorum Ipsum Lorum Ipsum Lorum Ipsum Lorum Ipsum Lorum Ipsum Lorum Ipsum Lorum Ipsum Lorum Ipsum Lorum Ipsum Lorum Ipsum Lorum Ipsum Lorum Ipsum "
    }

}

Upvotes: 1

Related Questions