Fullscreen apps on iOS

Fullscreen App

Screenshot from our Ionic Weather app

Many apps (not just games!) benefit from a fullscreen experience on the phone, and making your apps fullscreen in Ionic is simple!

First, we need to note this only works on Cordova (recommend v3.3.1) or another native UIWebView wrapper. If we use Cordova, we will need to install one plugin:

$ cordova plugin add org.apache.cordova.statusbar

Then, we will use Ionic's Platform service to listen for the device ready event and remove the status bar:

angular.module('myApp', ['ionic'])

.controller('MyCtrl', function($scope) {
  ionic.Platform.ready(function() {
    // hide the status bar using the StatusBar plugin

Which might correspond to the following HTML:

<body ng-controller="MyCtrl">

That's it! You've got your fullscreen app and you are now ready for party time.