ionic3常用插件

图片放大

1.安装node包

npm install --save ionic-img-viewer

2.在app.module.ts文件中增加：

import { IonicImageViewerModule } from 'ionic-img-viewer';

并且在imports: [] 中增加IonicImageViewerModule; 

---

3.在使用图片的地方增加imageViewer属性

<img  src="http://img1.udiao.com/image/180516/134650478468_370771_1.jpg"  imageViewer="http://img1.udiao.com/image/180516/134650478468_370771_3.jpg" />

禁止屏幕旋转

1.安装插件

Ionic cordova plugin add cordova-plugin-screen-orientation

---

2.修改config.xml文件

<preference name="orientation" value="portrait" />

---

orientation设置可以让你锁定应用程序屏幕方向以阻止屏幕自动翻转。可选的值有：default，landscape(横屏)，portrait(竖屏)。

设置全屏 （只用于android，ios默认全屏 ）

1.安装插件

ionic cordova plugin add cordova-plugin-fullscreen

---

2.修改 config.xml 文件,添加如下代码，value 为真假控制是否为全屏程序

<preference name="Fullscreen" value="true">

---

3.在app.component.ts文件里加入引用；

import { Nav, Platform } from 'ionic-angular';

import { StatusBar, Splashscreen } from 'ionic-native';

4.修改app.component.ts里的构造函数，保持引用切换回来的时候任然全屏

constructor(private platform: Platform){

    this.platform.ready().then(() => {

        StatusBar.hide();

        document.addEventListener('resume',()=>{

            StatusBar.hide();

});

    });

}

---

5.ios 默认全屏，index.html中

<meta name="viewport" content="viewport-fit=cover, width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">