如何实现android沉浸式状态栏
发布网友
发布时间：2022-05-05 05:17
共2个回答
热心网友
时间：2023-10-10 17:55
有些手机是强制改变通知栏颜色的，比如魅族，苹果。但是目前主要还是通过代码作出自己想要的效果。
Android 4.4之前，即使我们打开手机app，我们还总是能看到系统顶部那条黑乎乎的通知栏，这样会使得app稍显突兀。于是Android 4.4开始，便引入了Translucent System Bar的新特性，用于弥补系统通知栏突兀之处。
状态栏透明后，你可以选择设置其颜色或者显示背景图片。效果如下
Android4.4和5.0的实现方式不同。这里简单介绍一种
主要的操作都在style.xml 和 AndroidManifest.xml 中，Activity里面没有任何涉及到Translucent System Bar设置的代码，所以可以忽略不看。
要在Activity中使用 Translucent System Bar 特性，首先需要到AndroidManifest中为指定的Activity设置Theme。但我们不能直接在values/style.xml去定义Theme，因为改特性仅兼容 Android 4.4 开始的平台，所以直接在values/style.xml声明引入，工程会报错。有些开发者朋友会在代码中去判断SDK的版本，然后再用代码设置Theme。虽然同样可以实现效果，但个人并不推荐。我采取的方法是建立多个SDK版本的values文件夹，系统会根据SDK的版本选择合适的Theme进行设置。我的工程里面有values、values-v19、values-v21。
1、在values、values-v19、values-v21的style.xml都设置一个 Translucent System Bar 风格的Theme
values/style.xml
<style name="ImageTranslucentTheme" parent="AppTheme"><!--在Android 4.4之前的版本上运行，直接跟随系统主题-->
</style>
values-v19/style.xml
<style name="ImageTranslucentTheme" parent="Theme.AppCompat.Light.DarkActionBar"><item name="android:windowTranslucentStatus">true</item>
<item name="android:windowTranslucentNavigation">true</item>
</style>
values-v21/style.xml
<style name="ImageTranslucentTheme" parent="Theme.AppCompat.Light.DarkActionBar"><item name="android:windowTranslucentStatus">false</item>
<item name="android:windowTranslucentNavigation">true</item>
<!--Android 5.x开始需要把颜色设置透明，否则导航栏会呈现系统默认的浅灰色-->
<item name="android:statusBarColor">@android:color/transparent</item>
</style>
上面需要注意的地方是，无论你在哪个SDK版本的values目录下，设置了主题，都应该在最基本的values下设置一个同名的主题。这样才能确保你的app能够正常运行在 Android 4.4 以下的设备。否则，肯定会报找不到Theme的错误。
2、在AndroidManifest.xml中对指定Activity的theme进行设置
<activityandroid:name=".ui.ImageTranslucentBarActivity"
android:label="@string/image_translucent_bar"
android:theme="@style/ImageTranslucentTheme" />
3、在Activity的布局文件中设置背景图片，同时，需要把android:fitsSystemWindows设置为true
activity_image_translucent_bar.xml
<?xml version="1.0" encoding="utf-8"?><RelativeLayout xmlns:android="
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@mipmap/env_bg"
android:fitsSystemWindows="true">
</RelativeLayout>
到此，第一种实现方式完成，系统的整个导航栏都融入了app的界面中，背景图片填满了整个屏幕，看起来舒服很多。设置android:fitsSystemWindows这个属性时需要注意。
通知栏的沉浸式体验，推荐和Material Design配合使用，
md的主题有：
@android:style/Theme.Material (dark version)
@android:style/Theme.Material.Light (light version)
@android:style/Theme.Material.Light.DarkActionBar
与之对应的Compat Theme:
Theme.AppCompat
Theme.AppCompat.Light
Theme.AppCompat.Light.DarkActionBar
（1）个性化 Color Palette
我们可以根据我们的app的风格，去定制Color Palette(调色板)，重点有以下几个属性：
<resources><!-- Base application theme. -->
<style name="AppBaseTheme" parent="Theme.AppCompat">
<!-- customize the color palette -->
<item name="colorPrimary">@color/material_blue_500</item>
<item name="colorPrimaryDark">@color/material_blue_700</item>
<item name="colorAccent">@color/material_green_A200</item>
</style>
</resources>
colorPrimary 对应ActionBar的颜色。
colorPrimaryDark对应状态栏的颜色
colorAccent 对应EditText编辑时、RadioButton选中、CheckBox等选中时的颜色。
与之对应的图：
于5.0以下的设备，目前colorPrimaryDark无法去个性化状态栏的颜色；底部的navagationBar可能也不一样。
另外ActionBar，被推荐使用ToolBar来代替。
下面是少部分常用到的MD颜色：
<?xml version="1.0" encoding="utf-8"?><resources><!-- red -->
<color name="md_red_50_color_code">#fde0dc</color>
<color name="md_red_100_color_code">#f9bdbb</color>
<color name="md_red_200_color_code">#f69988</color>
<color name="md_red_300_color_code">#f36c60</color>
<color name="md_red_400_color_code">#e84e40</color>
<color name="md_red_500_color_code">#e51c23</color>
<color name="md_red_600_color_code">#dd191d</color>
<color name="md_red_700_color_code">#d01716</color>
<color name="md_red_800_color_code">#c41411</color>
<color name="md_red_900_color_code">#b0120a</color>
<color name="md_red_a100_color_code">#ff7997</color>
<color name="md_red_a200_color_code">#ff5177</color>
<color name="md_red_a400_color_code">#ff2d6f</color>
<color name="md_red_a700_color_code">#e00032</color>
<!-- pink -->
<color name="md_pink_50_color_code">#fce4ec</color>
<color name="md_pink_100_color_code">#f8bbd0</color>
<color name="md_pink_200_color_code">#f48fb1</color>
<color name="md_pink_300_color_code">#f06292</color>
<color name="md_pink_400_color_code">#ec407a</color>
<color name="md_pink_500_color_code">#e91e63</color>
<color name="md_pink_600_color_code">#d81b60</color>
<color name="md_pink_700_color_code">#c2185b</color>
<color name="md_pink_800_color_code">#ad1457</color>
<color name="md_pink_900_color_code">#880e4f</color>
<color name="md_pink_a100_color_code">#ff80ab</color>
<color name="md_pink_a200_color_code">#ff4081</color>
<color name="md_pink_a400_color_code">#f50057</color>
<color name="md_pink_a700_color_code">#c51162</color>
<!-- deep_purple -->
<color name="md_deep_purple_50_color_code">#ede7f6</color>
<color name="md_deep_purple_100_color_code">#d1c4e9</color>
<color name="md_deep_purple_200_color_code">#b39ddb</color>
<color name="md_deep_purple_300_color_code">#9575cd</color>
<color name="md_deep_purple_400_color_code">#7e57c2</color>
<color name="md_deep_purple_500_color_code">#673ab7</color>
<color name="md_deep_purple_600_color_code">#5e35b1</color>
<color name="md_deep_purple_700_color_code">#512da8</color>
<color name="md_deep_purple_800_color_code">#4527a0</color>
<color name="md_deep_purple_900_color_code">#311b92</color>
<color name="md_deep_purple_a100_color_code">#b388ff</color>
<color name="md_deep_purple_a200_color_code">#7c4dff</color>
<color name="md_deep_purple_a400_color_code">#651fff</color>
<color name="md_deep_purple_a700_color_code">#6200ea</color>
<!-- yellow -->
<color name="md_yellow_50_color_code">#fffde7</color>
<color name="md_yellow_100_color_code">#fff9c4</color>
<color name="md_yellow_200_color_code">#fff59d</color>
<color name="md_yellow_300_color_code">#fff176</color>
<color name="md_yellow_400_color_code">#ffee58</color>
<color name="md_yellow_500_color_code">#ffeb3b</color>
<color name="md_yellow_600_color_code">#fdd835</color>
<color name="md_yellow_700_color_code">#fbc02d</color>
<color name="md_yellow_800_color_code">#f9a825</color>
<color name="md_yellow_900_color_code">#f57f17</color>
<color name="md_yellow_a100_color_code">#ffff8d</color>
<color name="md_yellow_a200_color_code">#ffff00</color>
<color name="md_yellow_a400_color_code">#ffea00</color>
<color name="md_yellow_a700_color_code">#ffd600</color>
<!-- orange -->
<color name="md_orange_50_color_code">#fff3e0</color>
<color name="md_orange_100_color_code">#ffe0b2</color>
<color name="md_orange_200_color_code">#ffcc80</color>
<color name="md_orange_300_color_code">#ffb74d</color>
<color name="md_orange_400_color_code">#ffa726</color>
<color name="md_orange_500_color_code">#ff9800</color>
<color name="md_orange_600_color_code">#fb8c00</color>
<color name="md_orange_700_color_code">#f57c00</color>
<color name="md_orange_800_color_code">#ef6c00</color>
<color name="md_orange_900_color_code">#e65100</color>
<color name="md_orange_a100_color_code">#ffd180</color>
<color name="md_orange_a200_color_code">#ffab40</color>
<color name="md_orange_a400_color_code">#ff9100</color>
<color name="md_orange_a700_color_code">#ff6d00</color>
<!-- ............................... -->
<!-- grey -->
<color name="md_grey_50_color_code">#fafafa</color>
<color name="md_grey_100_color_code">#f5f5f5</color>
<color name="md_grey_200_color_code">#eeeeee</color>
<color name="md_grey_300_color_code">#e0e0e0</color>
<color name="md_grey_400_color_code">#bdbdbd</color>
<color name="md_grey_500_color_code">#9e9e9e</color>
<color name="md_grey_600_color_code">#757575</color>
<color name="md_grey_700_color_code">#616161</color>
<color name="md_grey_800_color_code">#424242</color>
<color name="md_grey_900_color_code">#212121</color>
<color name="md_black_color_code">#000000</color>
<color name="md_white_color_code">#ffffff</color>
<!-- blue_grey -->
<color name="md_blue_grey_50_color_code">#eceff1</color>
<color name="md_blue_grey_100_color_code">#cfd8dc</color>
<color name="md_blue_grey_200_color_code">#b0bec5</color>
<color name="md_blue_grey_300_color_code">#90a4ae</color>
<color name="md_blue_grey_400_color_code">#78909c</color>
<color name="md_blue_grey_500_color_code">#607d8b</color>
<color name="md_blue_grey_600_color_code">#546e7a</color>
<color name="md_blue_grey_700_color_code">#455a64</color>
<color name="md_blue_grey_800_color_code">#37474f</color>
<color name="md_blue_grey_900_color_code">#263238</color>
<resources>
热心网友
时间：2023-10-10 17:55
