zoukankan      html  css  js  c++  java
  • ionic3 关于屏幕方向问题

    关于屏幕方向问题

    使用ionic-native中的screen-orientation

    ionic cordova plugin add cordova-plugin-screen-orientation
    npm install --save @ionic-native/screen-orientation
    app.module.ts 的 providers 进行引用 ScreenOrientation。

    在真机中才会看到效果,可以配合页面的生命周期进行设置,也可以在app.component.ts中全局设置

    设置:

    import { ScreenOrientation } from '@ionic-native/screen-orientation';
    constructor(private screenOrientation: ScreenOrientation) { }


    // get current
    console.log(this.screenOrientation.type); // logs the current orientation, example: 'landscape'

    // set to landscape
    this.screenOrientation.lock(this.screenOrientation.ORIENTATIONS.LANDSCAPE);

    // allow user rotate
    this.screenOrientation.unlock();

    // detect orientation changes
    this.screenOrientation.onChange().subscribe(
      () => {
        console.log("Orientation Changed");
      }
    );

    举例:reportPage【报表页面,需要横屏显示,页面返回后取消锁定】

    ionViewWillEnter(){
      this.screenOrientation.lock(this.screenOrientation.ORIENTATIONS.LANDSCAPE);
    }
    ionViewWillLeave(){
      this.screenOrientation.unlock();
    }
    ionViewDidLoad() {

    }


    锁定方向

    portrait-primary Portrait模式, Home键在下边
    portrait-secondary Portrait模式, Home键在上边
    landscape-primary Landscape模式, Home键在右边
    landscape-secondary Landscap模式, Home键在左边
    portrait: 所有portrait模式
    landscape: 所有landscape模式

    官方详细内容
      https://ionicframework.com/docs/native/screen-orientation/

  • 相关阅读:
    数据库总结
    数据库 查询方法详解 以学生老师信息表为例
    SQL 常与LIKE关键字配合使用,表示一个模糊的范围 。
    SQL 数据类型
    十分钟搞清字符集和字符编码
    c# 集合
    c# 开根号 牛顿迭代
    c# 打名字
    转 揭开计算机的神秘面纱 来源:吴广磊的博客
    c# while穷举(凑钱)
  • 原文地址:https://www.cnblogs.com/Rampage/p/8692361.html
Copyright © 2011-2022 走看看