首页 > 解决方案 > Ionic 5 - 将在 Android/iOS 上的 Ionic/Capacitor 应用程序的锁定屏幕方向

问题描述

我试图弄清楚如何为整个应用程序锁定我的屏幕方向,所以当它部署到 Android/iOS 时,它只用于纵向模式。

我看到使用 Cordova 和 config.xml 提出和回答了很多问题。但我使用的是电容器,所以它与我没有 config.xml 文件不同。相反,我有一个ionic.config.json文件。

这是我迄今为止在我的app.module.tsand中所拥有的app.component.ts


    import { NgModule } from '@angular/core';
    import { BrowserModule } from '@angular/platform-browser';
    import { RouteReuseStrategy } from '@angular/router';
    
    import { IonicModule, IonicRouteStrategy } from '@ionic/angular';
    
    import { AppComponent } from './app.component';
    import { AppRoutingModule } from './app-routing.module';
    import {ScreenOrientation} from "@ionic-native/screen-orientation/ngx";
    
    
    @NgModule({
      declarations: [AppComponent],
      entryComponents: [],
      imports: [BrowserModule, IonicModule.forRoot(), AppRoutingModule],
      providers: [{ provide: RouteReuseStrategy, useClass: IonicRouteStrategy }, ScreenOrientation],
      bootstrap: [AppComponent],
    })
    export class AppModule {
      constructor() {
    
      }
    
    }

export class AppComponent {
  constructor(private screenOrientation: ScreenOrientation) {
    this.screenOrientation.lock(this.screenOrientation.ORIENTATIONS.PORTRAIT);
  }

}

但我不相信这实际上会锁定整个应用程序的屏幕方向。我试过查看 Ionic 文档,但它实在是太简单了。

标签: angularionic-frameworkionic4capacitorcapacitor-plugin

解决方案


您需要将方向参数传递给 screenOrientation.lock 方法

像这样的东西:

export class AppComponent {
  constructor(private screenOrientation: ScreenOrientation) {
    this.screenOrientation.lock('portrait');
  }
}

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


推荐阅读