android - DrawerLayout放在Toolbar的下方导致NavigationView出现与状态栏等高的遮罩层阴影
PHPz
PHPz 2017-04-17 17:50:20
0
4
1174

目标是想让Toolbar不被DrawerLayout的NavigationView遮盖,一直显示。
以下代码运行于Android Studio 2.1.2, 手机5.1.1

1.按照Android Studio 模板Navigation Drawer Activity创建的项目:

<!--activity_main.xml-->

<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/drawer_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true"
    tools:openDrawer="start">

    <include
        layout="@layout/content_main"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

    <android.support.design.widget.NavigationView
        android:id="@+id/nav_view"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        android:fitsSystemWindows="true"
        app:headerLayout="@layout/nav_header_main"
        app:menu="@menu/activity_main_drawer" />

</android.support.v4.widget.DrawerLayout>


<!--content_main.xml-->
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true"
    tools:showIn="@layout/activity_main"
    tools:context="com.hooking.note.MainActivity">

    <android.support.design.widget.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:theme="@style/AppTheme.AppBarOverlay">

        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            android:background="?attr/colorPrimary"
            app:popupTheme="@style/AppTheme.PopupOverlay" />

    </android.support.design.widget.AppBarLayout>

    <RelativeLayout
        android:id="@+id/fg_main_list"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior"/>

    <android.support.design.widget.FloatingActionButton
        android:id="@+id/fab"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom|end"
        android:layout_margin="@dimen/fab_margin"
        android:background="?attr/colorPrimary"
        android:src="@drawable/ic_add_white_24dp"
        app:layout_behavior="@string/floating_action_button_behavior" />

</android.support.design.widget.CoordinatorLayout>

主题是android studio项目模板默认的

    <style name="AppTheme.NoActionBar">
        <item name="windowActionBar">false</item>
        <item name="windowNoTitle">true</item>
        <item name="android:windowDrawsSystemBarBackgrounds">true</item>
        <item name="android:statusBarColor">@android:color/transparent</item>
    </style>
    
    <activity
        android:name=".MainActivity"
        android:theme="@style/AppTheme.NoActionBar" />

运行结果如下:

2.修改代码,使抽屉里的布局在Toolbar下面

<!-- activity_main_2.xml -->
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true"
    tools:context="com.hooking.note.MainActivity">

    <android.support.design.widget.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:theme="@style/AppTheme.AppBarOverlay">

        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            android:background="?attr/colorPrimary"
            app:layout_scrollFlags="scroll|enterAlways"
            app:popupTheme="@style/AppTheme.PopupOverlay" />

    </android.support.design.widget.AppBarLayout>

    <include layout="@layout/content_main_2" />

    <android.support.design.widget.FloatingActionButton
        android:id="@+id/fab"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom|end"
        android:layout_margin="@dimen/fab_margin"
        android:background="?attr/colorPrimary"
        android:src="@drawable/ic_add_white_24dp"
        app:layout_behavior="@string/floating_action_button_behavior" />

</android.support.design.widget.CoordinatorLayout>


<!-- content_main_2.xml -->
<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/drawer_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="false"//注1
    app:layout_behavior="@string/appbar_scrolling_view_behavior"
    tools:openDrawer="start">

    <RelativeLayout
        android:id="@+id/fg_main_list"
        android:layout_width="match_parent"
        android:layout_height="match_parent"/>

    <android.support.design.widget.NavigationView
        android:id="@+id/nav_view"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        android:fitsSystemWindows="false"//注2
        app:headerLayout="@layout/nav_header_main"
        app:menu="@menu/activity_main_drawer" />

</android.support.v4.widget.DrawerLayout>

主题不变,运行结果如下:

发现NavigationView的顶部有一与状态栏高度相等的遮罩层,请问怎样去掉这部分遮罩层的阴影。

  1. 试过,修改DrawerLayout和NavigationView的布局属性;以及从以下代码涉及到颜色的函数着手修改,都没有效果




  1. 修改activity_main_2.xml、content_main_2.xml中DrawerLayout 【注1】 和NavigationView【注2】的 android:fitsSystemWindows="false"由false改为true,就出现了以下结果:可以看到内容区也多了状态栏同等高度的遮罩层阴影

问题:请问,这个与状态栏等高的遮罩层阴影的来源是哪里,应该怎么去掉?谢谢!

PHPz
PHPz

学习是最好的投资!

membalas semua(4)
巴扎黑

Layout Linear bersarang di dalam CoordinatorLayout
Letakkan Bar Alat dan DrawerLayout di dalam

黄舟

Bayang berasal dari fitsystemWindows Atribut ini agak pelik. Kawalan NavgationView mempunyai layanan istimewa untuk atribut fitsSystemWindows bahawa kawalan ini mempunyai pemprosesan yang berbeza pada telefon mudah alih yang berbeza. Untuk kaedah anda, penyelesaian saya ialah menambah content_main2 pada susun atur akar layout_margin="?attr/ActionBarsize" supaya anda boleh mendapatkan hasil yang anda inginkan (semua reka letak dijana dalam Android Studio).

Peter_Zhu
//将主题的这两个属性修改下
<item name="android:windowDrawsSystemBarBackgrounds">false</item>
<item name="android:statusBarColor">不透明的颜色</item>

Mengenai sifat fitsystemWindows

Apabila android:windowDrawsSystemBarBackgrounds benar dan android:statusBarColor telus sepenuhnya,
Ketinggian UI dalam Aktiviti termasuk bar status dan akan dibenamkan di bawah bar status.
Atribut fitsystemWindows boleh dihantar dalam ViewGroup, daripada View induk kepada View anak.

  1. Apabila susun atur induk Aktiviti ialah CoordinatorLayout, jika fitsystemWindows=true ditetapkan,
    akan melukis blok warna di bawah bar status (ketinggian sama dengan ketinggian bar status), dan warna bergantung pada systembarcolor CoordinatorLayout Properties,

Warna lalai systembarcolor ialah warna colorPrimaryDark.

  1. CoordinatorLayout menetapkan fitsystemWindows=true Sama ada hendak melukis bar status bergantung pada sub-View CoordinatorLayout Jika sub-View juga menetapkan fitsystemWindows=true, ia akan diserahkan kepada sub -Lihat untuk mengendalikan lukisan bar status.

Anda boleh google artikel berkaitan fitsystemWindows

阿神

Maaf, poster, adakah masalah ini telah diselesaikan? Saya menghadapi masalah yang sama

Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan