Get height of UIView based on specific width before showing view

Question

I have a UIView which I have designed in Interface Builder. It basically consists out of a header image and some text (UILabel) below. The view is being shown modally with a custom Transition and doesn't fill the whole screen.

There is like a 20 pixels margin on the left and right and 40 px on the top. The UILabel gets filled with some text that's coming from the web. What I want do do, is to find (or should I say predict) the height of the whole view for a specific width. How can I do that?

The top image has a fixed height, is pinned to top, left and right and the UILabel is also pinned to top, left, right and bottom — gasparuff, Dec 21 '16 at 13:06
can you please show some image ? have you check this answer ? http://stackoverflow.com/a/36862795/4910767 — Badal Shah, Dec 23 '16 at 06:18

sash · Answer 1 · 2017-06-07T15:25:34.417

I had similar problem, but instead of calculating font size and image height you can use this UIView extension that will autosize your view with max width:

extension UIView {

    func autosize(maxWidth: CGFloat) {

        translatesAutoresizingMaskIntoConstraints = false

        let dummyContainerView = UIView(frame: CGRect(x: 0, y: 0, width: maxWidth, height: 10000000))
        dummyContainerView.addSubview(self)
        dummyContainerView.topAnchor.constraint(equalTo: topAnchor, constant: 0).isActive = true
        dummyContainerView.leftAnchor.constraint(equalTo: leftAnchor, constant: 0).isActive = true
        dummyContainerView.rightAnchor.constraint(equalTo: rightAnchor, constant: 0).isActive = true

        setNeedsLayout()
        layoutIfNeeded()

        removeFromSuperview()

        frame = CGRect(x: 0, y: 0, width: frame.width, height: frame.height)

        translatesAutoresizingMaskIntoConstraints = true
    }
}

Using this approuch you don't have to worry about your content inside the view.

To use it:

let customView: CustomView = ... //create your view
... // configure all data on your view, e.g. labels with correct text
customView.autosize(maxWidth: 150) // resize your view 
view.addSubview(customView) // add your view to any view

Alberto Scampini · Accepted Answer · 2016-12-22T08:09:14.740

You need to have both the picture and the label before calculating the aspected size. I guess you should use something like this (maybe adding the vertical inter-distance between the imageView and the Label to the sum, and maybe removing the lateral margins from the width):

objective C :

- (CGFloat)preferredHeightFromWidth:(CGFloat)width text:(NSString *)text font:(UIFont *)font image:(UIImage *)image
{
    // Calculate label height
    CGFloat labelHeight = [text
                           boundingRectWithSize:CGSizeMake(width, 10000)
                           options:NSStringDrawingUsesLineFragmentOrigin
                           attributes:@{NSFontAttributeName:font}
                           context:[[NSStringDrawingContext alloc] init]
                           ].size.height;

    // Calculate image height
    CGFloat ratio = image.size.height/ image.size.width;
    CGFloat imageHeight = (ratio * width);

    // Do the sum
    return labelHeight + imageHeight;
}

Swift:

func preferredHeight(width: CGFloat, text: NSString, font: UIFont, image: UIImage) -> CGFloat {
    // Calculate Label Height
    let labelRect = text.boundingRect(
        with: CGSize.init(width: width, height: 10000),
        options: .usesLineFragmentOrigin,
        attributes: [NSFontAttributeName : font],
        context: NSStringDrawingContext())
    let labelHeight = labelRect.height

    // Calculate Image Height
    let ratio = image.size.height / image.size.width
    let imageHeight = ratio / width

    // Calculate Total Height
    let height = labelHeight + imageHeight

    // Return Height Value
    return height
}

(Thanks to Christopher Hannah for swift version)

score 0 · Answer 3 · answered Dec 21 '16 at 15:55

Here is the same answer as Alberto, but I have changed it into Swift 3.

func preferredHeight(width: CGFloat, text: NSString, font: UIFont, image: UIImage) -> CGFloat {
    // Calculate Label Height
    let labelRect = text.boundingRect(
        with: CGSize.init(width: width, height: 10000),
        options: .usesLineFragmentOrigin,
        attributes: [NSFontAttributeName : font],
        context: NSStringDrawingContext())
    let labelHeight = labelRect.height

    // Calculate Image Height
    let ratio = image.size.height / image.size.width
    let imageHeight = ratio / width

    // Calculate Total Height
    let height = labelHeight + imageHeight

    // Return Height Value
    return height
}

Get height of UIView based on specific width before showing view

3 Answers3