UILabel custom Text

Question

How can I make this text using single UILabel or give any other solution to achieve this design.

Does this answer your question? [How do you use NSAttributedString?](https://stackoverflow.com/questions/3482346/how-do-you-use-nsattributedstring) — burnsi, Mar 15 '22 at 13:40
It is just change foreground color I want some specific text into capsule style. — Murtaza Mehmood, Mar 15 '22 at 13:44
Does this answer your question? [convert a String to NSAttributedString in a specific manner](https://stackoverflow.com/questions/37768686/convert-a-string-to-nsattributedstring-in-a-specific-manner) — timbre timbre, Mar 15 '22 at 14:10
Background color & text color, that's easy... Round background color, that's harder, since there is no built in option for that. If you target only IOS15, maybe with AttachmentView it could be simpler. Else, see https://stackoverflow.com/questions/16362407/nsattributedstring-background-color-and-rounded-corners or maybe find a lib that does it. — Larme, Mar 15 '22 at 14:28

score 1 · Accepted Answer · answered Mar 15 '22 at 15:27

You can use NSTextAttachment for that behaviour. I modify this for position of attachment.

All code :

  @IBOutlet weak var lbl: UILabel!

override func viewDidLoad() {
    super.viewDidLoad()
   
    let string = "Urban points users average montly saving is "

    
    let normalNameString = NSMutableAttributedString.init(string: string)

    let attachment = NSTextAttachment()
    attachment.image = imageHelper.pgImage(textValue: "QAR 115 ", lbl: lbl)
    
    attachment.bounds = CGRect(x: 0, y: (lbl.font.capHeight - attachment.image!.size.height).rounded() / 2, width: attachment.image!.size.width, height: attachment.image!.size.height)

    
    normalNameString.append(NSAttributedString(attachment: attachment))
    normalNameString.append(NSAttributedString(string: "You have saved "))
    
    let attachment2 = NSTextAttachment()
    attachment2.image = imageHelper.pgImage(textValue: "QAR 29",textColor: UIColor.yellow,backgroundColor: UIColor.black , lbl: lbl)
    attachment2.bounds = CGRect(x: 0, y: (lbl.font.capHeight - attachment2.image!.size.height).rounded() / 2, width: attachment2.image!.size.width, height: attachment2.image!.size.height)
   
    normalNameString.append(NSAttributedString(attachment: attachment2))
    normalNameString.append(NSAttributedString(string: " this month"))

    lbl.attributedText = normalNameString
}

}

class imageHelper{
static func pgImage(textValue:String,textColor : UIColor = UIColor.white , backgroundColor : UIColor = UIColor.red,lbl : UILabel) ->UIImage{
    let label = UILabel(frame: CGRect(x: 0, y: 0, width: (textValue as NSString).size(withAttributes: [NSAttributedString.Key.font : lbl.font!]).width, height: lbl.frame.size.height))
    label.font = lbl.font
    label.textAlignment = .center
    label.textColor = textColor
    label.backgroundColor = backgroundColor
    label.layer.borderColor = UIColor.darkGray.cgColor
    label.layer.borderWidth = 1
    label.layer.cornerRadius = label.frame.size.height/2
    label.layer.masksToBounds = true
    label.text = textValue
    label.numberOfLines = 1

    UIGraphicsBeginImageContextWithOptions(label.bounds.size, false,UIScreen.main.scale)
    label.layer.render(in: UIGraphicsGetCurrentContext()!)

    let image = UIGraphicsGetImageFromCurrentImageContext()
    UIGraphicsEndImageContext()
    return image!
}
}

And the result is :

UILabel custom Text

1 Answers1