This is a read-only archive of the Framer Community on Facebook.

What is Framer? Join the Community
Return to index
Jon Sullivan
Posted Jul 27 - Read on Facebook

Hey everyone!

While creating prototypes I got sick of having to manually create the iOS status bar or import it as a Sketch layer in order to have realistic looking prototypes. So, I created my own module to mimic the iOS 11 status bar with a few features to set color, signal strength, battery level, show the actual time and use a blur effect on its background. I thought some folks here might find use for it so feel free to try it out and let me know your thoughts!

Sample Project: https://framer.cloud/FfCCx

Module: https://github.com/JonSul-LLC/iOS-Status-Bar

3 Comments

Andriy Nykyforuk

Is it possible to recreate blurred background inside this StatusBar?

Jon Madison

I made one too, but deprecated mine in favor of Black Pixel’s:

https://github.com/bpxl-labs/StatusBarLayer

Marc Krenn

Hey, this is super useful and I really dig the look of the new statusbar! Added this to my testDrive repo – hope you don't mind.

https://www.facebook.com/groups/framerjs/permalink/1203143259812743/

If you're wondering what testDrive is / what it does:

Just add the testDrive snippet (https://raw.githubusercontent.com/marckrenn/framer-testDrive/master/snippet/testDrive.coffee) to a project and then use iOS_StatusBar as if the module was already located in the module–folder.

testDrive will automatically download the latest version from Github and include it into your project (y)

Read the entire post on Facebook