首页 文章

如何仅在所有平台的离子中限制应用程序到纵向模式

提问于
浏览
96

我正在研究Ionic / Cordova,我把它添加到 androidManifest.xml 但是这对我不起作用,应用程序仍然以两种方式显示

android:screenOrientation="portrait"

如何才能将我的应用限制为纵向模式?我已经检查了android,它不起作用

8 回答

  • 29

    如果你想在你的方向上做一些事情意味着你想在改变你的应用方向时执行任何动作,那么你必须使用离子框架插件...... https://ionicframework.com/docs/native/screen-orientation/

    如果您只想在纵向或横向模式下限制您的应用,那么您只需在config.xml中添加以下这些行

    <preference name="orientation" value="portrait" />
                     OR
    <preference name="orientation" value="landscape" />
    
  • 0

    在你的角度 app.js 里面添加如下所示的 screen.lockOrientation('portrait'); 行:

    一个

    angular.module('app', ['ionic'])
    .run(function($ionicPlatform) {
        // LOCK ORIENTATION TO PORTRAIT.
        screen.lockOrientation('portrait');
      });
    })
    

    您还将在 .run 函数中包含其他代码,但您感兴趣的是我编写的行 . 我没有在我的代码中添加 <preference name="orientation" value="portrait" /> 行,但您可能需要添加 cordova-plugin-device-orientation

  • 266

    如果要仅在所有设备上限制为纵向模式,则应将此行添加到项目根文件夹中的config.xml .

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

    之后,请在命令行中键入以下文本重建平台:

    ionic build
    
  • 4

    Ionic v2更新

    对于Ionic版本2及更高版本,您还需要为您使用的任何插件安装相应的Ionic Native软件包,包括 cordova-plugin-phonegap-plugin- plugins .

    • Install Ionic Native Plugin

    CLI为插件安装Ionic Native的TypeScript模块 .

    $ ionic cordova plugin add --save cordova-plugin-screen-orientation
    $ npm install --save @ionic-native/screen-orientation
    

    *请注意 --save 命令是可选的,如果您不希望将插件添加到 package.json 文件中,可以省略

    • Import ScreenOrientation Plugin

    将插件导入 controllerdocumentation中提供了更多详细信息 .

    import { ScreenOrientation } from '@ionic-native/screen-orientation';
    
    @Component({
        templateUrl: 'app.html',
        providers: [
            ScreenOrientation
        ]
    })
    
    constructor(private screenOrientation: ScreenOrientation) {
      // Your code here...
    }
    
    • Do Your Thing

    以编程方式锁定和解锁屏幕方向 .

    // Set orientation to portrait
    this.screenOrientation.lock(this.screenOrientation.ORIENTATIONS.PORTRAIT);
    
    // Disable orientation lock
    this.screenOrientation.unlock();
    
    • Bonus Points

    您还可以获得当前的方向 .

    // Get current orientation
    console.log(this.screenOrientation.type);  // Will return landscape" or "portrait"
    
  • 1

    根据https://cordova.apache.org/docs/en/4.0.0/config_ref/#global-preferences

    方向允许您锁定方向并防止界面响应方向的变化而旋转 . 可能的值包括默认值,横向或纵向 . 例:

    <preference name="Orientation" value="landscape" />

    请注意,这些值区分大小写,它是“方向”,而不是“方向” .

  • 9

    首先,您需要添加 Cordova Screen Orientation Plugin

    cordova plugin add cordova-plugin-screen-orientation
    

    然后将 screen.lockOrientation('portrait'); 添加到 .run() 方法

    angular.module('myApp', [])
    .run(function($ionicPlatform) {
    
        screen.lockOrientation('portrait');
        console.log('Orientation is ' + screen.orientation);
    
    });
    })
    
  • 1

    在config.xml中添加以下行

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

    你可以试试这个: -

    Cordova插件以iOS,Android,WP8和Blackberry 10的常用方式设置/锁定屏幕方向 . 此插件基于Screen Orientation API的早期版本,因此api目前不符合当前规范 .

    https://github.com/apache/cordova-plugin-screen-orientation
    

    或者在xml配置中尝试此代码: -

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

相关问题