Android cihazlar, bağlı ekranlara sorunsuz bir şekilde genişletilebilir

Android'de mobil ve masaüstü bilgisayarları birbirine yaklaştırma konusunda önemli bir dönüm noktasına ulaştığımızı duyurmaktan heyecan duyuyoruz: Bağlı ekran desteği, Android 16 QPR3 sürümüyle genel kullanıma sunuldu.

Google I/O 2025'te gösterildiği gibi, bağlı ekranlar kullanıcıların Android cihazlarını harici bir monitöre bağlamasına ve anında masaüstü pencere ortamına erişmesine olanak tanır. Uygulamalar, serbest biçimli veya tam ekran pencerelerde kullanılabilir. Kullanıcılar, masaüstü işletim sisteminde olduğu gibi çoklu görev yapabilir.

Google ve Samsung, Android 16'nın yüklü olduğu ve harici bir ekrana bağlı Android ekosistemindeki cihazlara sorunsuz ve güçlü bir masaüstü pencereli görüntüleme deneyimi sunmak için işbirliği yaptı. 
Bu özellik, desteklenen Pixel ve Samsung telefonlarını harici monitörlere bağlayabilen kullanıcılar için desteklenen cihazlarda* genel kullanıma sunuldu. Böylece, form faktörlerine uyum sağlayan daha ilgi çekici ve daha verimli uygulama deneyimleri oluşturmak için yeni fırsatlar sunuluyor.

İşleyiş şekli

Desteklenen bir Android telefon veya katlanabilir cihaz harici bir ekrana bağlandığında, bağlı ekranda yeni bir masaüstü oturumu başlatılır.

Bağlı ekrandaki deneyim, etkin uygulamaları gösteren ve kullanıcıların hızlı erişim için uygulamaları sabitlemesine olanak tanıyan görev çubuğu da dahil olmak üzere masaüstü deneyimine benzer. Kullanıcılar, bağlı ekranda serbestçe yeniden boyutlandırılabilen pencerelerde aynı anda birden fazla uygulamayı yan yana çalıştırabilir.

Telefon, harici bir ekrana bağlıyken ekranda masaüstü oturumu açık ve telefon kendi durumunu koruyor.

Pencereli görüntülemeyi destekleyen bir cihaz (ör. Samsung Galaxy Tab S11 gibi bir tablet) harici bir ekrana bağlandığında masaüstü oturumu her iki ekrana da yayılır ve daha da geniş bir çalışma alanı sunulur. İki ekran daha sonra tek bir sürekli sistem olarak çalışır. Bu sayede uygulama pencereleri, içerik ve imleç ekranlar arasında serbestçe hareket edebilir.

Tabletin harici bir ekrana bağlı olması ve masaüstü oturumunun her iki ekrana da genişletilmesi.

Neden önemli?

Android 16 QPR3 sürümünde, bağlı ekran deneyimini tanımlayan pencere davranışlarını, görev çubuğu etkileşimlerini ve giriş uyumluluğunu (fare ve klavye) tamamladık. Ayrıca, pencereleri ölçeklendirmek ve ekranlar arasında geçiş yaparken uygulamaların yeniden başlatılmasını önlemek için uyumluluk çözümleri de ekledik.

Uygulamanız uyarlanabilir tasarım ilkeleriyle oluşturulmuşsa otomatik olarak masaüstü görünümüne ve tarzına sahip olur. Böylece kullanıcılar kendilerini rahat hisseder. Uygulama dikey moda kilitlenmişse veya yalnızca dokunma tabanlı bir arayüz kullanıyorsa modernleştirme zamanı gelmiş demektir.

Özellikle, bağlı ekranlarda optimum uygulama deneyimleri için aşağıdaki temel en iyi uygulamalara dikkat edin:

• Sabit bir Display nesne olduğunu varsaymayın: Uygulamanızın bağlamıyla ilişkili Display nesnesi, bir uygulama penceresi harici bir ekrana taşındığında veya ekran yapılandırması değiştiğinde değişebilir. Uygulamanız, yapılandırma değişikliği etkinliklerini sorunsuz bir şekilde işlemeli ve görüntüleme metriklerini önbelleğe almak yerine dinamik olarak sorgulamalıdır.
• Yoğunluk yapılandırması değişikliklerini hesaba katın: Harici ekranlar, birincil cihaz ekranından çok farklı piksel yoğunluklarına sahip olabilir. Kullanıcı arayüzünün netliğini ve kullanılabilirliğini korumak için düzenlerinizin ve kaynaklarınızın bu değişikliklere doğru şekilde uyum sağladığından emin olun. Düzenler için yoğunluktan bağımsız pikseller (dp) kullanın, yoğunluğa özel kaynaklar sağlayın ve kullanıcı arayüzünüzün uygun şekilde ölçeklendiğinden emin olun.
• Harici çevre birimlerini doğru şekilde destekleyin: Kullanıcılar harici bir monitöre bağlandığında genellikle masaüstü benzeri bir ortam oluşturur. Bu durumda genellikle harici klavye, fare, izleme dörtgeni, web kamerası, mikrofon ve hoparlör kullanılır. Klavye ve fare etkileşimleri için desteği iyileştirin.

Modern araçlarla masaüstünün geleceğine yönelik geliştirme

Masaüstü deneyimini oluşturmanıza yardımcı olacak çeşitli araçlar sunuyoruz. Temel uyarlanabilir kitaplıklarımızdaki en son güncellemeleri özetleyelim.

Yeni pencere boyutu sınıfları: Büyük ve Çok Büyük

Jetpack WindowManager 1.5.0'daki en büyük güncelleme, iki yeni genişlik pencere boyutu sınıfının (Large ve Extra-large) eklenmesidir.

Pencere boyutu sınıfları, uyarlanabilir düzenler tasarlayıp geliştirmenize yardımcı olan, resmi ve belirli bir görüşe dayalı görüntü alanı kesme noktaları grubumuzdur. 1.5.0 sürümüyle birlikte, bu kılavuzu normal tabletlerin boyutunu aşan ekranlar için de geçerli olacak şekilde genişletiyoruz.

Yeni genişlik kesme noktaları şunlardır:

• Büyük: 1.200 dp ile 1.600 dp arasındaki genişlikler için
• Çok büyük: Genişlik ≥1.600 dp olduğunda

Ekran genişliğine göre farklı pencere boyutu sınıfları.

Çok büyük yüzeylerde, tabletin Genişletilmiş düzenini büyütmek her zaman en iyi kullanıcı deneyimini sunmaz. Örneğin, bir e-posta istemcisi, Genişletilmiş pencere boyutu sınıfında iki bölmeyi (bir posta kutusu ve bir ileti) rahatça gösterebilir. Ancak çok büyük bir masaüstü monitöründe e-posta istemcisi, üç hatta dört bölmeyi aynı anda zarif bir şekilde gösterebilir. Örneğin, posta kutusu, ileti listesi, iletinin tam içeriği ve takvim/görevler paneli.

Yeni pencere boyutu sınıflarını projenize dahil etmek için WindowSizeClass.BREAKPOINTS_V1 yerine WindowSizeClass.BREAKPOINTS_V2 kümesindeki işlevi çağırmanız yeterlidir:

val currentWindowMetrics =
    WindowMetricsCalculator.getOrCreate()
    .computeCurrentWindowMetrics(LocalContext.current)

val sizeClass = WindowSizeClass.BREAKPOINTS_V2
    .computeWindowSizeClass(currentWindowMetrics)

Uygulamanızın en az o kadar alana sahip olduğundan emin olduğunuzda doğru düzeni uygulayın:

if(sizeClass.isWidthAtLeastBreakpoint(
    WindowSizeClass.WIDTH_DP_LARGE_LOWER_BOUND)){
    ...
	// Window is at least 1200 dp wide.
}

Jetpack Navigation 3 ile uyarlanabilir düzenler oluşturma

Navigation 3, Jetpack koleksiyonuna en son eklenen bileşendir. Kısa süre önce ilk kararlı sürümüne ulaşan Navigation 3, Compose ile çalışmak üzere tasarlanmış güçlü bir gezinme kitaplığıdır.

Navigation 3, aynı anda birden fazla hedef gösterilmesine ve bu düzenler arasında sorunsuz geçiş yapılmasına olanak tanıyarak uyarlanabilir düzenler oluşturmak için de harika bir araçtır.

Uygulamanızın kullanıcı arayüzü akışını yönetmeye yönelik bu sistem, sahneleri temel alır. Sahne, bir veya daha fazla hedefi aynı anda gösteren bir düzendir. Bir SceneStrategy, sahne oluşturulup oluşturulamayacağını belirler. SceneStrategy örneklerini birlikte zincirleyerek farklı ekran boyutları ve cihaz yapılandırmaları için farklı sahneler oluşturup görüntüleyebilirsiniz.

Liste-ayrıntı ve destek bölmesi gibi kullanıma hazır kanonik düzenler için Compose Material 3 Adaptive kitaplığındaki Scenes'i kullanabilirsiniz (1.3 ve sonraki sürümlerde kullanılabilir).

Ayrıca, Scene tariflerini değiştirerek veya sıfırdan başlayarak kendi özel Scenes'inizi oluşturmak da kolaydır. Örneğin, yan yana üç bölme gösteren bir Sahne'yi ele alalım:

class ThreePaneScene<T : Any>(
    override val key: Any,
    override val previousEntries: List<NavEntry<T>>,
    val firstEntry: NavEntry<T>,
    val secondEntry: NavEntry<T>,
    val thirdEntry: NavEntry<T>
) : Scene<T> {
    override val entries: List<NavEntry<T>> = listOf(firstEntry, secondEntry, thirdEntry)
    override val content: @Composable (() -> Unit) = {
        Row(modifier = Modifier.fillMaxSize()) {
            Column(modifier = Modifier.weight(1f)) {
                firstEntry.Content()
            }
            Column(modifier = Modifier.weight(1f)) {
                secondEntry.Content()
            }
            Column(modifier = Modifier.weight(1f)) {
                thirdEntry.Content()
            }
        }
    }

Bu senaryoda, pencere genişliği yeterliyse ve geri yığınınızdaki girişler üç panelli bir sahnede gösterilmeyi desteklediğini beyan etmişse üç panel göstermek için bir SceneStrategy tanımlayabilirsiniz.

class ThreePaneSceneStrategy<T : Any>(val windowSizeClass: WindowSizeClass) : SceneStrategy<T> {
    override fun SceneStrategyScope<T>.calculateScene(entries: List<NavEntry<T>>): Scene<T>? {
        if (windowSizeClass.isWidthAtLeastBreakpoint(WIDTH_DP_LARGE_LOWER_BOUND)) {
            val lastThree = entries.takeLast(3)
            if (lastThree.size == 3 && lastThree.all { it.metadata.containsKey(MULTI_PANE_KEY) }) {
                val firstEntry = lastThree[0]
                val secondEntry = lastThree[1]
                val thirdEntry = lastThree[2]


                return ThreePaneScene(
                    key = Triple(firstEntry.contentKey, secondEntry.contentKey, thirdEntry.contentKey),
                    previousEntries = entries.dropLast(3),
                    firstEntry = firstEntry,
                    secondEntry = secondEntry,
                    thirdEntry = thirdEntry
                )
            }
        }
        return null
    }
}

NavDisplay öğenizi oluştururken ThreePaneSceneStrategy'nizi diğer stratejilerle birlikte kullanabilirsiniz. Örneğin, üç bölmeyi göstermek için yeterli alan olmadığında iki bölmeyi yan yana göstermek üzere TwoPaneStrategy de ekleyebiliriz.

val strategy = ThreePaneSceneStrategy() then TwoPaneSceneStrategy()

NavDisplay(..., 
  sceneStrategy = strategy,
  entryProvider = entryProvider { 
    entry<MyScreen>(metadata = mapOf(MULTI_PANE_KEY to true))) { ... }
    ... other entries...
  }
)

Üç veya iki bölmeyi görüntülemek için yeterli alan yoksa her iki özel sahne stratejimiz de null değerini döndürür. Bu durumda NavDisplay, SinglePaneScene kullanarak geri yığındaki son girişi tek bir bölmede görüntülemeye geri döner. 

Sahneleri ve stratejileri kullanarak uygulamanıza tek, iki ve üç bölmeli düzenler ekleyebilirsiniz.

Geniş ekranlarda üç panelli gezinme gösteren uyarlanabilir bir uygulama.

Navigation 3'te Sahneler'i kullanarak özel düzenler oluşturma hakkında daha fazla bilgi edinmek için dokümanları inceleyin.

Bağımsız uyarlanabilir düzenler

Bağımsız bir düzene ihtiyacınız varsa Compose Material 3 Adaptive kitaplığı, pencere boyutu sınıflarına veya cihaz duruşlarına göre pencere yapılandırmalarına otomatik olarak uyum sağlayan liste-ayrıntı düzeni ve destekleyici bölme düzenleri gibi uyarlanabilir kullanıcı arayüzleri oluşturmanıza yardımcı olur. 

İyi haber şu ki kitaplık, yeni kesme noktalarıyla zaten güncel durumda. 1.2 sürümünden itibaren, varsayılan bölme iskeleti yönergesi işlevleri, geniş ve çok geniş pencere boyutu sınıflarını destekler.

Yalnızca Gradle derleme dosyanızda yeni kesme noktalarını kullanmak istediğinizi belirterek etkinleştirmeniz gerekir:

currentWindowAdaptiveInfo(supportLargeAndXLargeWidth = true)

Başlarken

En son Android sürümündeki bağlı ekran özelliğini keşfedin. Desteklenen bir cihaza Android 16 QPR3'ü yükleyin, ardından uygulamalarınızı test etmeye başlamak için cihazı harici bir monitöre bağlayın. 

Bu en iyi uygulamaları uygulama hakkında daha fazla bilgi edinmek için çoklu ekran desteği ve pencere yönetimi ile ilgili güncellenmiş belgelere göz atın.

Geri bildirim

Bağlı ekran masaüstü deneyimini geliştirmeye devam ederken geri bildirimleriniz bizim için çok önemli. Düşüncelerinizi paylaşmak ve sorunları bildirmek için resmi geri bildirim kanallarımızı kullanın.

Android'i, kullanıcıların uygulamaları ve cihazlarıyla etkileşim kurmak için kullandığı birçok yönteme uyum sağlayan çok yönlü bir platform haline getirmeye kararlıyız. Bağlı ekran desteğindeki iyileştirmeler de bu yönde atılan bir başka adımdır. Kullanıcılarınızın, oluşturacağınız masaüstü deneyimlerine bayılacağını düşünüyoruz.

*Not: Bu makalenin yazıldığı sırada bağlı ekranlar Pixel 8, 9, 10 serisi ve S26, Fold7, Flip7 ve Tab S11 dahil olmak üzere çok çeşitli Samsung cihazlarda destekleniyordu.