Nathan Lampi

UIView Inner Shadow

UIView+Shadow is a quick category I created to add an inner shadow to a UIView. This is useful for quickly adding an inner shadow to any view. It is configurable to allow shadows to grow from any or all of the view edges.

Ideally this effect is handled using image(s), but this allows for some quick prototyping to test the effect/colors/etc. of an inner shadow. The corners currently use their own shadow effect as I didn't like the effect of overlapping shadows on the corners. This functionality can be easily removed if the overlap is desired. (UPDATE: I have removed this functionality as I no longer liked it.) If there is enough interest, I can add in the ability to toggle this effect.

All Directions Example

Here is an example of all borders with the default color

// Create a sample view
UIView *exampleView = [[UIView alloc] initWithFrame:CGRectMake(100, 100, 350, 90)];
exampleView.backgroundColor = [UIColor colorWithRed:.13 green:.35 blue:.85 alpha:1.0f];

// Add a basic inner shadow with a 3 pixel radius
[exampleView addInnerShadowWithRadius:3.0f andAlpha:0.45f];

[self.view addSubview:exampleView];

All Shadows
Wasn't that easy? I Still don't love the corners.

Top and Bottom Only Example

With a little tweak you can have borders in whatever directions you please.

// Add a shadow to the top and bottom of the view
[exampleView addInnerShadowWithRadius:3.0f
                             andColor:[UIColor colorWithWhite:0 alpha:0.45f]
                          inDirection:NLInnerShadowDirectionBottom | NLInnerShadowDirectionTop];

Top and Bottom Shadows
Top and Bottom Shadows

Easy to change the shadow effects.

Download Script

The complete script can be found on github.

© Lampi.dev 2011 - 2022