9

How to display superscript % character as string in UIlabel? I know % does not exist in unicode as a superscript but is there is any way we can display % as a superscript instead of using html tags??

rmaddy
  • 314,917
  • 42
  • 532
  • 579
Saikiran Komirishetty
  • 6,525
  • 1
  • 29
  • 36

2 Answers2

21

I found this post on Stackoverflow on superscript styling text using attributed string:

NSAttributedString superscript styling

So using that, I hacked up this demo:

- (void)viewDidLoad
{
    [super viewDidLoad];
    // Do any additional setup after loading the view, typically from a nib.

    UIFont *font = [UIFont fontWithName:@"Helvetica" size:20];

    UILabel *textBlock1 = [[UILabel alloc] initWithFrame:CGRectMake(0, 0, self.view.bounds.size.width, self.view.bounds.size.height / 2.0)];
    textBlock1.backgroundColor = [UIColor colorWithRed:0.9 green:0.9 blue:0.9 alpha:1.0];
    textBlock1.textAlignment = NSTextAlignmentCenter;
    textBlock1.font = font;

    textBlock1.text = @"57%";





    UILabel *textBlock2 = [[UILabel alloc] initWithFrame:CGRectMake(0, self.view.bounds.size.height / 2.0, self.view.bounds.size.width, self.view.bounds.size.height / 2.0)];
    textBlock2.backgroundColor = [UIColor colorWithRed:0.9 green:0.9 blue:0.9 alpha:1.0];
    textBlock2.textAlignment = NSTextAlignmentCenter;

    NSMutableAttributedString *attributedString = [[NSMutableAttributedString alloc] initWithString:@"57%"
                                                                                         attributes:@{NSFontAttributeName: font}];
    [attributedString setAttributes:@{NSFontAttributeName : [UIFont fontWithName:@"Helvetica" size:10]
                                      , NSBaselineOffsetAttributeName : @10} range:NSMakeRange(2, 1)];

    textBlock2.attributedText = attributedString;



    [self.view addSubview:textBlock1];
    [self.view addSubview:textBlock2];
}

The result:

enter image description here

Community
  • 1
  • 1
Zhang
  • 11,549
  • 7
  • 57
  • 87
  • thanks for sharing the source. I have achieved the same using the tutorial http://sketchytech.blogspot.co.uk/2013/12/drawing-nsattributedstrings-with.html suggested by trojanfoe. – Saikiran Komirishetty Jun 20 '14 at 12:12
  • @Zhang Can you make a small translation into Swift? Since some commands are changed and I try hard to archive the same. Thanks – Nicholas Jun 02 '15 at 08:53
  • @Nicholas it's pretty much the exact same thing in Swift, not sure what you mean by some commands are changed, but it's a pretty copy paste/convert translation.... – TheCodingArt Jan 05 '16 at 14:32
  • 2
    I also want to point out that NSBaselineOffsetAttributeName is not good for all scenarios, because you have to set a magic number, if you ever set a min/max font size this will not scale right. – TheCodingArt Jan 05 '16 at 14:33
  • @TheCodingArt Thanks, I'll give it a second try. My main issues are related to this kind of use in other contexts such as uiswitches and uibuttons not only uilabels – Nicholas Jan 05 '16 at 21:05
1

For a simple to use Swift solution, you might want to checkout HandyUIKit. After importing it into your project (e.g. via Carthage – see instructions in README) you can do something like this:

import HandyUIKit

"57^{%}".superscripted(font: UIFont.systemFont(ofSize: 20, weight: .medium))

This line will return an NSAttributedString which will look exactly like what you're looking for. Just assign it to a UILabels attributedText property and that's it!

If you're looking for subscripting a text, simply use subscripted(font:) instead. It will recognize structures like CO_{2}. There's also superAndSubscripted(font:) if you want to combine both.

See the docs for more information and additional examples.

Jeehut
  • 20,202
  • 8
  • 59
  • 80