Glowing effect in a UILabel using inner shadow

Question

I am trying to achieve this glowing effect for a UILabel as shown below :

I have subclassed UILabel , and created a custom label class that adds an outer shadow.

Edit : Here's the code i have used for outer shadow/glow in my custom Label class :

- (void)drawTextInRect:(CGRect)rect {
UIColor *insideColor;
UIColor *blurColor;
CGContextRef ctx = UIGraphicsGetCurrentContext();

insideColor =[UIColor colorWithRed:255/255.0 green:255/255.0 blue:191/255.0 alpha:1];
blurColor =[UIColor orangeColor];    


    CGContextSetFillColorWithColor(ctx, insideColor.CGColor);
    CGContextSetShadowWithColor(ctx, CGSizeMake(0, 0), self.glowAmount, blurColor.CGColor);
    CGContextSetTextDrawingMode(ctx, kCGTextFillStroke);

    [self.text drawInRect:self.bounds withFont:self.font lineBreakMode:self.lineBreakMode alignment:self.textAlignment];
}

But this gives me the following result

MyImage

As you can see this lacks the desired effect because of the missing inner shadow. Can anyone suggest how to achieve this?

Thanks!

possible duplicate of [iOS - How to achieve emboss effect for the text on UILabel?](http://stackoverflow.com/questions/8467141/ios-how-to-achieve-emboss-effect-for-the-text-on-uilabel) Rob Mayoff's answer here is fantastic - should get you the inner shadow you need. — jrturton, Jul 24 '12 at 10:40
This uses an UIImage. cant we do it to the UILabel text directly in - (void)drawTextInRect:(CGRect)rect method ? — Nayan Chauhan, Jul 24 '12 at 12:55
@Szwedo : I have edited my question and posted the code m currently using. — Nayan Chauhan, Jul 26 '12 at 06:39

score 0 · Accepted Answer · edited May 23 '17 at 12:01

I referred the answer by Steven XM for Inner Shadow in UILabel . It was a great help.

Here's what i have done to achieve the result but i want to know if this can be more optimized?

-(void)setInnerGlowWithColor:(UIColor *)shadowColor fillColor:(UIColor *)insideColor inRect:(CGRect)rect 
{

    UIFont *font = self.font;
   // UIFont *font = [UIFont fontWithName:@"HelveticaNeue-Bold" size:17];
    CGSize fontSize = [self.text sizeWithFont:font];


    /****    Following are the steps to create an inside shadow ****/

    // STEP 1 :  Create a  image mask of your text.

        CGImageRef mask = [self createMaskWithSize:rect.size shape:^{
        [[UIColor blackColor] setFill];
        CGContextFillRect(UIGraphicsGetCurrentContext(), rect);
        [[UIColor whiteColor] setFill];
        // custom shape goes here
        [self.text drawAtPoint:CGPointMake((self.bounds.size.width/2)-(fontSize.width/2), 0) withFont:font];
        }];


    // STEP 2 : Invert that mask.

        CGImageRef cutoutRef = CGImageCreateWithMask([self blackSquareOfSize:rect.size].CGImage, mask);
        CGImageRelease(mask);

        UIImage *cutout = [UIImage imageWithCGImage:cutoutRef scale:[[UIScreen mainScreen] scale] orientation:UIImageOrientationUp];
        CGImageRelease(cutoutRef);  



     // STEP 3 : Use this inverted mask to draw a shadow around the inside edges of the text.

        CGImageRef shadedMask = [self createMaskWithSize:rect.size shape:^{
        [[UIColor whiteColor] setFill];
        CGContextFillRect(UIGraphicsGetCurrentContext(), rect);
        //****************For inner shadow/glow
        NSLog(@"in custom label---->  %f",self.glowAmount);
        CGContextSetShadowWithColor(UIGraphicsGetCurrentContext(), CGSizeMake(0, 0), self.glowAmount, shadowColor.CGColor);
        [cutout drawAtPoint:CGPointZero];
        }];


    // STEP 4 : Create negative image

        UIGraphicsBeginImageContextWithOptions(rect.size, NO, 0);
        [shadowColor setFill];
        // custom shape goes here
        [self.text drawAtPoint:CGPointMake((self.bounds.size.width/2)-(fontSize.width/2), 0) withFont:font];
        UIImage *negative = UIGraphicsGetImageFromCurrentImageContext();
        UIGraphicsEndImageContext(); 


    // STEP 5 : Create the shadow image

        CGImageRef innerShadowRef = CGImageCreateWithMask(negative.CGImage, shadedMask);
        CGImageRelease(shadedMask);
        UIImage *innerShadow = [UIImage imageWithCGImage:innerShadowRef scale:[[UIScreen mainScreen] scale] orientation:UIImageOrientationUp];
        CGImageRelease(innerShadowRef);


    // STEP 6 : Draw actual text

        [insideColor setFill];
        [self.text drawAtPoint:CGPointMake((self.bounds.size.width/2)-(fontSize.width/2), 0) withFont:font];  


    // STEP 7 : Finally apply the shadow image   

        [innerShadow drawAtPoint:CGPointZero];

}


- (UIImage*)blackSquareOfSize:(CGSize)size {
    UIGraphicsBeginImageContextWithOptions(size, NO, 0);  
    [[UIColor blackColor] setFill];
    CGContextFillRect(UIGraphicsGetCurrentContext(), CGRectMake(0, 0, size.width, size.height));
    UIImage *blackSquare = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();
    return blackSquare;
}


- (CGImageRef)createMaskWithSize:(CGSize)size shape:(void (^)(void))block {
    UIGraphicsBeginImageContextWithOptions(size, NO, 0);  
    block();
    CGImageRef shape = [UIGraphicsGetImageFromCurrentImageContext() CGImage];
    UIGraphicsEndImageContext();  
    CGImageRef mask = CGImageMaskCreate(CGImageGetWidth(shape),
                                        CGImageGetHeight(shape),
                                        CGImageGetBitsPerComponent(shape),
                                        CGImageGetBitsPerPixel(shape),
                                        CGImageGetBytesPerRow(shape),
                                        CGImageGetDataProvider(shape), NULL, false);
    return mask;
}

Glowing effect in a UILabel using inner shadow

1 Answers1