Fullscreen Mode

How to / Third Party Tooling
1

Hi, I’m working on a simple game app. I am struggling to get my expo app into fullscreen mode. I have successfully hidden the status bar but I am facing problems with the navigation bar(Android). Help please :slight_smile:

2

Looks like support for hiding the navigation bar has been merged very recently. It looks like it’s a static configuration and not something you can control dynamically:

https://github.com/expo/expo/pull/5280/files#diff-f51d98b64fb8133a4fda7fac72e78795R176

I think you’ll need to wait for SDK 35 if you don’t want to eject, but I don’t think you’ll have to wait very long for SDK 35, since the Expo team has said they plan to release it before iOS 13 is released and that’s expected soon

1 Like
3

Awesome! Thank you so much, appreciate you :smiley:

4

It is not working for me tho. I have added it into my app.json file, and tried building it. It gave me an error saying that I should not have additional property “androidNavigationBar”. Here is my code:
“android”: {
“package”: “com.yokai.testing123”,
“androidNavigationBar”: {
“visible”: false
}
},

5

As I mentioned in my comment you will have to wait for SDK 35, which I think should include this change.

Otherwise you will have to build a version of Expo yourself that has the change included. I am not 100% sure how to do that, but maybe you can figure it out :slight_smile:. Here is the repository:

and the change was merged into the master branch in this commit:

94e06dbbc2221033ddd5fd7fb8cebc9d192e2710

6

okay okay, thanks for the help!

1 Like
7

Well, apparently SDK 35 is out! Not sure why Medium removed their article about it… https://blog.expo.io/expo-sdk-35-is-now-available-7a73a065e71e

8

I think they’re still in the process of releasing it. Two days ago they said it was expected between Tuesday and Friday next week:

9

At least the docs are already updated! :smiley:

10

And now it has been released. Apparently they were a bit too pessimistic two days ago :grinning:

11

Yup! Going through the pain right now… Font.loadAsync error like last time.

Solution:

1.- Delete the node_modules folder
2.- Delete the package-lock.json file
3.- Run npm install

Then run expo start -c

12

Did you guys manage to make the fullscreen work yet? I get this error:

Error: Problem validating fields in app.json. See https://docs.expo.io/versions/v35.0.0/workflow/configuration/
• Field: android - should NOT have additional property ‘androidNavigationBar’.

EDIT: When I try this

"ios": {
  "supportsTablet": true,
  "bundleIdentifier": "com.fourseasonsmarkets.mobshed"
},
"description": "",
"androidStatusBar": {
  "barStyle": "light-content",
  "backgroundColor": "#000"
},
"androidNavigationBar": {
  "visible": false,
  "barStyle": "light-content",
  "backgroundColor": "#000"
}

…Only androidStatusBar is recognized.

Error: Problem validating fields in app.json. See https://docs.expo.io/versions/v35.0.0/workflow/configuration/
• should NOT have additional property ‘androidNavigationBar’.

13

yes, I’m having the same problem

14

and I am here in 2020 experiencing the same problem with androidNavigationBar :unamused::pensive: Anyone got a solution yet?

15

Howdy, I wanted to check if Expo SDK 37 is going to have this issue fixed?

"androidNavigationBar": {
  "visible": false,
  "backgroundColor": "#2A2A2A"
}

It is hidden until you touch the screen, which the whole idea is to hide it permanently to have the expected fullscreen experience.