Outline UILabel text in UILabel Subclass

问题

I'm trying hard to find a way to simply add an outline/stroke/contour to my UILabel text. Talking about a stroke around the letters of the text not around the background of a UILabel.

I'm using swift 3 and I'd like to outline my text directly into my subclass: UILabel.

I found multiple answers suggesting this way to do things :

let strokeTextAttributes = [
        NSStrokeColorAttributeName : UIColor.black,
        NSForegroundColorAttributeName : UIColor.white,
        NSStrokeWidthAttributeName : -4.0,
        NSFontAttributeName : UIFont.boldSystemFont(ofSize: 30)
    ]

    self.attributedText = NSMutableAttributedString(string: self.text!, attributes: strokeTextAttributes)

But the thing is that it doesn't work. My text is still the same with no outline...

Could anyone help me here ? That would be a great thing :)

Thanks a lot. Cheers guys.

回答1:

Here you have class with implementation, copy and paste to playgrond for test:

    class StrokedLabel: UILabel {

        var strockedText: String = "" {
            willSet(newValue) {
                let strokeTextAttributes = [
                    NSStrokeColorAttributeName : UIColor.black,
                    NSForegroundColorAttributeName : UIColor.white,
                    NSStrokeWidthAttributeName : -4.0,
                    NSFontAttributeName : UIFont.boldSystemFont(ofSize: 30)
                    ] as [String : Any]

                let customizedText = NSMutableAttributedString(string: newValue,
                                                               attributes: strokeTextAttributes)


                attributedText = customizedText
            }
        }
    }


//////////// PLAYGROUND IMPLEMENTATION PART /////////
    let text = "Stroked text"

// UILabel subclass initialization
    let label = StrokedLabel(frame: CGRect(x: 0, y: 0, width: 200, height: 50))
// simple assign String to 'strockedText' property to see the results
    label.strockedText = text

    label.backgroundColor = UIColor.white


    label

Swift 4.2

import UIKit

class StrokedLabel: UILabel {

var strockedText: String = "" {
    willSet(newValue) {
        let strokeTextAttributes : [NSAttributedString.Key : Any] = [
            NSAttributedString.Key.strokeColor : UIColor.black,
            NSAttributedString.Key.foregroundColor : UIColor.white,
            NSAttributedString.Key.strokeWidth : -4.0,
            NSAttributedString.Key.font : UIFont.boldSystemFont(ofSize: 30)
            ] as [NSAttributedString.Key  : Any]

        let customizedText = NSMutableAttributedString(string: newValue,
                                                       attributes: strokeTextAttributes)


        attributedText = customizedText
    }
}

}

//////////// PLAYGROUND IMPLEMENTATION PART /////////
  let text = "Stroked text"

  // UILabel subclass initialization
  let label = StrokedLabel(frame: CGRect(x: 0, y: 0, width: 200, height: 50))
  // simple assign String to 'strockedText' property to see the results
  label.strockedText = text

  label.backgroundColor = UIColor.clear


  label

Maybe refactoring for this class will be welcomed, but should work for you at this form

As you can see usage is very convenient. 👾

回答2:

This code works for me.

Swift 3

let strokeTextAttributes = [
  NSStrokeColorAttributeName : UIColor.black,
  NSForegroundColorAttributeName : UIColor.white,
  NSStrokeWidthAttributeName : -4.0,
  NSFontAttributeName : UIFont.boldSystemFont(ofSize: 30)
] as [String : Any]

myLabel.attributedText = NSMutableAttributedString(string: "Test me i have color.", attributes: strokeTextAttributes)

---

---

---

Swift 4.2 & 5.1

let strokeTextAttributes = [
  NSAttributedString.Key.strokeColor : UIColor.red,
  NSAttributedString.Key.foregroundColor : UIColor.white,
  NSAttributedString.Key.strokeWidth : -4.0,
  NSAttributedString.Key.font : UIFont.boldSystemFont(ofSize: 30)]
  as [NSAttributedString.Key : Any]

labelOutLine.attributedText = NSMutableAttributedString(string: "Your outline text", attributes: strokeTextAttributes)

---

回答3:

@anandnimje answer converted to Swift 4.2 and wrapped it into a function:

public func stroke(font: UIFont, strokeWidth: Float, insideColor: UIColor, strokeColor: UIColor) -> [NSAttributedStringKey: Any]{
    return [
        NSAttributedStringKey.strokeColor : strokeColor,
        NSAttributedStringKey.foregroundColor : insideColor,
        NSAttributedStringKey.strokeWidth : -strokeWidth,
        NSAttributedStringKey.font : font
        ]
}

Usage:

label.attributedText = NSMutableAttributedString(string: "Hello World", 
attributes: stroke(font: UIFont(name: "SourceSansPro-Black", size: 20)!, 
strokeWidth: 4, insideColor: .white, strokeColor: .black))

Make sure you have the right name for your UIFont, else it crashes. Should never be a problem if you have the right name.

回答4:

Below is what I used in my App written in Swift 4.1

Swift 4.x

let strokeTextAttributes: [NSAttributedStringKey: Any] = [
    NSAttributedStringKey.strokeColor: UIColor.black,
    NSAttributedStringKey.foregroundColor : UIColor.white,
    NSAttributedStringKey.strokeWidth : -3.0,
    NSAttributedStringKey.font : UIFont.boldSystemFont(ofSize: 18)
]

回答5:

Your code works for me if I set the type of the attributes dictionary, like this:

let strokeTextAttributes: [String: Any] = [
  // etc...
]

Maybe that's all your missing?

来源：https://stackoverflow.com/questions/40575408/outline-uilabel-text-in-uilabel-subclass