在Fullscreen上查看ionic Mobile应用程序

Question

我有一个离子移动应用程序.我在移动浏览器上运行.它有静态标题.我需要隐藏该Web应用程序的地址栏,即使向下滚动,但这不会发生.

它有一个标题如下,

<meta name="viewport" 
      content="initial-scale=1, 
      maximum-scale=1, 
      user-scalable=no, 
      width=device-width">

它在本机移动浏览器上运行.我用控制台构建了应用程序.所以请帮我隐藏地址/标题栏,像facebook或其他网络应用程序一样运行

Answer 1

您可以安装状态栏插件:

$ cordova plugin add org.apache.cordova.statusbar

或者对于cordova 5.0+:

$ cordova plugin add cordova-plugin-statusbar

并隐藏状态栏: StatusBar.hide();

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

一些更多的信息在这里和工作程序在这里.

Ionic 2更新

在Ionic 2中,事情有点不同.我们仍然需要安装cordova插件状态栏,但我们需要从ionic native导入状态栏:

import {StatusBar} from 'ionic-native';

主要类应该大致如下:

import {App, Platform} from 'ionic/ionic';
import {HomePage} from './home/home';
import './app.scss';

import {StatusBar} from 'ionic-native';

@App({
  template: `
    <ion-nav [root]="root"></ion-nav>
    <ion-overlay></ion-overlay>
  `,
})
export class MyApp {
  constructor(platform: Platform) {
    this.platform = platform;
    this.initializeApp();
    this.root = HomePage;

  }

  initializeApp() {
    this.platform.ready().then(() => {
      console.log('Platform ready');
      StatusBar.hide();
    });
  }
}

代码是从离子本机库中借来的.一个好的教程可以找到这里.