Can I hide the IOS status bar?

1

I’m using the Testflight app to test my build and realized that the status bar isn’t hidden, Is there a way to hide it?

2

I just tried this: http://www.seqmedia.com/2014/03/30/phonegap-removing-the-ios-7-status-bar/

And it works great!
Status bar is now hidden!

Emmanuel you might want to include this in the default config file as I’d think most people want the status bar to be hidden.

1 Like
3

Is this what “Hide Safari UI component” is for ?

Or is this something different ?

4

yes that’s what it’s for. http://local.bubble.is/reference#ApplicationSettings.ios_meta_tag_hide_safari_ui Let us know if it doesn’t work.

5

I’m talking about the status bar not the safari UI.
Safari UI was hidden in my app.

This is what I mean as status bar:

6

We’ll look into this when we’ll push for a out-of-beta native app release.

1 Like
7

Not a big deal at the moment, but the checkbox to “Hide safari UI” component, doesn’t seem to be doing anything for me.

I tested my app live with the checkbox unchecked - and then checked … no change.

I am on iPhone 5 with most recent iOS

8

Thought I should say for anyone who finds themselves here; this feature actually DOES work. I just didn’t know what it was doing…

If you have put your app into an icon on your homescreen on iOS - if this checkbox is clicked: your app will take up the whole screen unobstructed. If its unchecked - when your app icon is clicked - the result will look as though you are right in to safari (with URL address bar etc)

So ya. Works like a dream. But is not applicable, and makes no noticeable changes to web apps when accessed via URL address bar - only iOS homescreen icon.

2 Likes
9

how can i hide status bar for a webapp? @cho @emmanuel @NigelG

10

does the ios status bar is over your page? or is your page below it?

11

I’m not sure what you mean.

The ios bar is at the top of the screen. This feature removes the ios bar (depending on layout - there may still be icons etc up top).

I’m not using this feature right now (I assume your thinking in terms of native apps?) - I am still messing around with my mobile browser version of an app.
So you will have to experiment.

12

Thank You. My problems is that the icons are still on a transparent IOS BAR , so it covers half of my hamburger menu button , making it very uncomfortable to press it. the IOS BAR cover clickable areas. I would like to have my page begin below this bar or remove the bar completely.

13

@emmanuel the Hide Safari UI feature doesn’t seem to be working.

When I save a bubble web page to my iOS home screen and then open it, the safari UI is hidden – but as soon as I navigate to any other page in my bubble app, the safari UI returns.

The only way to open a bubble page without the safari UI is to have that page saved on my home screen. Navigating between bubble pages ends the hiding, which is frustrating.

Is there a fix for this please?

14

I found the solution – just had to upgrade bubble app into a PWA, which is easy and free following these instructions

15

It doesn’t work

16

<style>
#nprogress { visibility: hidden; }
</style>