Защита системной панели

Если ваше приложение поддерживает SDK 35 или более позднюю версию, показ от края до края будет включен. Системная строка состояния и панель навигации жестами прозрачны, а панель навигации тремя кнопками – полупрозрачна. Вызовите enableEdgeToEdge, чтобы обеспечить обратную совместимость.

Однако системные настройки по умолчанию могут не подходить для всех случаев использования. Ознакомьтесь с рекомендациями по дизайну системных панелей Android и рекомендациями по дизайну с использованием всей площади экрана, чтобы узнать, когда следует использовать прозрачные или полупрозрачные системные панели.

Как создать прозрачные системные строки

Создайте прозрачную панель навигации жестами, выбрав в качестве целевой ОС Android 15 или более позднюю версию или вызвав метод enableEdgeToEdge() с аргументами по умолчанию для более ранних версий. Если вы используете панель навигации с тремя кнопками, задайте для параметра Window.setNavigationBarContrastEnforced значение false. В противном случае будет применен полупрозрачный экран.

Как создать полупрозрачные системные панели

Чтобы создать полупрозрачную строку состояния, создайте собственную composable-функцию, которая перекрывает основной контент и рисует градиент в области, покрытой отступами.

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,
) {
    Spacer(
        modifier = Modifier
            .fillMaxWidth()
            .height(
                with(LocalDensity.current) {
                    (WindowInsets.statusBars.getTop(this) * 1.2f).toDp()
                }
            )
            .background(
                brush = Brush.verticalGradient(
                    colors = listOf(
                        color.copy(alpha = 1f),
                        color.copy(alpha = 0.8f),
                        Color.Transparent
                    )
                )
            )
    )
}

Рисунок 1. Полупрозрачная строка состояния.

Для адаптивных приложений вставьте специальный компонент, который соответствует цветам каждой панели, как показано в разделе Дизайн от края до края. Чтобы создать полупрозрачную панель навигации, установите для параметра Window.setNavigationBarContrastEnforced значение true.