如何创建完全透明的导航栏? [英] How to create a fully transparent Navigation Bar?

问题描述

我想将导航栏更改为完全透明，如下图所示.

我尝试了< item name ="android:windowTranslucentNavigation"> true</item> ，但是它不是完全透明的(更像是50％).

有解决方案吗?因为我什么都没找到，但是我看到一些像Nova一样使用它的应用程序.甚至在Google指南中也是如此

解决方案

我的灵感来自Google Keep应用，该应用具有类似如下所示的实现:

因此，我试图找到有关如何实现此目标的适当信息，但不幸的是未找到任何内容，并且上述答案均无效.因此，我决定尝试与Android Studio建议的与 navigationBar 相关的所有标志.

让我详细解释一下:

1. 在使用浅色主题时，只有 android:navigationBarColor 不会做任何事情.但是在黑暗主题下，它将起作用.

2. 将 windowTranslucentNavigation 设置为 true 会做两件事:

   • 在活动导航栏下方绘制活动
   • 覆盖 navigationBarColor 并强制其为透明.

如下图所示:

3. 如果使用 FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS (按照@Frankenxtein的回答)，您将得到以下结果:

这在某种程度上接近期望的结果，但这不是因为它在navbar下方绘制了活动组件.而且还会弄乱您的填充和边距(请在

深色主题

此处 android:navigationBarColor 设置导航栏的背景颜色.并且 android:windowLightNavigationBar 设置深色按钮颜色，并指示背景为浅色，正如您从其名称中可以理解的那样.

希望这会有所帮助！

I want to change the Navigation Bar fully transparent like on the picture below.

I tried <item name="android:windowTranslucentNavigation">true</item> but it is not fully transparent (more like 50%).

Is there a solution? Because i found nothing to it, but I saw some apps that used it like Nova. And its even in googles guidelines https://material.google.com/layout/structure.html#structure-system-bars

解决方案

I was inspired by Google Keep app, which have similar implementation like shown below:

So i tried to find a proper post on how to achieve this thing but unfortunately found nothing and also above answers weren't working. So i decided to try out all the flags related to navigationBar Android Studio was suggesting.

Let me explain in detail:

1. Only android:navigationBarColor won't do any thing when you are using a light theme. But on dark theme, it will work.

2. Setting windowTranslucentNavigation to true will do 2 things:

   • draw the activity below the soft navbar
   • override navigationBarColor and force it to be transparent.

Which will look like below image:

3. If you use FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS (follow @Frankenxtein's answer) you will get below result:

Which is somehow close to desired result, but it isn't because it draws activity components below navbar. And also it mess your padding and margin (see full screenshot here). And more, you have to do it for each activity and also have to adjust current margin.

The Solution

This can be achieved without compromising current layout. To do this in Dark theme, you have no issue, just setting android:navigationBarColor will do the work.

However our goal here is to do it with a light theme let (#FFFFFF). Using android:windowLightNavigationBar which requires API 27 or higher along with android:navigationBarColor will result what we want.

<item name="android:navigationBarColor">@color/colorPrimaryDark</item>
<item name="android:windowLightNavigationBar">true</item>

Here for my app case colorPrimaryDark is #FFFFFF in light theme and dracula in dark theme, you can also declare a new variable for this. Which yields below results:

Light Theme

Dark Theme

Here android:navigationBarColor is setting background colour of navbar. And android:windowLightNavigationBar setting dark button colours and indicates that background is light as you can understand from it's name.

Hope this helps !

这篇关于如何创建完全透明的导航栏?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！