Sistem çubuğu koruması hakkında

Uygulamanız SDK 35 veya sonraki sürümleri hedeflediğinde uçtan uca ekran zorunlu kılınır. Sistem durum çubuğu ve hareketle gezinme çubukları şeffafken üç düğmeli gezinme çubuğu yarı saydamdır. Bunu geriye dönük uyumlu hale getirmek için enableEdgeToEdge numaralı telefonu arayın.

Ancak sistem varsayılanları tüm kullanım alanlarında çalışmayabilir. Ne zaman şeffaf veya yarı şeffaf sistem çubukları kullanmanız gerektiğini öğrenmek için Android sistem çubukları tasarım kılavuzu ve uçtan uca tasarım kılavuzuna göz atın.

Şeffaf sistem çubukları oluşturma

Android 15 veya sonraki sürümleri hedefleyerek ya da önceki sürümler için varsayılan bağımsız değişkenlerle enableEdgeToEdge() çağrısı yaparak şeffaf bir hareketle gezinme çubuğu oluşturun. Üç düğmeli gezinme çubuğu için Window.setNavigationBarContrastEnforced öğesini false olarak ayarlayın. Aksi takdirde yarı saydam bir katman uygulanır.

Yarı saydam sistem çubukları oluşturma

Yarı saydam bir durum çubuğu oluşturmak için ana içerikle çakışan ve yerleşimlerle kaplı alanda bir gradyan çizen özel bir composable oluşturun.

class SystemBarProtectionSnippets : ComponentActivity() {

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

        // enableEdgeToEdge sets window.isNavigationBarContrastEnforced = true
        // which is used to add a translucent scrim to three-button navigation
        enableEdgeToEdge()

        setContent {
            MyTheme {
                // Main content
                MyContent()

                // After drawing main content, draw status bar protection
                StatusBarProtection()
            }
        }
    }
}

@Composable
private fun StatusBarProtection(
    color: Color = MaterialTheme.colorScheme.surfaceContainer,
    heightProvider: () -> Float = calculateGradientHeight(),
) {

    Canvas(Modifier.fillMaxSize()) {
        val calculatedHeight = heightProvider()
        val gradient = Brush.verticalGradient(
            colors = listOf(
                color.copy(alpha = 1f),
                color.copy(alpha = .8f),
                Color.Transparent
            ),
            startY = 0f,
            endY = calculatedHeight
        )
        drawRect(
            brush = gradient,
            size = Size(size.width, calculatedHeight),
        )
    }
}

@Composable
fun calculateGradientHeight(): () -> Float {
    val statusBars = WindowInsets.statusBars
    val density = LocalDensity.current
    return { statusBars.getTop(density).times(1.2f) }
}
SystemBarProtectionSnippets.kt

1.Şekil Yarı saydam durum çubuğu.

Uyarlanabilir uygulamalarda, uçtan uca tasarımda görüldüğü gibi her bölmenin renkleriyle eşleşen özel bir composable ekleyin. Yarı saydam bir gezinme çubuğu oluşturmak için Window.setNavigationBarContrastEnforced değerini true olarak ayarlayın.

Önceki
Görünümler ve Oluştur'da iç içe yerleştirilmiş öğeleri kullanma
Sonraki
Kesitler hakkında