0

I am trying to achieve something similar to desired result

currently, my posts are collected from a database and are put into a label, as such.

Current Label

I have tried using attributed strings and changing the background colors of the text - however, I would like to achieve what is in the picture with spaces between the lines and custom width for each line of text. How would I achieve this effect with dynamic text?

mugx
  • 9,869
  • 3
  • 43
  • 55
Raim Khalil
  • 387
  • 3
  • 19
  • Is the label a set size? – agibson007 Jan 22 '18 at 01:51
  • @agibson007 currently it is, however I don't think this is the correct way to go about it. How can I make the width dynamic for each line as in the question? – Raim Khalil Jan 22 '18 at 02:42
  • You want single label with multiple lines of text and text in each line should have background color having width that covers the text in that line, is that correct? – Akash More Jan 22 '18 at 06:45
  • Try this one: https://stackoverflow.com/a/32863856/6858380 – jay patel Jan 22 '18 at 07:22
  • @jay Patel I am not necessarily looking for something like the link you sent, more like the picture I posted where it gets text from the database and produces lines with dynamic widths and background colors as in the pic. – Raim Khalil Jan 23 '18 at 00:31
  • @agibson007 that would be great if you could guide me as well and if it is in swift! – Raim Khalil Jan 23 '18 at 00:32

1 Answers1

0

Step 1) Break a string up into lines. You have to know the width of your target view. view.bounds.width will do.

See link Question to show you how to break up the text into lines. Pay attention to the question not the answer although that will be part of the answer on the next step.

Step 2) Ditch UILabel. Use UITextView at the very least. Apple changed UILabel to pull down orphan words so even if you get the lines right, a UILabel may not give you the look of what you are doing since it could pull a word down. Use a UITextView and disable scroll, editing disabled, and possibly selection disabled. That will give you intrinsic size to lay it out like a UILabel.

Step 3) Use attributed String to add the backgroundColor/highlighting you seek or use multiple UITextViews(possibly with a UIStackView) or CATextLayers with manual layout to divide your lines up in their own view or layer with the spacing you desire and just use the backgroundColor property. That's up to you. I don't know what you are after.

Sorry I did not show you exactly and only pieced together snippets but this is how you do it. Cheers

agibson007
  • 4,173
  • 2
  • 19
  • 24
  • as in step 3, how would I use the attributed string to change the background so that there will be spaces between each line as shown in the question image? (Any code/ link to guide?) – Raim Khalil Jan 23 '18 at 02:12
  • If you follow the steps you will have the lines. You can add line breaks and use NSAtrributedString to add the highlight. Or like a said you could use a UIStackview and add UITextiview for each line with the spacing you desire. – agibson007 Jan 23 '18 at 11:41