3. malzeme iç içe yerleştirilmiş öğeleri kullanma

Kullanım kolaylığı için, yerleşik Material 3 composable'larının (androidx.compose.material3) çoğu, composable'ların Material spesifikasyonlarına göre uygulamanıza nasıl yerleştirildiğine bağlı olarak yerleştirmeleri kendileri yönetir.

Not: Material 2 bileşenleri (androidx.compose.material) yerleştirmeleri otomatik olarak işlemez. Ancak, ekleri alıp manuel olarak uygulayabilirsiniz. androidx.compose.material 1.6.0 ve sonraki sürümlerde, windowInsets parametresini kullanarak BottomAppBar, TopAppBar, BottomNavigation ve NavigationRail için iç kısımları manuel olarak uygulayın. Aynı şekilde, Scaffold için contentWindowInsets parametresini kullanın. Aksi takdirde, iç kısımları manuel olarak dolgu şeklinde uygulayın.

Inset işleme composable'ları

Aşağıda, otomatik olarak iç kısımları işleyen Material Components listelenmiştir.

Uygulama çubukları

• TopAppBar / SmallTopAppBar / CenterAlignedTopAppBar / MediumTopAppBar / LargeTopAppBar: Pencerenin üst kısmında kullanıldığından sistem çubuklarının üst ve yatay kenarlarını dolgu olarak uygular.
• BottomAppBar: Sistem çubuklarının alt ve yatay taraflarını dolgu olarak uygular.

İçerik kapsayıcıları

• ModalDrawerSheet / DismissibleDrawerSheet / PermanentDrawerSheet (modal gezinme çekmecesi içindeki içerik): İçeriğe dikey ve başlangıç iç boşlukları uygular.
• ModalBottomSheet: Alt iç boşlukları uygular.
• NavigationBar : Alt ve yatay iç kenarları uygular.
• NavigationRail: Dikey ve başlangıç iç kenarlarını uygular.

İskele

Varsayılan olarak, Scaffold kullanmanız ve yararlanmanız için PaddingValues parametresi olarak dolgular sağlar. Scaffold, içeriklere yerleştirmeler uygulamaz. Bu sorumluluk size aittir. Örneğin, bu ekleri Scaffold içinde LazyColumn ile kullanmak için:

Scaffold { innerPadding ->
    // innerPadding contains inset information for you to use and apply
    LazyColumn(
        // consume insets as scaffold doesn't do it by default
        modifier = Modifier.consumeWindowInsets(innerPadding),
        contentPadding = innerPadding
    ) {
        // ..
    }
}
InsetsSnippets.kt

Aşağıdaki videoda, kenardan kenara ekranın devre dışı bırakıldığı ve etkinleştirildiği bir Scaffold içindeki LazyColumn gösterilmektedir:

Scaffold içinde PaddingValues parametresini kullanmak, kullanıcı arayüzünüzü sistem kullanıcı arayüzünden ve ekran kesiklerinden uzaklaştırmak için genellikle yeterlidir. Kullanıcı arayüzünüze çok fazla dolgu uygulamamak için Scaffold kullanıyorsanız cetveller, dolgu değiştiriciler veya iç boyut değiştiriciler gibi ek iç işleme yaklaşımları kullanmaktan kaçının.

Varsayılan iç boşlukları geçersiz kılma

Composable'ın davranışını yapılandırmak için composable'a aktarılan windowInsets parametresini değiştirebilirsiniz. Bu parametre, bunun yerine uygulanacak farklı bir pencere yerleştirme türü olabilir veya boş bir örnek iletilerek devre dışı bırakılabilir: WindowInsets(0, 0, 0, 0).

Örneğin, LargeTopAppBar üzerinde yerleştirme işlemeyi devre dışı bırakmak için windowInsets parametresini boş bir örneğe ayarlayın:

LargeTopAppBar(
    windowInsets = WindowInsets(0, 0, 0, 0),
    title = {
        Text("Hi")
    }
)
InsetsSnippets.kt