Window Size Class — nedir, boyut sınıfları ve geliştirme

Window Size Class nedir?

Window Size Class, Jetpack WindowManager kitaplığına dahil olan ve uygulama penceresinin kullanılabilir alanını üç kategoriye ayıran bir Android platform API'sidir. Kaynak niteleyicileri (small/large/xlarge) ile geleneksel yaklaşımın aksine, Window Size Class geliştiricinin arayüzü tasarlarken güvenebileceği ayrı bir değer kümesi sağlar.

API, Android 7.0 Nougat'ta çoklu pencere modu desteğinin bir parçası olarak ortaya çıktı, ancak aktif benimseme Jetpack WindowManager 1.1 (2022) ile başladı. Google, Display.getSize() aracılığıyla ekran genişliğini kontrol etmek yerine uyarlanabilir düzenler oluşturmak için Window Size Class'ı ana araç olarak önerir.

Sınıflandırma, fiziksel boyut veya piksel yoğunluğuna değil, dp cinsinden pencere genişliğine dayanır. Bu, farklı çözünürlüklere ancak dp cinsinden aynı genişliğe sahip iki cihazın aynı sınıfı alacağı anlamına gelir — arayüz tahmin edilebilir şekilde aynı olacaktır.

Android'de üç pencere boyut sınıfı

Compact — 600 dp'ye kadar genişlikteki pencereler için sınıf. Portre modunda telefon, katlanmış durumda çoğu katlanabilir cihaz (Galaxy Z Flip). Arayüz tek sütunda oluşturulur, Bottom Navigation ile gezinme.

Medium — 600–840 dp genişliğindeki pencereler için sınıf. Portrede tablet, manzarada telefon, yarı açık durumda katlanabilir cihaz. Arayüz iki sütun kullanır — örneğin, solda liste ve sağda ayrıntılar. Navigation Rail, Bottom Navigation!ın yerini alır.

Expanded — 840 dp'den geniş pencereler için sınıf. Manzarada tablet, masaüstü penceresi, açık durumda katlanabilir cihaz. Arayüz üç veya daha fazla panel, Permanent Navigation Drawer, araç panelleri kullanabilir.

Material Design 3'te her sınıf için uyarlanabilir bileşenler tanımlanmıştır: Medium için Navigation Rail, Expanded için Navigation Drawer, Compact için Bottom Navigation. Geliştiricinin breakpoints seçmesi gerekmez — bunlar zaten API tarafından tanımlanmıştır.

Window Size Class nasıl çalışır

Window Size Class, sistem öğeleri — durum çubuğu, gezinme çubuğu, Split Screen'te ekran bölünmesi — dikkate alınarak uygulama penceresinin dp cinsinden mevcut genişliğine göre hesaplanır. API, pencere yapılandırması değiştiğinde tetiklenir: cihaz döndürme, çoklu pencere moduna geçiş, katlanabilir cihazı açma.

Sınıfı elde etmek için androidx.window kitaplığından WindowSizeClass sınıfı kullanılır. Geliştirici, manuel onConfigurationChanged işleme olmadan pencere boyutundaki her değişiklikte sınıfı otomatik olarak güncelleyen bir Flow (Kotlin) veya LiveData (Java)!a abone olur.

Sınıflandırma üç adımda gerçekleşir. Birinci — mevcut pencere genişliğini piksel cinsinden ölçme. İkinci — DisplayMetrics.density aracılığıyla dp'ye dönüştürme. Üçüncü — elde edilen değeri eşiklerle karşılaştırma: 600 dp'den az — Compact, 600–840 — Medium, 840'dan — Expanded.

val windowSizeClass = currentWindowAdaptiveInfo().windowSizeClass()

when (windowSizeClass.windowWidthSizeClass) {
    WindowWidthSizeClass.COMPACT -> // compact width
    WindowWidthSizeClass.MEDIUM  -> // medium width
    WindowWidthSizeClass.EXPANDED -> // expanded width
}

Genişliğin (windowWidthSizeClass) yanı sıra, API pencere yüksekliği için bir sınıf (windowHeightSizeClass) sağlar — manzara yönelimi ve masaüstü pencereleri için kullanışlıdır.

Jetpack Compose'ta Window Size Class

Jetpack Compose'ta Window Size Class, genişlik ve yükseklik sınıflarıyla WindowAdaptiveInfo döndüren currentWindowAdaptiveInfo() işlevi aracılığıyla kullanılır. Bu işlev yalnızca pencere boyutunu değil, aynı zamanda giriş türünü (klavye, fare, dokunma) — WindowPosture ve WindowLayoutInfo aracılığıyla — da dikkate alır.

Tipik bir senaryo, sınıfa göre düzenler arasında geçiş yapmaktır. Örneğin, Compact!ta seçimli bir BottomSheet görüntülenir, Medium'da — bir yan panel, Expanded'da — kalıcı bir Navigation Drawer.

@Composable
fun AdaptiveNavigation(windowSizeClass: WindowWidthSizeClass) {
    when (windowSizeClass) {
        WindowWidthSizeClass.COMPACT -> BottomNavigation()
        WindowWidthSizeClass.MEDIUM  -> NavigationRail()
        WindowWidthSizeClass.EXPANDED -> NavigationDrawer()
    }
}

Material Design 3'te NavigationSuiteScaffold bileşenleri otomatik olarak Window Size Class!a uyum sağlar — geliştiricinin koşullu mantık yazması gerekmez.

Window Size Class ve Material Design 3

Material Design 3 (Material You), Window Size Class ile tamamen entegredir. Material 3'teki uyarlanabilir düzen sistemi, her sınıf için hangi gezinme bileşeninin kullanılacağını belirler: Compact için BottomNavigation, Medium için NavigationRail, Expanded için NavigationDrawer.

Bu entegrasyon, Window Size Class!ı diğer sinyallerle — FoldState (katlanabilir cihaz) ve WindowPosture (ekran konumu) — birleştiren Adaptive API düzeyinde çalışır. Adaptive API, material3-adaptive kitaplığı aracılığıyla kullanılabilir.

Material 3, dört uyarlanabilir üst düzey bileşen sağlar: ListDetailPaneScaffold, SupportingPaneScaffold, NavigationSuiteScaffold ve AdaptiveSheet. Her biri, ek yapılandırma olmadan Window Size Class!a göre davranışını değiştirir.

Uyarlanabilir düzenlerin avantajları

Window Size Class kullanımı, mobil geliştirmede üç temel avantaj sağlar. Birinci — tahmin edilebilirlik: yüzlerce ekran boyutu kombinasyonu yerine, geliştirici üç sınıfla çalışır. Bu, test senaryolarının sayısını ve düzenle ilgili hataları kökten azaltır.

İkinci — çoklu pencere moduna otomatik uyum. Kullanıcı Split Screen'e girdiğinde, pencere genişliği değişir — Window Size Class anında yeniden hesaplanır ve arayüz uyum sağlar. Bu API olmadan, bölünmüş ekrandaki uygulama telefon arayüzünün küçültülmüş bir sürümünü gösterir.

Üçüncü — Material Design 3 ile tutarlılık. Google, Window Size Class!ı uyarlanabilir bileşen sistemine yerleştirdi, bu nedenle Material 3 üzerine kurulu arayüzler, ek çalışma gerektirmeden otomatik olarak büyük ekran tasarımı için Google!ın önerilerini takip eder.