Aygıt Orientation (Tutuş Biçimi) Değişiklikleri ve Mobil Uygulamalar

Web teknolojileri ile mobil cihazlar için uygulama geliştirirken işimize yarayabilecek önemli bir bilgi, cihazın tutuluş tipidir (dik/yatay) diyebiliriz.

Bu tip durumlarda, `screen` objesinin altında sunulan orientation değişkenini `screen.orientation` olmak üzere kullanabiliriz. Bu değişken bir obje dönmekte ve obje şu tip bir yapıya sahip;

~~~~JS
{
type: “landscape-primary”,
angle: 0,
onchange: null,
ownerGlobal: Window → newtab
}
~~~~

Orientation değişim durumlarını da, bir built-in event olan `orientationchange` ile takip edebilirsiniz. Bu event’i window objesi üzerinde kullanabilir ve oryantasyon değişikliğinde gerçekleştirilmesini istediğiniz fonksiyonu veya kod betiğini belirleyebilirsiniz;

~~~~JS
window.addEventListener(“orientationchange”, function() {
alert(“Cihaz şuan: ”
+ screen.orientation +
” tutuş pozisyonuna geçti.”);
});
~~~~

###Mobil Cihazlarda Orientation Açısı
Eğer dikkatinizi çekti ise, screen.orientation objesi içerisinde `angle` isimli bir değişken bulunuyor. Bu değişken, ekranın dik dik tutulduğu durumda, x ekseninde hangi açıda bulunduğunu temsil eder.

![orientation açısı](http://www.buraktokak.com/wp-content/uploads/2016/08/BfeAy.jpg)

> **NOT:** Eski cihazlarda 0, 90, 180, -90 değerlerini almakta olmasının yanında, yeni bazı cihazlar için bu değişken, çağırıldığı anın açısını gerçek değer olarak vermektedir.

Ayrıca bu açı değerini kullanarak da, uygulama içerisindeki aksiyonları gerçekleştirebilirsiniz.

###`screen.orientation` Desteklemeyen Cihazlar

Bazı eski cihazlar, bu özelliği desteklememekte. Tam bir listesi için caniuse.com adresinden aldığımız ekran görüntüsünü paylaşalım;

![screen.orientation tarayıcılara göre kullanılabilirlik grafiği](http://www.buraktokak.com/wp-content/uploads/2016/08/Screenshot_49.png)

Görüldüğü gibi, chrome motoru kullanmayan android tarayıcısında ve safari’de hiç bir şekilde desteklenmiyor.

Buna ek olarak benim karşılaştığım durumda, Safari için kullanılabilecek özel bir özellik var;

~~~~JS
console.log(window.orientation);
~~~~
Safari’de screen objesi yerine window objesi üzerindeki orientation değişkeni sadece bir intiger döndürüyor ve bu bir açı değeri. Yani bir bakıma bu değerin, `screen.orientation.angle` değerine eşit olarak kullanılabilir olduğunu söyleyebiliriz.

###Cordova’da Screen Orientation Özelliği
Cordova kullanarak, uygulamanızın anlık oryantasyon değişimini native taraftan alabilirsiniz. Bu hem daha sağlıklı hem de daha az baş ağrıtıcı bir çözüm diyebilirim;

Benim de projelerimde kullandığım şu eklentiyi kullanabilirsiniz: [cordova-plugin-screen-orientation](https://github.com/apache/cordova-plugin-screen-orientation)

Eklenti, normal `screen` objenize 3 yeni native metod ve değişken ekliyor;

~~~~JS
// Orientation değişimini belirli bir değere kilitle.
screen.lockOrientation(‘portrait’);

// Orientation değişimini otomatik yap
screen.unlockOrientation();

// Şuanki Orientation
console.log(screen.orientation);
~~~~
Geniş bir eklenti kullanmak istemiyorum diyorsanız, kendi uygulamanız için, bu eklentinin platformlar için sunduğu farklı javascript dosyalarını inceleyip mimik edebilirsiniz.

Yorumları Göster veya Yeni Yorum Yaz