Bagaimana cara membatasi aplikasi ke mode potret hanya dalam ionik untuk semua platform?

121

Saya sedang mengerjakan Ionic / Cordova, saya menambahkan ini ke androidManifest.xmltetapi ini tidak berhasil untuk saya dan aplikasi masih ditampilkan dengan kedua cara

android:screenOrientation="portrait"

Bagaimana cara membatasi aplikasi saya ke mode potret saja? Saya telah memeriksa di android dan tidak berhasil

Muhammad Faizan Khan
sumber
apakah ini bekerja untuk ionik ??, karena bekerja untuk ionik 2
manish kumar

Jawaban:

315

Jika Anda ingin membatasi ke mode potret hanya di semua perangkat, Anda harus menambahkan baris ini ke config.xml di folder root proyek Anda.

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

Setelah itu, silakan bangun kembali platform dengan mengetikkan teks di bawah ini di baris perintah:

ionic build
Vadiem Janssens
sumber
2
bagus untuk dilihat. bekerja untuk saya. diperiksa di android. terima kasih Vadiem
Muhammad Faizan Khan
1
bagaimana Anda membatasi hanya satu layar tertentu?
pengguna3607282
1
Saya belum menguji ini sendiri, tetapi Anda mungkin mendapatkan hasil yang diinginkan dengan tutorial ini: gajotres.net/…
Vadiem Janssens
4
Ini sepertinya hanya berfungsi ketika Anda menjalankannya di perangkat nyata btw. Jika Anda menjalankannya melalui aplikasi cloud Ionic View, ini tidak akan berpengaruh.
Johncl
1
Oke untuk Ionic 4.
Pierrick Martellière
36

Pembaruan Ionic v2 +

Untuk Ionic versi 2 dan yang lebih baru, Anda juga perlu menginstal paket Ionic Native yang sesuai untuk semua plugin yang Anda gunakan, termasuk cordova-plugin-dan phonegap-plugin-plugin.

  1. Instal Plugin Ionic Native

    Instal modul TypeScript Ionic Native untuk plugin dari CLI .

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

    * Perhatikan bahwa --saveperintah ini opsional dan dapat dihilangkan jika Anda tidak ingin menambahkan plugin ke package.jsonfile Anda

  2. Impor ScreenOrientationPlugin

    Impor plugin ke Anda controller, detail selengkapnya tersedia di dokumentasi .

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

    Kunci dan buka kunci orientasi layar secara terprogram.

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

    Anda juga bisa mendapatkan orientasi saat ini.

    // Get current orientation
    console.log(this.screenOrientation.type);  // Will return landscape" or "portrait"
    
Tyler
sumber
1
CATATAN: Anda memerlukan "@ ionic-native / core": "^ 3.6.1", karena versi yang lebih rendah menyebabkan error: forum.ionicframework.com/t/…
Luckylooke
Coba tambahkan ScreenOrientation ke daftar penyedia
Tyler
3
ionic pluginsepertinya tidak lagi berfungsi. Saya pikir sekarang ionic cordova plugin. Sepertiionic cordova plugin add --save cordova-plugin-screen-orientation
Rockin4Life33
2
menambahkan <preference name="Orientation" value="portrait" />tampaknya cukup bagi saya
akan
2
DevApp baru saja menjalankan aplikasi Anda sebagai tampilan web dalam aplikasi DevApp, jadi beberapa fitur asli tidak berfungsi. Coba kompilasi dan jalankan aplikasi Anda langsung di perangkat dan itu akan berfungsi.
Tyler
13

Menurut https://cordova.apache.org/docs/en/4.0.0/config_ref/#global-preferences ,

Orientation memungkinkan Anda mengunci orientasi dan mencegah antarmuka berputar sebagai respons terhadap perubahan orientasi. Nilai yang memungkinkan adalah default, lanskap, atau potret. Contoh:

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

Ketahuilah bahwa nilai-nilai ini peka huruf besar / kecil, ini adalah "Orientasi", bukan "orientasi".

Michael Zhou
sumber
1
Saat Anda menggulir ke atas pada link yang Anda berikan, ini menyatakan berikut: "Tag <preference> menyetel berbagai opsi sebagai pasangan atribut nama / nilai. Setiap nama preferensi peka huruf besar kecil . [...]."
Vadiem Janssens
2
"orientasi" cocok untuk saya. "Orientation" memberi saya layar putih saat menjalankan aplikasi di perangkat sebenarnya.
CMA
2
"Orientasi" bekerja untuk saya dengan Ionic 2 di perangkat android.
kamayd
6

Jika Anda ingin melakukan sesuatu pada orientasi Anda berarti Anda ingin melakukan tindakan apa pun saat mengubah orientasi aplikasi Anda, maka Anda harus menggunakan plugin kerangka kerja ionik ... https://ionicframework.com/docs/native/screen-orientation/

Jika Anda hanya ingin membatasi aplikasi Anda pada mode potret atau lanskap, Anda harus menambahkan baris berikut ini di config.xml Anda

<preference name="orientation" value="portrait" />
                 OR
<preference name="orientation" value="landscape" />
Vivek Singh
sumber
4

Pertama, Anda perlu menambahkan Plugin Orientasi Layar Cordova menggunakan

cordova plugin add cordova-plugin-screen-orientation

dan kemudian tambahkan screen.lockOrientation('portrait');ke .run()metode

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

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

});
})
Ahmed Bouchefra
sumber
2

Di dalam sudut Anda app.jstambahkan garis screen.lockOrientation('portrait');seperti yang ditunjukkan di bawah ini:

sebuah

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

Anda juga akan memiliki kode lain dalam .runfungsi tersebut, tetapi yang Anda minati adalah baris yang saya tulis. Saya belum menambahkan baris <preference name="orientation" value="portrait" />di kode saya, tetapi Anda mungkin perlu menambahkancordova-plugin-device-orientation

Vlasis Perdikidis
sumber
2

Silakan tambahkan android:screenOrientation="portrait"di androidManifest.xmlfile sebagai atribut dari tag kegiatan untuk android.

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

Di config.xml tambahkan baris berikut

<preference name="orientation" value="portrait" />
Omkar Porje
sumber
0

Anda dapat mencoba ini: -

Plugin Cordova untuk mengatur / mengunci orientasi layar dengan cara yang umum untuk iOS, Android, WP8 dan Blackberry 10. Plugin ini didasarkan pada versi awal dari API Orientasi Layar sehingga api saat ini tidak sesuai dengan spesifikasi saat ini.

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

atau coba kode ini dalam konfigurasi xml: -

<preference name="orientation" value="portrait" />
Bal mukund kumar
sumber