cordova - Ionic 2 - Landskapsläge aktiverat endast för iPad

Jag kan ställa in orienteringen till endast porträtt i config.xml på följande sätt:

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

Men hur kan jag tillåta landskapsläge för iPad-versioner, samtidigt som det fortfarande är avstängt för iPhone som ovan?

Svar #1

Enligt Mike Harrison från Ionic säger han:

Förutom att manuellt rotera enheten, inte riktigt. Detta skulle vara något du skriver ett plugin för för att ändra huvudappen-vyn i Cordova

Men det finns ett plugin från Ionic 1. Titta på det. Så småningom kan du använda det i Ionic 2 också.

Med detta plugin kan du göra något som:

if(/(ipad)/i.test(navigator.userAgent)) {
  //THIS IS THE PLUGIN IONIC 1 CODE 
  $scope.changeOriantationPortrait = function() {
            screen.lockOrientation('portrait');
        }   
}

Svar #2

Du kan ta bort en inställning från config.xml och definiera den genom ett inbyggt plugin för skärmrotation

Sedan i app.component.ts lås orienteringen för telefoner:

        // 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);
                }
            );
        }

Nu kan du dynamiskt justera din layout beroende på surfplattans orientering med globalProvier.screenOrientation-variabeln. Lägg till klasser eller använd *ngIf i mallarna.

*ngIf='this.globalProvider.screenOrientation == "landscape-primary" || <h3 *ngIf='this.globalProvider.screenOrientation == "landscape-primary" || this.globalProvider.screenOrientation == "landscape-secondary"'>Orientation: landscape</h3>

Relaterade artiklar