How to make my ionic4 project to provide full-screen experience in the mobile browser?

Ionic Framework
1

I am using ionic 4 with angular for my newly created project. If my project loads in the mobile browser I want to hide the top and bottom bar or navigation of the browser which makes my website more native-mobile app like feels. But I don’t know how to do that. I am new to Ionic. Please help me.

1 Like
2

To make full screen on the navigator try this.

Paste this when the app is initialized, in the constructor of you app.component.ts

FullScreen(){
      var elem = document.documentElement;
      if (elem.requestFullscreen) {
        elem.requestFullscreen();
      } else if (elem.msRequestFullscreen) {
        elem.msRequestFullscreen();
      } else if (elem.mozRequestFullScreen) {
        elem.mozRequestFullScreen();
      } else if (elem.webkitRequestFullscreen) {
        elem.webkitRequestFullscreen();
      }
    }

To Apk try this https://ionicframework.com/docs/native/android-full-screen

3

This solution worked for you? I try to do the same but on a react ionic app but I am struggling to implement that. Anyone has a solution for that?