TextLabel Cut off in ScrollView

Question

I have a text label containing dynamic text inside of a scrollview. A few lines of text are being cut off from the bottom of the label. I've set everything up in Storyboard using auto layout.

I've tried toggling isScrollingEnabled in ViewDidLoad on the UIScrollView per another post to no avail.

I've also tried removing the bottom constraint on the text label and padding it

I've narrowed down the issue by process of elimination to an extension I'm using to change the font in the HTML as I'm working with an html attributed string. I can't figure out why this is cutting the text off, sometimes just a couple lines, sometimes the majority of the content, and sometimes all of the content is missing

extension NSAttributedString {

  func changeHTMLFont(_ text: NSAttributedString) -> NSAttributedString {
  let newAttributedString = NSMutableAttributedString(attributedString: (text))
  newAttributedString.enumerateAttribute(NSAttributedStringKey.font, in: NSMakeRange(0, newAttributedString.length), options: []) { value, range, stop in
  guard let currentFont = value as? UIFont else {
  return
  }
  //USE FOR FACE OPTIONS
  let fontDescriptor = currentFont.fontDescriptor.addingAttributes([UIFontDescriptor.AttributeName.family: "Optima", UIFontDescriptor.AttributeName.face: "Bold"])
  //let fontDescriptor = currentFont.fontDescriptor.addingAttributes([UIFontDescriptorFamilyAttribute: "Optima"])
  if let newFontDescriptor = fontDescriptor.matchingFontDescriptors(withMandatoryKeys: [UIFontDescriptor.AttributeName.family]).first {
  let newFont = UIFont(descriptor: newFontDescriptor, size: 32.0) //use size: currentFont.pointSize for default font size
  newAttributedString.addAttributes([NSAttributedStringKey.font: newFont], range: range)
  }
  }
  return newAttributedString
  }

}

Storyboard Hierarchy:

UITextLabel Constraints (Superview being the UIScrollView):

UPDATED IMAGES:

View of screen before scrolling:

View of screen when reaching bottom of label:

score 3 · Answer 1 · answered Dec 17 '17 at 16:11

3

A scrollview needs to have a definitive content size. To do that, its subviews should have width/height (at least one of them).

You can set width of you UILabel to a screen width (minus whatever margin you want). And set its height to any default value, set height constraint priority to 950. Then set UILabel's vertical content hugging and compression priority to 1000.

answered Dec 17 '17 at 16:11

Senõr Ganso

1,694
16
23

Thanks very much for that. I set the missing constraint (height) and the view didn't scroll, then I realized I didn't set the hugging and compression priorities. Once I did that, the view scrolled, but the text is still cut off – froggomad Dec 17 '17 at 18:40
I added images of the views to make sure we're on the same page... I think we are – froggomad Dec 17 '17 at 19:17
Can you append the project? – Senõr Ganso Dec 17 '17 at 19:24
Is your stack overflow username the same on GitHub? Happy to add you as a collaborator – froggomad Dec 17 '17 at 19:43
Yeah, it's Demosthese – Senõr Ganso Dec 17 '17 at 19:44
Your label's height is constrained to its superview (which is the scrollView). You should give it its own height (say, 44). – Senõr Ganso Dec 17 '17 at 19:52
Thanks, I had tried that and changed it back to the way I'm used to doing it. The text is still cut off – froggomad Dec 17 '17 at 20:55
I see it's only the top result out of the 1st 10, probably due to it's length. It was every result prior to this, so thanks :) – froggomad Dec 17 '17 at 21:06
I noticed after viewing several results that approximately 1/5 are affected by this issue still. I've narrowed it down to an extension I'm using to change the font, but can't figure out why it's causing text to disappear from view. I updated my question – froggomad Jan 06 '18 at 16:38

trndjc · Answer 2 · 2017-12-17T17:18:58.377

I've never used storyboard so I couldn't tell you what boxes to check but you don't need to explicitly set any heights in a scroll view if you're using autolayout correctly (unless of course if you have views that need heights)—not the content size, not dynamic labels, nothing.

As long as the UILabel (or whatever is the bottom-most view in the scroll view) is anchored to the bottom of the scroll view, you're fine.

someLabel.bottomAnchor.constraint(equalTo: scrollView.bottomAnchor).isActive = true

If you've also properly anchored the top-most view to the top of the scroll view, autolayout will handle the content size for you (there are more rules but this is the general premise). As for the label, let autolayout size that for you as well.

someLabel.text = someLongString
someLabel.numberOfLines = 0
someLabel.translatesAutoresizingMaskIntoConstraints = false
scrollView.addSubview(someLabel)
someLabel.leadingAnchor.constraint(equalTo: scrollView.leadingAnchor, constant: 16).isActive = true
someLabel.topAnchor.constraint(equalTo: someView.bottomAnchor, constant: 32).isActive = true
someLabel.widthAnchor.constraint(equalTo: view.widthAnchor, constant: -32).isActive = true
someLabel.sizeToFit()

You need not do anything more than this.

Thanks very much. That's just it, the text label is anchored to the bottom of the scrollview. For grins and giggles I tried setting it in code, but the results are the same :( Content size is being handled properly until the very bottom of the label. One result has >300 lines of text, and only 2 are cut off. Another has 120 and 1 line is cut off It's very odd behavior — froggomad, Dec 17 '17 at 19:07
I added images of the views to make sure we're on the same page... I think we are — froggomad, Dec 17 '17 at 19:17

TextLabel Cut off in ScrollView

2 Answers2