Get Updates By E-mail 

Article Written By:
Johann Dowa

Example: Using Gradient Masks To Make Content Fade In Behind The Clear iOS 7 Status Bar

  •  
  •  
  •  
  •  
  •  

With the changes to the status bar in iOS 7 there are many instances when things don’t look right due to an app not being created to work with a clear status bar. I’ve mentioned a tutorial on customizing the navigation/status bar in iOS 7, but that doesn’t really help if you don’t want to go through the bother of creating a custom background image.

Nick Jensen has create a nice example and explanation of how you can set up a UICollectionView and taking a screenshot of the background you can make it so that your main view nicely fades in behind the status bar which is based on the background using a gradient mask.

Here’s an image showing this effect in action.
AlphaGradientStatusBar

You can read more about thow this is done over on Nick’s blog.

And the example code showing how to do this can be found on Github here.

A nice easy way to make your content slide underneath the status bar while keeping the clear look.


  •  
  •  
  •  
  •  
  •  

Submit A Resource

Have you created a useful tutorial, library or tool for iOS development that you would like to get in front of our 300,000+ monthly page views from iOS developers?

You can submit the url here.

The resources we feel will appeal to our readers the most will be posted on the front page.

Comments