实现 Android 应用状态栏和底部导航栏透明效果

时之世 发布于 2024-12-13 261 次阅读 预计阅读时间: 2 分钟 最后更新于 2024-12-16 422 字 无~

AI 摘要

实现 Android 应用状态栏和底部导航栏透明效果可以通过以下步骤： 1. **查看应用主题文件**：在配置文件中检查并修改白天和黑夜的主题文件。 2. **修改主题文件**： - 确保应用没有传统标题栏或操作栏，通过在`style.xml`中添加以下代码： ```xml <item name="windowNoTitle">true</item> <item name="windowActionBar">false</item> <color name="transparent">#00000000</color> ``` - **状态栏透明化**：添加以下属性以使状态栏透明： ```xml <item name="android:windowTranslucentStatus">true</item> <item name="android:windowDrawsSystemBarBackgrounds">false</item> <item name="android:statusBarColor">@android:color/transparent</item> ``` - **底部导航栏透明化**：添加以下属性以使导航栏透明： ```xml <item name="android:windowTranslucentNavigation">true</item> <item name="android:navigationBarColor">@android:color/transparent</item> ``` 3. **API 21+支持**：如果使用 API 21 及以上版本，还可以设置状态栏图标颜色： ```xml <item name="android:windowLightStatusBar">true</item> ``` 通过这些步骤，可以使应用的状态栏和导航栏实现透明效果，提升视觉体验。

使通知栏（顶部状态栏） 以及底部的小白条（导航栏） 变透明是美化安卓应用的一个关键

如图，顶部和底部是不透明的

一 在配置文件中查看应用使用的主题文件

由于有白天和黑夜两个主题文件，所以两个文件都需要更改

二 更改主题文件

1. 前置更改

首先确保你的应用没有传统意义上的标题栏或操作栏

<!-- 隐藏标题栏 -->
<item name="windowNoTitle">true</item>
<item name="windowActionBar">false</item>

然后，在 style.xml 中加入透明样式

<color name="transparent">#00000000</color>

2. 状态栏透明化

<!-- 状态栏透明 -->
<item name="android:windowTranslucentStatus">true</item>
<item name="android:windowDrawsSystemBarBackgrounds">false</item>
<item name="android:statusBarColor">@android:color/transparent</item>
  • windowTranslucentStatus 属性使得状态栏内容可以穿透显示在背后的背景上，
  • 而 windowDrawsSystemBarBackgrounds 则被设为 false 以确保状态栏不会绘制自己的背景颜色。
  • 最后，通过设置 statusBarColor 为透明色来进一步确认状态栏的透明度。

3. 底部导航栏透明化

<!-- 底部小白条 变为透明-->
<item name="android:windowTranslucentNavigation">true</item>
<item name="android:navigationBarColor">@android:color/transparent</item>
  • windowTranslucentNavigation 属性用于使导航栏透明，
  • 而 navigationBarColor 则指定其颜色为透明。

4. 假如使用的是 API 21+

<!-- 如果你使用的是 API 21+，还可以使用下面的属性 -->
<item name="android:windowLightStatusBar">true</item>

windowLightStatusBar 可以让状态栏图标变成深色，以便在浅色背景下更容易看见

三 效果图