8

I'm not sure if I understand UIStackView correctly. I have a UIStackView in a UITableViewCell. It contains 3 UILabel and is set to align and distribute Fill.

When my first labels text is not very long, it looks all good. The second and third label take up as much space as they need and they are aligned to the right. The first label takes up the rest of the space.

However, when the first label contains a lot of text, it pushes the other two labels out of the visible area. What do I have to do to make sure the second and third label are always visible and take as much space as they need to display their content. The first label should always take up the rest of the available space and then truncate its text with "..."

This is my configuration in the Storyboard:

UIStackView configuration

And this is how the result looks like in the TableView:

UIStackView result in UITableView

Bhavin Ramani
  • 3,221
  • 5
  • 30
  • 41
xxtesaxx
  • 6,175
  • 2
  • 31
  • 50

2 Answers2

18

I tried the others solutions mentioned here and found them to be to difficult or unpractical. I didn't want to setup and change layout constraints programmatically so I continued playing around with the values. In the end, I found a very simple solution which does exactly what I wanted.

All I had to do was, setting the "Content Compression Resistance Priority" to be lower on my first label. Second and third label have 750 and also they have 251 and 252 for the "Content Hugging Priority" whereas the first label has a value of 749 and 250. This gives me exactly the results I wanted.

Thank you guys anyways. Sometimes I feel like I find solutions to my problems a lot faster after asking it here. I hope my answer will help somebody else in the future.

This: enter image description here

Gives me this as a result (notice that I set "isHidden" to true for second and third label on the third row): enter image description here

xxtesaxx
  • 6,175
  • 2
  • 31
  • 50
1

you may consider placing those 3 views directly to the contentView instead of using UIStackView, and set the first label trailing to the second's

Chaolong_Liao
  • 246
  • 1
  • 7
  • I tried it but when I then set the isHidden property of the second and/or third label to true, the first label doesn't take up the rest of the space where as when I use a UIStackView, it automatically does take up the rest of the space but maybe I just misconfigured my LayoutConstraints... I somehow hoped that the UIStackView is similar to the LinearLayout in Android – xxtesaxx Nov 23 '16 at 07:04
  • When you set the right views hidden,simultaneously change the trailing constrains of the first by your code. – Chaolong_Liao Nov 23 '16 at 07:09
  • To be honest, that sound unnecessarily complicated – xxtesaxx Nov 23 '16 at 10:39
  • Sometimes you have to do this :) – Chaolong_Liao Nov 24 '16 at 01:38
  • Well thanks for your help buddy. If you want a nicer/easier way, check out the other solution I found using the UIStackView. Basically, all I had to do was setting the "Content Compression Resistance Priority" to be lower on my first label :) – xxtesaxx Nov 24 '16 at 02:20