Ekran kesimlerini destekleme

Oluşturma yöntemini deneyin
Jetpack Compose, Android için önerilen kullanıcı arayüzü araç setidir. Oluşturma aracında ekran kesimlerini nasıl kullanacağınızı öğrenin.

Ekran kesimi, bazı cihazlarda ekran yüzeyine uzanan bir alandır. Uçtan uca deneyime olanak tanırken cihazın ön tarafında önemli sensörler için alan da sağlar.

Android, Android 9 (API düzeyi 28) ve sonraki sürümleri çalıştıran cihazlarda ekran kesimlerini destekler. Bununla birlikte, cihaz üreticileri Android 8.1 veya önceki sürümleri çalıştıran cihazlarda ekran kesimlerini de destekleyebilir.

Bu dokümanda, kesme alanı (yani kesimi içeren ekran yüzeyindeki uçtan uca dikdörtgen) ile nasıl çalışılacağı da dahil olmak üzere kesimlere sahip cihazlar için desteğin nasıl sağlanacağı açıklanmaktadır.

Üst orta ekran kesimi örneğini gösteren resim
Şekil 1. 1 Ekran kesimi.

Uygulamanızın kesim alanlarını nasıl işleyeceğini seçme

İçeriğinizin bir kesme alanıyla üst üste binmesini istemiyorsanız genellikle içeriğinizin durum çubuğu ve gezinme çubuğuyla çakışmadığından emin olmanız yeterlidir. Kesme alanına oluşturuyorsanız her kesimin güvenli eklerini ve sınırlayıcı kutusunu içeren bir DisplayCutout nesnesi almak için WindowInsetsCompat.getDisplayCutout() kullanın. Bu API'ler, içeriğinizin kesimle çakışıp çakışmadığını kontrol etmenizi sağlar. Böylece gerekirse yeniden konumlandırabilirsiniz.

İçeriğin, kesim alanının arkasına yerleştirilip yerleştirilmediğini de belirleyebilirsiniz. layoutInDisplayCutoutMode window düzeni özelliği, içeriğinizin kesim alanında nasıl çizileceğini kontrol eder. layoutInDisplayCutoutMode öğesini aşağıdaki değerlerden birine ayarlayabilirsiniz:

Kesim modunu programatik olarak veya etkinliğinizde bir stil ayarlayarak ayarlayabilirsiniz. Aşağıdaki örnek, LAYOUT_IN_DISPLAY_CUTOUT_MODE_SHORT_EDGES özelliğini etkinliğe uygulamak için bir stil tanımlar.

<style name="ActivityTheme">
  <item name="android:windowLayoutInDisplayCutoutMode">
    shortEdges <!-- default, shortEdges, or never -->
  </item>
</style>

Aşağıdaki bölümlerde farklı kesim modları daha ayrıntılı olarak açıklanmaktadır.

Varsayılan davranış

Varsayılan olarak, özel bayrakların ayarlanmamış olduğu dikey modda, kesimi olan bir cihazdaki durum çubuğu en az kesim yüksekliği kadar olacak şekilde yeniden boyutlandırılır ve içeriğiniz aşağıdaki alanda gösterilir. Yatay veya tam ekran modunda uygulama pencereniz sinemaskop yapılır, böylece hiçbir içeriğiniz kesim alanında gösterilmez.

Kısa kenar kesme alanlarında içerik oluştur

Video, fotoğraf, harita ve oyun gibi bazı içeriklerin kesim alanında oluşturmak, kullanıcılara daha etkileyici ve uçtan uca bir deneyim sunmanın mükemmel bir yolu olabilir. LAYOUT_IN_DISPLAY_CUTOUT_MODE_SHORT_EDGES ile içerik, sistem çubuklarının gizli veya görünür olmasından bağımsız olarak hem dikey hem de yatay yönde ekranın kısa kenarındaki kesme alanına uzanır. Bu modu kullanırken hiçbir önemli içeriğin kesim alanıyla çakışmadığından emin olun.

Aşağıdaki resimde, dikey durumdaki bir cihazın LAYOUT_IN_DISPLAY_CUTOUT_MODE_SHORT_EDGES örneği gösterilmektedir:

Dikey moddayken kesim alanında içerik oluşturmayı gösteren resim
Şekil 2. Dikey moddayken kesme alanında içerik oluşturma.

Aşağıdaki resimde, yatay modda bir cihazın LAYOUT_IN_DISPLAY_CUTOUT_MODE_SHORT_EDGES örneği gösterilmektedir:

Yatay moddayken kesim alanında içerik oluşturmayı gösteren resim
Şekil 3. Yatay moddayken kesim alanında içerik oluşturma.

Bu modda pencere, ekranın kısa kenarındaki kesitlerin altına hem dikey hem de yatay yönde uzanır. Pencerenin sistem çubuklarını gizleyip gizlemediğine bakılmaz.

Köşedeki kesimin kısa kenarda olduğu kabul edilir:

Köşesinde kesim olan bir cihazı gösteren resim
Şekil 4. Köşesi kesimli bir cihaz.

Ekran kesimi alanında hiçbir zaman içerik oluşturma

LAYOUT_IN_DISPLAY_CUTOUT_MODE_NEVER kullanıldığında pencerenin kesim alanıyla örtüşmesine hiçbir zaman izin verilmez.

Aşağıda, dikey durumdaki LAYOUT_IN_DISPLAY_CUTOUT_MODE_NEVER örneği verilmiştir:

Dikey olarak LAYOUT_IN_DISPLAY_CUTOUT_MODE_NEVER gösteren bir resim
Şekil 5. Dikey mod için LAYOUT_IN_DISPLAY_CUTOUT_MODE_NEVER örneği.

Aşağıda, yatay moddaki LAYOUT_IN_DISPLAY_CUTOUT_MODE_NEVER örneği verilmiştir:

Yatay modda LAYOUT_IN_DISPLAY_CUTOUT_MODE_NEVER gösteren bir resim
Şekil 6. Yatay moddaki LAYOUT_IN_DISPLAY_CUTOUT_MODE_NEVER örneği.

Ekran kesimi desteği için en iyi uygulamalar

Ekran kesimleriyle çalışırken aşağıdakileri göz önünde bulundurun:

  • Kullanıcı arayüzünün kritik öğelerinin yerleşimine dikkat edin. Kesme alanının, önemli metinleri, kontrolleri veya diğer bilgileri kapatmasına izin vermeyin.
  • Hassas düzeyde tanıma gerektiren etkileşimli öğeleri, kesim alanına yerleştirmeyin veya genişletmeyin. Kesme alanında dokunma hassaslığı daha düşük olabilir.
  • Mümkün olduğunda durum çubuğu yüksekliğini almak ve içeriğinize uygulanacak uygun dolguyu belirlemek için WindowInsetsCompat kullanın. İçerik çakışmasına veya kesilmesine yol açabileceğinden, durum çubuğu yüksekliğini kod olarak yazmaktan kaçının.

    Hatalı içe aktarma kurulumu nedeniyle üst tarafta içeriğin kesildiğini gösteren resim
    Şekil 7. İçeriğin üst üste binmesini veya kesilmesini önlemek için WindowInsetsCompat kullanın.
  • Uygulamanızın ne kadar pencere alanı kullandığını belirlemek için View.getLocationInWindow() değerini kullanın. Uygulamanın tüm pencereyi kullandığını varsaymayın ve View.getLocationOnScreen() uygulamasını kullanmayın.

  • Uygulamanızın yoğun içerik moduna geçmesi veya bu moddan çıkması gerekiyorsa shortEdges veya never kesim modlarını kullanın. Varsayılan kesme davranışı, uygulamanızdaki içeriğin sistem çubukları varken kesim alanında oluşturulmasına neden olabilir, ancak yoğun içerik modundayken oluşturmayabilir. Bu, aşağıdaki örnekte gösterildiği gibi, içeriğin geçiş sırasında yukarı ve aşağı hareket etmesine neden olur.

    Geçişler sırasında içeriğin yukarı ve aşağı hareket ettiğini gösteren resim.
    Şekil 8. Geçişler sırasında yukarı ve aşağı hareket eden içeriği gösteren örnek.
  • Yoğun içerik modunda, uygulamanız sinemaskop olduğunda ekranın tamamını kullanmayacağından pencere ve ekran koordinatlarını kullanırken dikkatli olun. Sinemaskop nedeniyle, ekranın başlangıç noktasından alınan koordinatlar, pencere başlangıcından alınan koordinatlarla aynı değildir. getLocationOnScreen() kullanarak ekran koordinatlarını gerektiğinde görünümün koordinatlarına dönüştürebilirsiniz. Aşağıdaki resimde, içeriğin sinemaskop yapıldığında koordinatların nasıl değiştiği gösterilmektedir:

    İçerik sinemaskop olduğunda pencere ve ekran koordinatlarını gösteren resim.
    Şekil 9. İçerik sinemaskop olduğunda pencere ve ekran koordinatlarını karşılaştırır.
  • MotionEvent ile ilgili işlem yaparken benzer koordinat sorunlarını önlemek için MotionEvent.getX() ve MotionEvent.getY() kullanın. MotionEvent.getRawX() veya MotionEvent.getRawY() kullanmayın.

İçeriğinizin nasıl oluşturulduğunu test edin

Uygulamanızın tüm ekranlarını ve deneyimlerini test edin. Mümkünse kesimleri farklı cihazlarda test edin. Kesik kısmı olan bir cihazınız yoksa aşağıdakileri yaparak Android 9 veya sonraki sürümleri çalıştıran herhangi bir cihazda ya da emülatörde yaygın kesim yapılandırmalarını simüle edebilirsiniz:

  1. Geliştirici seçenekleri'ni etkinleştirin.
  2. Geliştirici seçenekleri ekranında Çizim bölümüne gidin ve Kesit içeren bir ekranı simüle et'i seçin.
  3. Kesme türünü seçin.

    Emülatörde ekran kesimi simülasyonunun nasıl yapılacağını gösteren resim
    Şekil 10. İçeriğinizin nasıl oluşturulduğunu test etmek için geliştirici seçeneklerini kullanabilirsiniz.

Ek kaynaklar