Android挖孔屏shortEdges全屏模式下如何将底部导航栏设为白色
全屏沉浸场景下将底部导航栏设为纯白色的实现方案
你当前配置的核心冲突是主题中开启的android:windowTranslucentNavigation=true属性,该标记会强制系统为导航栏叠加半透明蒙层,直接覆盖后续设置的纯色导航栏效果,必须先移除冲突配置,再补充对应逻辑才能实现纯白导航栏。
第一步:调整主题样式配置
- 删除主题中原有的
<item name="android:windowTranslucentNavigation">true</item>配置项 - 保留你现有所有关于刘海屏适配、状态栏透明、无标题栏的配置
- 补充导航栏基础颜色属性:
<item name="android:navigationBarColor">@android:color/white</item>
第二步:修改Activity中的系统栏控制代码
你当前的代码仅处理了状态栏的配置逻辑,未处理导航栏的冲突标记和图标颜色适配,需要对两个自定义方法做如下调整:
- 修改
makeFullScreen方法,移除导航栏透明标记的隐式依赖,保留布局延伸到系统栏区域的全屏沉浸效果:
private fun makeFullScreen() { val winParams: WindowManager.LayoutParams = window.attributes // 清除状态、导航栏的半透明冲突标记 winParams.flags = winParams.flags and WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS.inv() winParams.flags = winParams.flags and WindowManager.LayoutParams.FLAG_TRANSLUCENT_NAVIGATION.inv() window.attributes = winParams // 让布局内容延伸到状态栏、导航栏区域,不破坏全屏效果 window.decorView.systemUiVisibility = ( View.SYSTEM_UI_FLAG_LAYOUT_STABLE or View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN or View.SYSTEM_UI_FLAG_LAYOUT_HIDE_NAVIGATION ) checkBarStyleConfig() }
- 将原有的
checkStatusBarColor方法重构为同时处理状态栏、导航栏的样式配置,适配不同安卓版本的导航栏深色图标能力:
private fun checkBarStyleConfig() { // 开启系统栏自定义绘制权限 window.addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS) // 清除所有残留的系统栏半透明标记 window.clearFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS) window.clearFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_NAVIGATION) // 设置导航栏为纯白色,状态栏保持透明适配沉浸效果 window.navigationBarColor = Color.WHITE // 适配系统图标颜色:纯白背景下需要把系统图标设为深色,避免图标不可见 if (android.os.Build.VERSION.SDK_INT >= android.os.Build.VERSION_CODES.M) { window.decorView.systemUiVisibility = ( View.SYSTEM_UI_FLAG_LIGHT_STATUS_BAR // 导航栏深色图标从安卓8.0(API 26)开始才支持 or if (android.os.Build.VERSION.SDK_INT >= android.os.Build.VERSION_CODES.O) { View.SYSTEM_UI_FLAG_LIGHT_NAVIGATION_BAR } else { 0 } ) } }
注意事项
- 上述配置不会破坏你现有的全屏沉浸效果,页面内容依然可以延伸到导航栏区域下方,导航栏会以纯白色背景浮在内容上层
- 安卓8.0以下的系统版本不支持导航栏深色图标,纯白背景下的默认白色导航按钮会存在对比度不足的问题,如需兼容可将低版本下的导航栏调整为浅灰色做过渡适配
内容的提问来源于stack exchange,提问作者Mirza Ahmed Baig
相关产品推荐
相关产品推荐

