10

How do I add a black outline to my white UILabel text?

Peter Mortensen
  • 30,738
  • 21
  • 105
  • 131
hgpl
  • 869
  • 4
  • 11
  • 20

4 Answers4

10

One option is to set the shadow, which might not be exactly what you want, but achieves a similar effect. You can manually adjust the offset:

UILabel *myLabel = ...;
lbl.shadowColor = [UIColor whiteColor];
lbl.shadowOffset = CGSizeMake(0, -1.0);

Please note that you can also define this in Interface Builder for your UILabel.

shadow http://i.minus.com/jbiG0jVdOxJbgh.png

If this is not enough for you check out this blog post which deals with subclassing UILabel to get a glow effect:

glow
(source: redrobotstudios.com)

Glorfindel
  • 21,988
  • 13
  • 81
  • 109
Besi
  • 22,579
  • 24
  • 131
  • 223
  • Doing this it this way either adds a fuzzy outline, or the stroke/outline is offset. See this link for a great solution: http://stackoverflow.com/a/15877054/254598 – Maurizio Aug 14 '13 at 22:17
6

Disclosure: I'm the developer of THLabel.

I've released a UILabel subclass a while ago, which allows an outline in text and other effects. You can find it here: https://github.com/tobihagemann/THLabel

I'm using Core Text and Core Graphics to achieve the effect.

tobihagemann
  • 601
  • 8
  • 15
2

For iOS5, the usual way is to use CoreGraphics to set fill/stroke and then render the graphics. It can be pretty tricky to get the alignment correct for all font sizes though.

I recommend looking at my solution here. You can either use it straight (it has diffuse shadows as well), or simply pick out the code that does the outline. For iOS6 there is a neater (smaller) solution which works even better. Look here.

Nuoji
  • 3,438
  • 2
  • 21
  • 35
  • 1
    iOS6 is out now, could you tell us about the neater solution ? I could not figure it out. – NewUser_ Sep 21 '12 at 04:30
  • Yes @Nuoji , I'm also interested in knowing about that iOS 6 solution. – flainez Oct 06 '12 at 17:20
  • As you've seen I've updated my reply with a link to the iOS 6 solution. – Nuoji Nov 14 '12 at 18:12
  • This solution is very slow fore fonts like Chalkduster – jjxtra Jan 22 '13 at 00:10
  • @PsychoDad - which one, iOS5 or iOS6 solution? – Nuoji Mar 02 '13 at 09:05
  • Only have tested on iOS 6 device – jjxtra Mar 02 '13 at 16:54
  • @PsychoDad so you're using the iOS6 version then? In the case of both my solutions, my complete versions of these are extremely conservative when it comes to requesting a redraw of the graphics for exactly this reason. You should never request a redraw unless the text really is updated, or this will be dead slow. – Nuoji Mar 21 '13 at 21:47
1

I am sure this code will solve your problem.

In KSLabel.m class see this line of code 

// Outline color
self.textColor = [UIColor whiteColor];

change it to 

self.textColor = [UIColor blackColor];

and you will see the black border of the text.

Harsh Mehrotra
  • 65
  • 10