带有导航组件的DrawerLayout不在透明的状态栏后面

时间:2018-10-23 18:03:42

标签: android navigation-drawer android-statusbar android-architecture-navigation

我要实现的是Material Design DrawerLayout,位于透明的状态栏后面,例如:

DrawerLayout inside translucent status bar

我正在使用新的Navigation Architecture Component,这意味着这是我目前的结构(我将使其变得简单,因为它可以包含很多无用的代码):

main.xml:

<FrameLayout
    ...
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    ...
    android:fitsSystemWindows="true" >

    <fragment
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/main_nav_host_fragment"
        android:name="androidx.navigation.fragment.NavHostFragment"
        app:navGraph="@navigation/main_nav_graph"
        app:defaultNavHost="true" />
</FrameLayout>

然后在main.xml的导航图片段内加载DrawerLayout本身:

fragment_main_nav.xml:

<androidx.drawerlayout.widget.DrawerLayout
    ...
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true">

    <!-- Layout to contain contents of main body of screen (drawer will slide over this) -->
    <androidx.coordinatorlayout.widget.CoordinatorLayout            
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        ...

    </androidx.coordinatorlayout.widget.CoordinatorLayout>

    <!-- Container for contents of drawer - using NavigationView to make configuration easier -->
    <com.google.android.material.navigation.NavigationView
        android:id="@+id/drawer_navigation_view"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        app:menu="@menu/drawer_view"
        app:headerLayout="@layout/drawer_nav_header"/>

</androidx.drawerlayout.widget.DrawerLayout>

在我的styles.xml中,我的Theme为:

<style name="AppTheme" parent="WindowAppTheme">
    <item name="colorPrimary">@color/colorPrimary</item>
    <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
    <item name="colorAccent">@color/colorAccent</item>
</style>

<style name="WindowAppTheme" parent="Theme.MaterialComponents.Light.NoActionBar"></style>

v21 styles.xml

<style name="WindowAppTheme" parent="Theme.MaterialComponents.Light.NoActionBar">
    <item name="android:windowDrawsSystemBarBackgrounds">true</item>
    <item name="android:statusBarColor">@android:color/transparent</item>
</style>

有了这个,我无法在半透明的状态栏下显示`DrawerLayout'来显示它的顶部,这是我得到的:

white status bar

我尝试了几种不同的方法,将android:fitsSystemWindows=true放置在所有地方并将其删除,但是我无法使用它!或者状态栏没有半透明颜色,或者是白色。

在“材料设计”规范下使用导航体系结构组件设置DrawerLayout的正确方法是什么?


编辑:

我按照Ian的建议对应用程序进行了重组,现在DrawerLayout显示在状态栏中,但是DrawerLayout上方没有稀松布艺和透明框:

No scrim DrawerLayout

1 个答案:

答案 0 :(得分:1)

必须将DrawerLayout放在层次结构的根部-您使用的FrameLayout仅知道它需要将所有内容填充到fitsSystemWindows中,并且不允许您的{ {1}}进入状态栏区域。

因此,您的DrawerLayout应该类似于navigation testapp

main.xml

您的MainActivity应该包含以下代码:

<android.support.v4.widget.DrawerLayout
  xmlns:android="http://schemas.android.com/apk/res/android"
  xmlns:app="http://schemas.android.com/apk/res-auto"
  android:id="@+id/main_drawer_layout"
  android:layout_width="match_parent"
  android:layout_height="match_parent">
  <fragment
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:id="@+id/main_nav_host_fragment"
    android:name="androidx.navigation.fragment.NavHostFragment"
    app:navGraph="@navigation/main_nav_graph"
    app:defaultNavHost="true"
  />
  <android.support.design.widget.NavigationView
    android:id="@+id/drawer_navigation_view"
    android:layout_width="wrap_content"
    android:layout_height="match_parent"
    android:layout_gravity="start"
    app:menu="@menu/drawer_view"
    app:headerLayout="@layout/drawer_nav_header"/>
</android.support.v4.widget.DrawerLayout>

由于您没有使用override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) setContentView(R.layout.main) val navController = findNavController(R.id.main_nav_host_fragment) // Change whether the drawer is enabled // based on what destination you're on val drawerLayout = findViewById<DrawerLayout>(R.id.main_drawer_layout) navController.addOnNavigatedListener { _, destination -> if (navController.graph.startDestination == destination.id) { // We're at the root of your graph, so unlock the drawer drawerLayout.setDrawerLockMode(DrawerLayout.LOCK_MODE_UNLOCKED, GravityCompat.START) } else { // We're on any other destination so disable the drawer drawerLayout.setDrawerLockMode(DrawerLayout.LOCK_MODE_LOCKED_CLOSED, GravityCompat.START) } } // Setup the NavigationView to navigate to the correct // destination in the graph. Since we've locked the drawer // on anything but the startDestination, we can guarantee // that you're on that destination when these items are clicked val navigationView = findViewById<NavigationView>(R.id.drawer_navigation_view) navigationView.setupWithNavController(navController) } 或任何等效结构,因此Toolbar需要添加自己的按钮并将其设置为单击时打开抽屉:

MainFragment