Empresas
Empregos
  • Sobre nós
  • Soluções
    • Publicação de vagas
      Publique sua vaga e receba candidatos qualificados em 48h.
    • Avaliações de candidatos
      Mais de 500 testes técnicos e psicológicos, mais anti-fraude.
    • Headhunting
      Busca executiva personalizada do início ao fim.
    • Folha de Pagamento + EOR
      Dispersão de folha e EOR em mais de 15 países da LATAM.
  • Preços
  • Empregos

0

292
Visualizações
Ionic 2 - Landscape orientation enabled for iPad only

I can set the orientation to portrait-only in config.xml as follows:

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

But how can I allow landscape orientation for iPad builds, while still disabling for iPhone as above?

about 4 years ago · Santiago Trujillo
2 Respostas
Responde à pergunta

0

According to Mike Harrison from Ionic he says:

Other than manually rotating the device, not really. This would be something you'd writing a plugin for to modify the main App view in cordova

But there is a Plugin from Ionic 1 . Look at it. Eventually you can use it in Ionic 2 too.

With this Plugin you could do something like:

if(/(ipad)/i.test(navigator.userAgent)) {
  //THIS IS THE PLUGIN IONIC 1 CODE 
  $scope.changeOriantationPortrait = function() {
            screen.lockOrientation('portrait');
        }   
}
about 4 years ago · Santiago Trujillo Relatório

0

You can delete a preference from config.xml and define it through a native plugin Screen Orientation

Then in app.component.ts lock orientation for phones:

        // check if platform is not a tablet
        if (platform.is('cordova') && !platform.is('tablet')) {
            // lock orientation to only portrait mode
            this.screenOrientation.lock(this.screenOrientation.ORIENTATIONS.PORTRAIT);
            // set screen orientation to 'portrait'
            globalProvier.screenOrientation = this.screenOrientation.ORIENTATIONS.PORTRAIT;
        } else { // if it's tablet
            // set device type to 'tablet'
            globalProvier.deviceType = platform.platforms()[3];
            // set current orientation type ('portrait-primary' or 'landscape-primary' or 'portrait-secondary' or landscape-secondary)
            globalProvier.screenOrientation = this.screenOrientation.type;
            // set listener on changing orientation
            this.screenOrientation.onChange().subscribe(
                () => {
                    globalProvier.screenOrientation = this.screenOrientation.type;
                    console.log("Orientation Changed to: ", this.screenOrientation.type);
                }
            );
        }

Now you can dynamically adjust your layout depends from tablet orientations with globalProvier.screenOrientation variable. Add classes or using *ngIf in the templates.

*ngIf='this.globalProvider.screenOrientation == "landscape-primary" || <h3 *ngIf='this.globalProvider.screenOrientation == "landscape-primary" || this.globalProvider.screenOrientation == "landscape-secondary"'>Orientation: landscape</h3>
about 4 years ago · Santiago Trujillo Relatório
Responde à pergunta
Encontrar trabalhos remotos

Descubra a nova forma de encontrar um emprego!

melhores empregos
Principais categorias de trabalho
Empresas
Postar vaga Preços Comercial
Jurídico
Termos e Condições Política de privacidade
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomende algumas ofertas para mim
Preciso de ajuda