Oluşturma sırasında kesmeler

Ekran kesimi, bazı cihazlarda ekrana kadar uzanan bir alandır teşekkür ederiz. Cihazın ön tarafında önemli sensörler için yer sağlarken kenardan kenara bir deneyim sunar.

Dikey modda kesit örneği
Şekil 1. Dikey modda kesit örneği
Yatay modda kesit örneği
Şekil 2. Yatay modda kesit örneği

Android, Android 9 (API düzeyi 28) yüklü cihazlarda ekran kesimlerini ve daha yüksek olabilir. Ancak cihaz üreticileri, Android 8.1 veya daha eski sürümlerin yüklü olduğu cihazlarda da ekran kesiklerini destekleyebilir.

Bu sayfada, aşağıda kesmelere sahip cihazlar için desteğin nasıl uygulanacağı açıklanmaktadır: Kesme alanıyla (uçtan uca) nasıl çalışılacağı da dahil olmak üzere kompozisyon oluşturun kesmeyi içeren ekran yüzeyinde 3-3 kare olacak şekilde.

Varsayılan büyük/küçük harf

Ekran kesikleri varsayılan olarak pencere içe eklemelerine dahil edilir. Bu nedenle, takip ettiğinizde uygulamanız ekran kesimi alanlarını çizmez kılavuzumuza gidin.

Örneğin, Modifier.windowInsetsPadding(WindowInsets.safeContent) veya Modifier.windowInsetsPadding(WindowInsets.safeDrawing) kullanırken uygulamanız, kesitin yerleştirildiği alanları otomatik olarak çizmez. Hem WindowInsets.safeContent hem de WindowInsets.safeDrawing, ekrandaki kesik bilgileri içerir ve cihazdaki kesiklerin bulunduğu yerde çizim yapmaz.

override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)

    WindowCompat.setDecorFitsSystemWindows(window, false)

    setContent {
        Box(Modifier.windowInsetsPadding(WindowInsets.safeContent)) {
            // Any composable inside here will avoid drawing behind cutouts
        }
    }
}

Bu davranışı daha da özelleştirmek için kırpma bilgilerini kendiniz işlemeniz gerekir.

Kesme bilgilerini manuel olarak işleme

Kesitleri aşağıdaki yöntemlerden birini kullanarak işleyebilirsiniz:

Compose için windowLayoutInDisplayCutoutMode öğesinin default ve ardından WindowInsets.displayCutout avantajlarından yararlanın inset'leri işlemek için aşağıdaki adımları uygulayın:

Canvas(modifier = Modifier.fillMaxSize().windowInsetsPadding(WindowInsets.displayCutout)) {
    drawRect(Color.Red, style = Stroke(2.dp.toPx()))
}

Bu yaklaşım, gerektiğinde displayCutout dolgusunu dikkate almanıza olanak tanır. veya gerekmediğinde göz ardı edebilirsiniz.

Alternatif olarak, etkinlik temasını android:windowLayoutInDisplayCutoutMode başka bir seçeneğe ayarlayarak veya window.attributes.layoutInDisplayCutoutMode = LAYOUT_IN_DISPLAY_CUTOUT_MODE_DEFAULT'ı kullanarak pencere özelliğini ayarlayarak Görüntü Kesintisi dokümanlarında açıklanan ayarları da uygulayabilirsiniz. Ancak kesme modu uygulanır. ve bağımsız composable bazında kontrol edilemez.

Belirli kompozisyonlarda ekrandaki kesiklerin dikkate alınmasını, diğerlerinde ise dikkate alınmamasını istiyorsanız WindowInset.displayCutout öğesini kullanın. Bu API, gerektiğinde kesit bilgilerine erişmenize olanak tanır.

En iyi uygulamalar

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

  • Kullanıcı arayüzündeki önemli öğelerin yerleşimine dikkat edin. URL'nin kesme alanı önemli metinlerin, kontrollerin veya diğer bilgilerin görünmesini engeller.
  • Hassas dokunuş gerektiren etkileşimli öğeleri yerleştirmeyin veya genişletmeyin. kesme alanına da dâhildir. Dokunma hassasiyeti kesme alanından yararlanın.
  • Kenardan kenara yönlendirme uygulanırken, safeDrawing / safeContent iç içe yerleştirilmiş resimlerine kesik bilgileri eklenir.
  • Mümkünse Modifier.windowInsetsPadding(WindowInsets.safeDrawing) kullan uygun dolguyu belirlemenizi öneririz. İçeriklerin örtüşmesine veya kesilmesine neden olabileceğinden durum çubuğu yüksekliğini sabit kodlamaktan kaçının.

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

Uygulamanızın tüm ekranlarını ve deneyimlerini test ettiğinizden emin olun. Şu cihazlarda test edin: farklı kesme türlerini kullanın. Kesikli ekrana sahip bir cihazınız yoksa aşağıdakileri yaparak Android 9 veya sonraki bir sürümün yüklü olduğu herhangi bir cihazda ya da emülatörde yaygın kesik ekran yapılandırmalarını simüle edebilirsiniz:

  1. Geliştirici seçeneklerini etkinleştirin.
  2. Geliştirici seçenekleri ekranında Çizim bölümüne gidip Kesimli ekranı simüle et'i seçin.
  3. Çıkarma türünü seçin.
    emülatörde ekran kesimi simülasyonu
    Şekil 3. İçeriğinizin nasıl oluşturulduğunu test etmek için Geliştirici seçeneklerini kullanın.