Bu sayfa, Cloud Translation API ile çevrilmiştir.

İçeriği uygulamanızda uçtan uca görüntüleyin

Android 15 veya sonraki sürümleri çalıştıran bir cihazda SDK 35 veya sonraki sürümleri hedeflediğinizde uygulamanız uçtan uca gösterilir. Pencere, sistem çubuklarının arkasına çizilerek ekranın tüm genişliğini ve yüksekliğini kaplar. Sistem çubukları; durum çubuğu, altyazı çubuğu ve gezinme çubuğunu içerir.

Birçok uygulamanın üst kısmında uygulama çubuğu bulunur. Üst uygulama çubuğu, ekranın üst kenarına kadar uzanmalı ve durum çubuğunun arkasında gösterilmelidir. Dilerseniz üst uygulama çubuğu, içerik kaydırıldığında durum çubuğunun yüksekliğine kadar küçülebilir.

Birçok uygulamada alt uygulama çubuğu veya alt gezinme çubuğu da bulunur. Bu çubuklar, ekranın alt kenarına kadar uzanmalı ve gezinme çubuğunun arkasında gösterilmelidir. Aksi takdirde, uygulamalarda gezinme çubuğunun arkasında kaydırılabilir içerik gösterilmelidir.

Şekil 1. Uçtan uca düzende sistem çubukları.

Uygulamanızda uçtan uca düzen uygularken aşağıdakileri göz önünde bulundurun:

Uçtan uca ekranı etkinleştirme
Görsel çakışmalarla ilgilenin.
Sistem çubuklarının arkasında ekran koruyucu göstermeyi düşünebilirsiniz.

durum çubuğunun arkasındaki görüntü örneği — **Şekil 2.** Durum çubuğunun arkasındaki görüntülere örnek.

Uçtan uca ekranı etkinleştirin

Uygulamanız SDK 35 veya sonraki sürümleri hedefliyorsa Android 15 veya sonraki sürümleri çalıştıran cihazlar için uçtan uca otomatik olarak etkinleştirilir.

Önceki Android sürümlerinde kenardan kenara görüntüleme özelliğini etkinleştirmek için aşağıdakileri yapın:

Uygulamanızın veya modülünüzün build.gradle dosyasında androidx.activity kitaplığına bağımlılık ekleyin:

Kotlin

dependencies {
    val activity_version = activity_version
    // Java language implementation
    implementation("androidx.activity:activity:$activity_version")
    // Kotlin
    implementation("androidx.activity:activity-ktx:$activity_version")
}

Groovy

dependencies {
    def activity_version = activity_version
    // Java language implementation
    implementation 'androidx.activity:activity:$activity_version'
    // Kotlin
    implementation 'androidx.activity:activity-ktx:$activity_version'
}

enableEdgeToEdge uzantı işlevini uygulamanıza aktarın:

Activity cihazınızın onCreate bölümünde enableEdgeToEdge'i arayarak uçtan uca ekranı manuel olarak etkinleştirin. setContentView tarihinden önce çağrılması gerekir.

Kotlin

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

Java

     @Override
     protected void onCreate(@Nullable Bundle savedInstanceState) {
       EdgeToEdge.enable(this);
       super.onCreate(savedInstanceState);
       ...
     }

enableEdgeToEdge(), varsayılan olarak sistem çubuklarını şeffaf yapar. Durum çubuğunun yarı saydam bir perde aldığı 3 düğmeli gezinme modu bu kapsamda değildir. Sistem simgelerinin ve kaplamanın renkleri, sistemin açık veya koyu temasına göre ayarlanır.

enableEdgeToEdge() işlevi, uygulamanın kenardan kenara yerleştirilmesi gerektiğini otomatik olarak belirtir ve sistem çubuklarının renklerini ayarlar.

enableEdgeToEdge() işlevini kullanmadan uygulamanızda uçtan uca ekranı etkinleştirmek için Uçtan uca ekranı manuel olarak ayarlama başlıklı makaleyi inceleyin.

İç içe yerleştirilen öğeleri kullanma

Uygulamanızın bazı görünümleri, 3. resimde gösterildiği gibi sistem çubuklarının arkasında çizilebilir.

Ekranın hangi bölümlerinin gezinme çubuğu veya durum çubuğu gibi sistem kullanıcı arayüzüyle kesiştiğini belirten içe yerleştirilen öğelere tepki vererek çakışmalarla ilgili sorunları giderebilirsiniz. Kesişme, içeriğin üzerinde gösterilme anlamına gelebilir ancak uygulamanızı sistem hareketleri hakkında da bilgilendirebilir.

Uygulamanızı kenardan kenara göstermek için geçerli olan içe yerleştirilmiş içerik türleri şunlardır:

Sistem çubuğu iç içe yerleştirilmeleri: Dokunulabilen ve sistem çubukları tarafından görsel olarak gizlenmemesi gereken görünümler için en iyisidir.
Ekran kesme içi boşlukları: Cihazın şekli nedeniyle ekranda kesik olabileceği alanlar için kullanılır.
Sistem hareketi iç içe yerleştirilmeleri: Sistem tarafından kullanılan ve uygulamanızdan öncelikli olan hareketli gezinme alanları için.

Sistem çubuklarının içe yerleştirilmesi

Sistem çubuğu ekleri, en yaygın kullanılan ek türüdür. Bunlar, uygulamanızın üzerindeki Z ekseninde sistem kullanıcı arayüzünün görüntülendiği alanı temsil eder. En iyi kullanım alanları, uygulamanızda dokunulabilir olan ve sistem çubukları tarafından görsel olarak gizlenmemesi gereken görünümleri taşımak veya doldurmaktır.

Örneğin, 3. görseldeki yüzen işlem düğmesi (FAB), gezinme çubuğu tarafından kısmen gizlenmiştir:

Kenardan kenara uygulanmış ancak gezinme çubuğu FAB'ı kaplayan bir örnek — **Şekil 3.** Uçtan uca düzende bir FAB ile çakışan gezinme çubuğu.

Hareket modunda veya düğme modunda bu tür görsel çakışmaların önüne geçmek için WindowInsetsCompat.Type.systemBars() ile birlikte getInsets(int) kullanarak görünümün kenar boşluklarını artırabilirsiniz.

Aşağıdaki kod örneğinde, sistem çubuğu iç içe yerleştirilmelerinin nasıl uygulanacağı gösterilmektedir:

Kotlin

ViewCompat.setOnApplyWindowInsetsListener(fab) { v, windowInsets ->
  val insets = windowInsets.getInsets(WindowInsetsCompat.Type.systemBars())
  // Apply the insets as a margin to the view. This solution sets
  // only the bottom, left, and right dimensions, but you can apply whichever
  // insets are appropriate to your layout. You can also update the view padding
  // if that's more appropriate.
  v.updateLayoutParams<MarginLayoutParams> {
      leftMargin = insets.left,
      bottomMargin = insets.bottom,
      rightMargin = insets.right,
  }

  // Return CONSUMED if you don't want want the window insets to keep passing
  // down to descendant views.
  WindowInsetsCompat.CONSUMED
}

Java

ViewCompat.setOnApplyWindowInsetsListener(fab, (v, windowInsets) -> {
  Insets insets = windowInsets.getInsets(WindowInsetsCompat.Type.systemBars());
  // Apply the insets as a margin to the view. This solution sets only the
  // bottom, left, and right dimensions, but you can apply whichever insets are
  // appropriate to your layout. You can also update the view padding if that's
  // more appropriate.
  MarginLayoutParams mlp = (MarginLayoutParams) v.getLayoutParams();
  mlp.leftMargin = insets.left;
  mlp.bottomMargin = insets.bottom;
  mlp.rightMargin = insets.right;
  v.setLayoutParams(mlp);

  // Return CONSUMED if you don't want want the window insets to keep passing
  // down to descendant views.
    return WindowInsetsCompat.CONSUMED;
});

Bu çözümü 3. resimde gösterilen örneğe uygularsanız düğme modunda görsel çakışma olmaz (4. resimde gösterildiği gibi):

FAB'yi örtmeyen yarı saydam bir gezinme çubuğu — **Şekil 4.** Düğme modunda görsel örtüşmeyi çözme.

Şekil 5'te gösterildiği gibi aynı durum hareketle gezinme modu için de geçerlidir:

hareketle gezinme özelliğine sahip uçtan uca — **Şekil 5.** Hareketle gezinme modunda görsel çakışmaların çözülmesi.

Ekran kesimi iç içe yerleştirilmiş resimleri

Bazı cihazlarda ekran kesikleri bulunur. Kesik genellikle ekranın üst kısmında ve durum çubuğuna dahildir. Cihaz ekranı yatay moddayken kesik dikey kenarda olabilir. Uygulamalar varsayılan olarak ekrandaki boşluğu çizeceğinden, uygulamanızın ekranda gösterdiği içeriğe bağlı olarak ekrandaki boşlukları önlemek için dolgu uygulamanız gerekir.

Örneğin, birçok uygulama ekranında öğelerin listesi gösterilir. Liste öğelerini ekran kesimi veya sistem çubuklarıyla gizlemeyin.

Kotlin

ViewCompat.setOnApplyWindowInsetsListener(binding.recyclerView) { v, insets ->
  val bars = insets.getInsets(
    WindowInsetsCompat.Type.systemBars()
      or WindowInsetsCompat.Type.displayCutout()
  )
  v.updatePadding(
    left = bars.left,
    top = bars.top,
    right = bars.right,
    bottom = bars.bottom,
  )
  WindowInsetsCompat.CONSUMED
}

Java

ViewCompat.setOnApplyWindowInsetsListener(mBinding.recyclerView, (v, insets) -> {
  Insets bars = insets.getInsets(
    WindowInsetsCompat.Type.systemBars()
    | WindowInsetsCompat.Type.displayCutout()
  );
  v.setPadding(bars.left, bars.top, bars.right, bars.bottom);
  return WindowInsetsCompat.CONSUMED;
});

Sistem çubuklarının ve ekran kesik türlerinin mantıksal veya değerini alarak WindowInsetsCompat değerini belirleyin.

Dolgunun liste öğeleriyle birlikte kaydırılmasını sağlamak için clipToPadding değerini RecyclerView olarak ayarlayın. Bu, aşağıdaki örnekte gösterildiği gibi, kullanıcı sayfayı kaydırdığında öğelerin sistem çubuklarının arkasına gitmesine olanak tanır.

<androidx.recyclerview.widget.RecyclerView
    android:id="@+id/recycler_view"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:clipToPadding="false"
    app:layoutManager="androidx.recyclerview.widget.LinearLayoutManager" />

Sistem hareketi iç içe yerleştirilmeleri

Sistem hareketi ekleri, sistem hareketlerinin uygulamanıza göre öncelikli olduğu pencere alanlarını temsil eder. Bu alanlar Şekil 6'da turuncu renkte gösterilmiştir:

Sistem hareketi eklerine örnek — **Şekil 6.** Sistem hareketi ekleri.

Sistem çubuğu iç içe yerleştirilmeleri gibi, sistem hareketi iç içe yerleştirilmelerini de getInsets(int) ile WindowInsetsCompat.Type.systemGestures() kullanarak örtüşmesini önleyebilirsiniz.

Kaydırılabilir görünümleri kenarlardan uzaklaştırmak veya doldurmak için bu iç içe yerleştirilmiş öğeleri kullanın. Sık kullanılan kullanım alanları arasında alt sayfalar, oyunlarda kaydırma ve ViewPager2 kullanılarak uygulanan bantlar yer alır.

Android 10 veya sonraki sürümlerde sistem hareketi ek öğeleri ana sayfa hareketi için bir alt, geri hareketleri için de sol ve sağ ek kısım içerir:

sistem hareketi içe yerleştirilmiş ölçümleri gösteren örnek — **Şekil 7.** Sistem hareketi içe yerleştirilmiş ölçümleri.

Aşağıdaki kod örneğinde, sistem hareketi iç içe eklemelerinin nasıl uygulanacağı gösterilmektedir:

Kotlin

ViewCompat.setOnApplyWindowInsetsListener(view) { view, windowInsets ->
    val insets = windowInsets.getInsets(WindowInsetsCompat.Type.systemGestures())
    // Apply the insets as padding to the view. Here, set all the dimensions
    // as appropriate to your layout. You can also update the view's margin if
    // more appropriate.
    view.updatePadding(insets.left, insets.top, insets.right, insets.bottom)

    // Return CONSUMED if you don't want the window insets to keep passing down
    // to descendant views.
    WindowInsetsCompat.CONSUMED
}

Java

ViewCompat.setOnApplyWindowInsetsListener(view, (v, windowInsets) -> {
    Insets insets = windowInsets.getInsets(WindowInsetsCompat.Type.systemGestures());
    // Apply the insets as padding to the view. Here, set all the dimensions
    // as appropriate to your layout. You can also update the view's margin if
    // more appropriate.
    view.setPadding(insets.left, insets.top, insets.right, insets.bottom);

    // Return CONSUMED if you don't want the window insets to keep passing down
    // to descendant views.
    return WindowInsetsCompat.CONSUMED;
});

Material Bileşenleri

Görünüme dayalı birçok Android Materyal Bileşeni (com.google.android.material){:.external} BottomAppBar, BottomNavigationView, NavigationRailView ve NavigationView dahil olmak üzere içe yerleştirilmeleri otomatik olarak işler.

Ancak AppBarLayout, iç içe yerleştirilmeleri otomatik olarak işlemez. Üst iç içe eklemeleri işlemek için android:fitsSystemWindows="true" ekleyin.

Compose'da Materyal Bileşenleri ile eklerin nasıl işleneceğini öğrenin.

Yoğun içerik modu

Bazı içerikler tam ekranda daha iyi deneyimlenir ve kullanıcıya daha sürükleyici bir deneyim sunar. WindowInsetsController ve WindowInsetsControllerCompat kitaplıklarını kullanarak sistem çubuklarını ve tam ekran modunu gizleyebilirsiniz:

Kotlin

val windowInsetsController =
      WindowCompat.getInsetsController(window, window.decorView)

// Hide the system bars.
windowInsetsController.hide(Type.systemBars())

// Show the system bars.
windowInsetsController.show(Type.systemBars())

Java

Window window = getWindow();
WindowInsetsControllerCompat windowInsetsController =
      WindowCompat.getInsetsController(window, window.getDecorView());
if (windowInsetsController == null) {
    return;
  }
// Hide the system bars.
windowInsetsController.hide(WindowInsetsCompat.Type.systemBars());

// Show the system bars.
windowInsetsController.show(WindowInsetsCompat.Type.systemBars());

Bu özelliği uygulama hakkında daha fazla bilgi için Tamamlayıcı mod için sistem çubuklarını gizleme başlıklı makaleyi inceleyin.

Sistem çubuğu koruması

Uygulamanız SDK 35 veya sonraki sürümleri hedeflediğinde uçtan uca zorunlu kılınır. Sistem durum çubuğu ve hareketle gezinme çubukları şeffaftır ancak üç düğmeli gezinme çubuğu yarı saydamdır.

Varsayılan üç düğmeli gezinme arka plan korumasını kaldırmak için Window.setNavigationBarContrastEnforced değerini false olarak ayarlayın.

Ek kaynaklar

WindowInsets, hareketle gezinme ve içe yerleştirilen öğelerin işleyiş şekli hakkında daha fazla bilgi için aşağıdaki referanslara göz atın: