看問題本質,設置全面屏,是系統視窗的行為,與 View 和 Compose 有什麼關係呢? 所以,原理和傳統 View 視圖是一樣的,甚至 Api 都是一模一樣的,不熟悉的可以看我之前的文章。傳送門: Android 全面屏體驗 那為什麼還要寫這篇文章呢?主要是在 Compose 中寫法上的一些區別 ...
看問題本質,設置全面屏,是系統視窗的行為,與 View 和 Compose 有什麼關係呢?
所以,原理和傳統 View 視圖是一樣的,甚至 Api 都是一模一樣的,不熟悉的可以看我之前的文章。傳送門:
那為什麼還要寫這篇文章呢?主要是在 Compose 中寫法上的一些區別,直接上代碼:
找到主題設置的代碼,預設生成的主題如下:
@Composable
fun HelloComposeTheme(
darkTheme: Boolean = isSystemInDarkTheme(),
// Dynamic color is available on Android 12+
dynamicColor: Boolean = true,
content: @Composable () -> Unit
) {
val colorScheme = when {
dynamicColor && Build.VERSION.SDK_INT >= Build.VERSION_CODES.S -> {
val context = LocalContext.current
if (darkTheme) dynamicDarkColorScheme(context) else dynamicLightColorScheme(context)
}
darkTheme -> DarkColorScheme
else -> LightColorScheme
}
val view = LocalView.current
if (!view.isInEditMode) {
SideEffect {
val window = (view.context as Activity).window
window.statusBarColor = colorScheme.primary.toArgb()
WindowCompat.getInsetsController(window, view).isAppearanceLightStatusBars = darkTheme
}
}
MaterialTheme(
colorScheme = colorScheme,
typography = Typography,
content = content
)
}
與系統狀態欄,導航欄相關的代碼:
修改如下:
val view = LocalView.current
if (!view.isInEditMode) {
SideEffect {
val window = (view.context as Activity).window
// window.statusBarColor = colorScheme.primary.toArgb()
// 設置狀態欄和導航欄透明
window.statusBarColor = Color.TRANSPARENT
window.navigationBarColor = Color.TRANSPARENT
// 讓內容可以顯示到狀態欄和導航欄下麵區域
WindowCompat.setDecorFitsSystemWindows(window, false)
// light 主題顯示深色,dark 主題顯示淺色,強制顯示深色,就設為 true, 前置顯示淺色就設為 false
WindowCompat.getInsetsController(window, view).isAppearanceLightStatusBars = darkTheme
// 導航欄預設會有一層半透明遮罩, 這行代碼,去掉預設半透明遮罩
window.isNavigationBarContrastEnforced = false
}
}
還剩一個問題,大多數時候,我們雖然希望內容延伸到狀態欄和導航欄下麵,但是並不希望內容被系統欄擋住,只是想要達到背景顏色保持一致的效果。解決思路就是頂層 View 設置了背景顏色,然後給它上下流出 padding, 其中 top padding 即為狀態欄高度,bottom padding 為導航欄的高度。
傳統View視圖有兩種解決方案:
- 動態設置。新的 api 獲取 statusBarHeight 和 navigationBarHeight,需要通過在 Activity 中註冊監聽,在回調中獲取。這個回調時機可能晚於一些初始化工作,所以,只能在回調中動態設置。
- 在 xml 文件中,根佈局設置
fitsSystemWindows
屬性為true
。
最後來說說,Compose 中如何設置呢?
Compose Modifier 中提供了一個 api —— Modifier.systemBarsPadding()
即可。
本文完。
作者:SharpCJ 作者博客:http://joy99.cnblogs.com/ 本文版權歸作者和博客園共有,歡迎轉載,但未經作者同意必須保留此段聲明,且在文章頁面明顯位置給出原文連接。