Tüm platformlar için yalnızca ionic'te uygulamayı portre moduna nasıl kısıtlayabilirim?


121

Ionic / Cordova üzerinde çalışıyorum, bunu ekledim androidManifest.xmlancak bu benim için işe yaramadı ve uygulama hala her iki şekilde de gösteriliyor

android:screenOrientation="portrait"

Uygulamamı yalnızca portre moduyla nasıl kısıtlayabilirim? Android'i kontrol ettim ve çalışmıyor


ionic için mi çalışıyor ??, coz onun için çalışıyor ionic 2
manish kumar

Yanıtlar:


315

Tüm cihazlarda yalnızca dikey modla kısıtlamak istiyorsanız, bu satırı projelerinizin kök klasöründeki config.xml'ye eklemelisiniz.

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

Bundan sonra, lütfen aşağıdaki metni komut satırına yazarak platformu yeniden oluşturun:

ionic build

2
görmek güzel. benim için çalıştı. android üzerinde kontrol edildi. teşekkürler Vadiem
Muhammad

1
sadece belirli bir ekranı nasıl kısıtlarsınız?
user3607282

1
Bunu kendim test etmedim, ancak bu eğitimle istediğiniz sonucu alabilirsiniz: gajotres.net/…
Vadiem Janssens

4
Bu sadece gerçek bir cihaz btw üzerinde çalıştırdığınızda işe yarıyor gibi görünüyor. Ionic View bulut uygulaması üzerinden çalıştırırsanız hiçbir etkisi olmaz.
Johncl

1
Tamam Ionic 4 için.
Pierrick Martellière

36

Ionic v2 + Güncellemesi

Ionic 2 ve sonraki sürümler için, ilgili sürümü de yüklemeniz gerekecektir. İyonik Yerli herhangi kullanmak eklentisi dahil olmak üzere paketi cordova-plugin-ve phonegap-plugin-eklentileri.

  1. İyonik Yerel Eklentiyi Kurun

    Eklenti için Ionic Native'in TypeScript modülünü şuradan yükleyin: CLI .

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

    * Unutmayın ki --save Komutun isteğe bağlı olduğunu ve eklentiyi package.jsondosyanıza eklemek istemiyorsanız atlanabileceğini unutmayın.

  2. İthalat ScreenOrientationEklentisi

    Eklentiyi içeri aktarın controller, daha fazla ayrıntı dokümantasyonda mevcuttur .

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

    Ekran yönünü programlı olarak kilitleyin ve kilidini açın.

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

    Ayrıca mevcut yönlendirmeyi de alabilirsiniz.

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

1
NOT: "@ ionic-native / core": "^ 3.6.1" gerekir, çünkü daha düşük sürüm hataya neden olur: forum.ionicframework.com/t/…
Luckylooke

Sağlayıcı listesine ScreenOrientation eklemeyi deneyin
Tyler

3
ionic pluginartık işe yaramıyor gibi görünüyor. Şimdi olduğunu düşünüyorum ionic cordova plugin. Meselaionic cordova plugin add --save cordova-plugin-screen-orientation
Rockin4Life33

2
eklemek <preference name="Orientation" value="portrait" />benim için yeterli görünüyor
tobbe

2
DevApp, uygulamanızı DevApp uygulaması içinde bir web görünümü olarak çalıştırıyor, bu nedenle bazı yerel özellikler çalışmıyor. Uygulamanızı doğrudan cihaz üzerinde derlemeyi ve çalıştırmayı deneyin ve çalışmalıdır.
Tyler

13

Https://cordova.apache.org/docs/en/4.0.0/config_ref/#global-preferences'a göre ,

Yönlendirme, yönlendirmeyi kilitlemenize ve yöndeki değişikliklere yanıt olarak arayüzün dönmesini önlemenize olanak tanır. Olası değerler varsayılan, yatay veya dikeydir. Misal:

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

Bu değerlerin büyük / küçük harfe duyarlı olduğunu unutmayın, "yönlendirme" değil "Yönlendirme" dir.


1
Sağladığınız bağlantıyı yukarı kaydırdığınızda, şunu belirtir: "<preference> etiketi, çeşitli seçenekleri ad / değer öznitelik çiftleri olarak ayarlar. Her tercihin adı büyük / küçük harfe duyarlıdır . [...]."
Vadiem Janssens

2
"oryantasyon" benim için çalışıyor. "Oryantasyon", uygulamayı gerçek cihazda çalıştırırken bana beyaz ekran veriyor.
CMA

2
"yönlendirme", bir android cihazda Ionic 2 ile benim için çalışıyor.
kamayd

6

Oryantasyonunuzla ilgili bir şey yapmak istiyorsanız, uygulama yönünüzü değiştirirken herhangi bir eylem yapmak istediğiniz anlamına gelirse, o zaman iyonik çerçeve eklentisini kullanmanız gerekir ... https://ionicframework.com/docs/native/screen-orientation/

Uygulamanızı sadece dikey veya yatay modda kısıtlamak istiyorsanız, bu aşağıdaki satırı config.xml dosyanıza eklemeniz yeterlidir.

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

4

Öncelikle, Cordova Screen Orientation Plugin'i kullanarak eklemeniz gerekir.

cordova plugin add cordova-plugin-screen-orientation

ve daha sonra ekleme screen.lockOrientation('portrait');için .run()yöntem

angular.module('myApp', [])
.run(function($ionicPlatform) {

    screen.lockOrientation('portrait');
    console.log('Orientation is ' + screen.orientation);

});
})

2

Açınızın içine aşağıdaki gibi bir app.jsçizgi ekleyin screen.lockOrientation('portrait');:

bir

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

.runFonksiyonda başka bir kod da olacak , ancak ilgilendiğiniz kod yazdığım satır. Satırı koduma eklemedim <preference name="orientation" value="portrait" />, ancak eklemeniz gerekebilircordova-plugin-device-orientation


2

Ekleyiniz android:screenOrientation="portrait"içinde androidManifest.xmlandroid için etkinlik etiketine bir niteliği olarak dosyaya.

<activity
        android:name="com.example.demo_spinner.MainActivity"
        android:label="@string/app_name"
        android:screenOrientation="portrait" >
</activity>

1

Config.xml'de aşağıdaki satırı ekleyin

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

0

Bunu deneyebilirsiniz: -

Cordova eklentisi, iOS, Android, WP8 ve Blackberry 10 için ekran yönünü ortak bir şekilde ayarlamak / kilitlemek için. Bu eklenti, Screen Orientation API'nin eski bir sürümüne dayandığından, api şu anda mevcut spesifikasyonla eşleşmiyor.

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

veya bu kodu xml yapılandırmasında deneyin: -

<preference name="orientation" value="portrait" />
Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.