Android 15 veya sonraki sürümleri çalıştıran bir cihazda SDK 35 ya da sonraki sürümleri hedefledikten sonra uygulamanız uçtan uca görüntülenir. Pencere, genişliğin ve yüksekliğin tamamını kapsar. arkasına çizim yaparak daha kolay bir şekilde görüntüleyebilirsiniz. Sistem çubuklarında durum başlık çubuğu ve gezinme çubuğu.
Birçok uygulamanın bir üst uygulama çubuğu vardır. Üst uygulama çubuğu, sayfanın üst kenarına doğru uzanmalıdır. ve durum çubuğunun arkasında görüntülenir. İsteğe bağlı olarak üst uygulama çubuğu içerik kaydırıldığında durum çubuğunun yüksekliğine kadar daraltır.
Birçok uygulamanın alt uygulama çubuğu veya alt gezinme çubuğu da vardır. Bu çubuklar ekranın alt kenarına kadar uzatılır ve gezinme bölümünün arkasında görüntülenir çubuk. Aksi takdirde, uygulamalar gezinme çubuğunun arkasında kayan içerik göstermelidir.
Uygulamanızda uçtan uca düzen uygularken aşağıdakileri göz önünde bulundurun: zihin:
- Uçtan uca ekranı etkinleştirme
- Görsel çakışmaları düzeltin.
- Çerçeveleri sistem çubuklarının arkasında gösterebilirsiniz.
Uçtan uca ekranı etkinleştirin
Uygulamanız SDK 35 veya sonraki sürümleri hedefliyorsa uçtan uca Android 15 veya sonraki sürümlere sahip cihazlar.
Önceki Android sürümlerinde uçtan uca etkinleştirmek için aşağıdakileri yapın:
androidx.activity
kitaplığındaki Uygulamanızın veya modülünüzünbuild.gradle
dosyası:Kotlin
dependencies { val activity_version =
activity_version
// Java language implementation implementation("androidx.activity:activity:$activity_version") // Kotlin implementation("androidx.activity:activity-ktx:$activity_version") }Eski
dependencies { def activity_version =
activity_version
// Java language implementation implementation 'androidx.activity:activity:$activity_version' // Kotlin implementation 'androidx.activity:activity-ktx:$activity_version' }enableEdgeToEdge
dosyasını içe aktarın uzantı işlevini uygulamanıza ekleyin:
enableEdgeToEdge
çağrısı yaparak uçtan uca manuel olarak etkinleştirin
Activity
içinde onCreate
. 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); ... }
Varsayılan olarak enableEdgeToEdge()
,
Durum çubuğunun yarı saydam bir çerçeve oluşturduğu 3 düğmeli gezinme modu. İlgili içeriği oluşturmak için kullanılan
sistem simgelerinin ve kaplamanın renkleri sisteme göre ayarlanır
açık veya koyu tema.
enableEdgeToEdge()
işlevi, uygulamanın
baştan sona yerleştirilir ve sistem çubuklarının renklerini ayarlar.
Uygulamanızda
enableEdgeToEdge()
işlevi için bkz.
Uçtan uca ekranı manuel olarak ayarlayın.
Ekleri kullanarak çakışmaları ele alma
Uygulamanızın bazı görünümleri, aşağıdaki gibi olduğu gibi sistem çubuklarının gerisinde kalabilir: 3.
Çakışmaları, eklemelerin hangi kısımlarının belirleyeceğini belirten eklere tepki vererek ele alabilirsiniz. Ekran, gezinme çubuğu veya durum çubuğu gibi sistem kullanıcı arayüzüyle kesişiyor çubuk. Kesişme, içeriğin üzerinde gösterilmesi anlamına gelebilir hakkında daha fazla bilgi edinin.
Uygulamanızı uçtan uca görüntülemek için geçerli olan ek türleri şunlardır:
Sistem çubuğu eklemeleri: Dokunulabilen ve dokunulmaması gereken görünümler için idealdir sistem çubukları tarafından görsel olarak bulanıklaştırılamaz.
Ekran kesimi ekleri: Ekran kesimi olabilecek alanlar için (cihazın şeklinden dolayı)
Sistem hareketi ekleri: Sistem tarafından kullanılan hareketle gezinme alanları için daha öncelikli hale getirmeniz gerekir.
Sistem çubuğu ekleri
Sistem çubuğu ekleri, en yaygın kullanılan ek türüdür. Temsilciler sistem kullanıcı arayüzünün, uygulamanızın üzerindeki Z ekseninde görüntülediği alan. Onlar en iyi Uygulamanızda dokunulabilen ve engellenmemesi gereken görünümleri taşımak için kullanılır sistem çubukları tarafından görsel olarak bulanıklaştırılmasına olanak tanır.
Örneğin, kayan işlem düğme (FAB) üzerindeki gezinme çubuğu tarafından sınırlandırıldığından:
Hareket veya düğme modunda bu tür görsel çakışmaları önlemek için
görünümün kenar boşluklarını
getInsets(int)
şununla:
WindowInsetsCompat.Type.systemBars()
.
Aşağıdaki kod örneğinde sistem çubuğu girişlerinin 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ü Şekil 3'te gösterilen örneğe uygularsanız Şekil 4'te gösterildiği gibi düğme modunda görsel çakışma:
Şekil 5'te gösterildiği gibi aynı durum hareketle gezinme modu için de geçerlidir:
Ekran kesimi ekleri
Bazı cihazlarda ekran kesimleri vardır. Genellikle kesim noktası, ve durum çubuğuna dahil edilir. Cihaz ekranı yatay durumdayken modundaysa kesim dikey kenarda olabilir. Uygulamanızın içeriğine bağlı olarak görüntüsü yoksa, kesilmelerini önlemek için dolgu uygulamanız gerekir. Uygulamalar varsayılan olarak ekran kesiminde çizim yapar.
Örneğin, birçok uygulama ekranında bir öğe listesi gösterilir. Liste öğelerini gizleme veya sistem çubuklarıyla gösterir.
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; });
WindowInsetsCompat
değerini,
ekran kesimi türlerini seçin.
DolgununclipToPadding
RecyclerView
liste öğeleri. Bu, kullanıcı aşağıdaki işlemleri gerçekleştirdiğinde öğelerin sistem çubuklarının gerisine gitmesine olanak tanır.
aşağıdaki örnekte gösterildiği gibi kaydırılı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 ekleri
Sistem hareketi ek öğeleri, pencerenin sistem hareketlerinin olduğu alanları temsil eder daha öncelikli hale getirebilirsiniz. Bu alanlar Şekil 6'da turuncu renkle gösterilmiştir:
Sistem çubuğu eklerinde olduğu gibi, sistem hareketinin içe aktarılmalarını önlemek için
kullanarak
getInsets(int)
şununla:
WindowInsetsCompat.Type.systemGestures()
.
Kaydırılabilir görünümleri kenarlardan uzağa taşımak veya dolguyla taşımak için bu ek öğeleri kullanın. Yaygın kullanım
Örneğin, alt sayfalar,
Kaydırma özelliğinin kullanıldığı oyunlarda ve bantlarda
ViewPager2
.
Android 10 veya sonraki sürümlerde sistem hareketi ek öğeleri ana ekran hareketi ve geri hareketleri için sol ve sağ ek:
Aşağıdaki kod örneğinde, sistem hareketi etiketlerinin 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şenleri
(com.google.android.material){:.external} aşağıdaki gibi ekleri otomatik olarak işler:
BottomAppBar
,
BottomNavigationView
,
NavigationRailView
ve NavigationView
Ancak, AppBarLayout
insetleri otomatik olarak işlemez. Ekle
android:fitsSystemWindows="true"
veya setOnApplyWindowInsetsListener
kullanın.
Eklerin nasıl ele alınacağını öğrenin E-posta Yazma'daki Materyal Bileşenleri.
Yoğun içerik modu
Bazı içerikler en iyi tam ekranda deneyimlenerek kullanıcıya daha iyi bir deneyim sunar.
etkileyici bir deneyim sunabilir. Yoğun içerik modu için sistem çubuklarını gizlemek amacıyla şu komutu kullanabilirsiniz:
WindowInsetsController
ve
WindowInsetsControllerCompat
kitaplıklar:
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());
Yoğun içerik modu için sistem çubuklarını gizleme bölümüne bakın. ziyaret edin.
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: