如何在导航抽屉内添加蓝色布局

Question

我想在android中的导航抽屉中添加蓝色布局。我试图添加，但它在导航视图后面。如何添加这样的？

Answer 1

看看你想要实现的目标会很有用。如果您希望导航抽屉（具有动画效果）具有蓝色背景，则只需设置NavigationView的背景 - 即抽屉。包装DrawLayout保存整个页面布局。

以下是一个非常完整的导航抽屉实现的示例：

<?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"
    >
    <!-- Page Content Area - includes App Bar Definition  -->
    <android.support.design.widget.CoordinatorLayout
        android:id="@+id/nav_coordinator_content"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        >
    <!-- App Bar Definition  -->
        <android.support.design.widget.AppBarLayout
            android:id="@+id/nav_appbar"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:elevation="0dp"
            >
            <android.support.v7.widget.Toolbar
                android:id="@+id/nav_toolbar"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                android:elevation="0dp"
                android:background="@color/app_background"
                android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
                app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
                >
                <LinearLayout
                    android:id="@+id/toolbar_title_wrapper"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_margin="4dp"
                    android:orientation="vertical"
                    android:paddingLeft="@dimen/abc_action_bar_default_padding_start_material"
                    android:paddingRight="@dimen/abc_action_bar_default_padding_end_material"
                    android:layout_gravity="center"
                    android:gravity="center"
                    >
                    <android.support.v7.widget.AppCompatTextView
                        android:id="@+id/toolbar_title"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_gravity="center"
                        android:gravity="center"
                        android:singleLine="true"
                        android:ellipsize="end"
                        android:textAppearance="@style/Base.TextAppearance.Widget.AppCompat.Toolbar.Title"
                        android:text="Edison"
                        android:textColor="@color/app_blue"
                        android:visibility="gone"
                        />
                 <android.support.v7.widget.AppCompatTextView
                        android:id="@+id/toolbar_subtitle"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_gravity="center"
                        android:gravity="center"
                        android:singleLine="true"
                        android:ellipsize="end"
                        android:textAppearance="@style/Base.TextAppearance.Widget.AppCompat.Toolbar.Subtitle"
                        android:text="Subtitle"
                        android:textColor="@color/app_blue"
                        android:visibility="gone"
                        />
                </LinearLayout>
            </android.support.v7.widget.Toolbar>
        </android.support.design.widget.AppBarLayout>

    <!-- Content Area    -->
        <FrameLayout
            android:id="@+id/page_container"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:elevation="@dimen/content_elevation"
            android:clipChildren="false"
            android:clipToPadding="false"
            app:layout_behavior="@string/appbar_scrolling_view_behavior"
            >
      <!-- Fragment Target    -->
            <FrameLayout
                android:id="@+id/content_container"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                app:layout_behavior="@string/appbar_scrolling_view_behavior"/>
        </FrameLayout>

    <!-- Other Content on page    -->
        <LinearLayout
            android:id="@+id/brightness_slider_container"
            android:layout_width="50dp"
            android:layout_height="wrap_content"
            android:orientation="vertical"
            android:layout_marginTop="0dp"
            android:layout_marginBottom="0dp"
            android:paddingTop="5dp"
            android:paddingBottom="0dp"
            android:layout_gravity="top|right"
            android:gravity="center"
            android:visibility="invisible"
            android:clipChildren="false"
            android:clipToPadding="false"
            app:layout_behavior="@string/appbar_scrolling_view_behavior"
            android:elevation="@dimen/content_elevation"
            >
            <edison.mobile.android.common.controls.SeekBarRotator
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:gravity="center"
                >
                <android.support.v7.widget.AppCompatSeekBar
                    android:id="@+id/brightness_slider"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:thumbTint="@color/app_blue"
                    android:progressTint="@color/app_blue"
                    android:progressBackgroundTint="@color/app_background_darkgrey"
                    />
            </edison.mobile.android.common.controls.SeekBarRotator>
            <android.support.v7.widget.AppCompatImageView
                android:id="@+id/moon"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:gravity="center"
                android:layout_marginTop="5dp"
                app:srcCompat="@drawable/moon"
                android:tint="@color/app_blue"
                />
        </LinearLayout>



    <!-- Floating Action Button    -->
        <android.support.design.widget.FloatingActionButton
            android:id="@+id/content_floating_action_button"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_margin="16dp"
            android:clickable="true"
            android:src="@drawable/ic_add_24"
            app:layout_anchor="@id/content_container"
            app:layout_anchorGravity="bottom|right|end"
            app:backgroundTint="?attr/colorAccent"
            android:elevation="@dimen/design_fab_elevation"
            android:visibility="visible"
        />


    <!-- Bottom Sheet  -->
        <LinearLayout
            android:id="@+id/bottom_sheet"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical"
            android:layout_marginTop="0dp"
            android:elevation="@dimen/bottom_sheet_elevation"
            android:background="@drawable/bottom_sheet_background"
            app:layout_behavior="android.support.design.widget.BottomSheetBehavior"
            app:behavior_peekHeight="160dp"
            >
            <android.support.v7.widget.AppCompatImageView
                android:id="@+id/bs_thumb"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginTop="@dimen/bottom_sheet_thumb_padding"
                android:layout_marginBottom="@dimen/bottom_sheet_thumb_padding"
                app:srcCompat="@drawable/bottom_sheet_thumb"
                />

            <FrameLayout
                android:id="@+id/bottom_sheet_fragment_container"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                />
        </LinearLayout>


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


    <!-- Navigation Area Definition -->
    <android.support.design.widget.NavigationView
        android:id="@+id/nav_view"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_gravity="top|start"
        app:elevation="@dimen/nav_drawer_elevation"
        android:background="@color/navdrawer_background"
        >
        <LinearLayout
            android:id="@+id/nav_wrapper"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical"
            >
            <!-- navigation drawer header area-->
            <LinearLayout
                android:id="@+id/nav_header"
                android:layout_width="match_parent"
                android:layout_height="@dimen/nav_header_height"
                android:orientation="vertical"
                android:padding="@dimen/activity_horizontal_margin"
                >
                <edison.mobile.android.common.controls.CircularProfileView
                    android:id="@+id/img_profile"
                    android:layout_width="@dimen/profile_size"
                    android:layout_height="@dimen/profile_size"
                    android:layout_marginTop="@dimen/nav_header_vertical_spacing"
                    android:layout_gravity="center_horizontal"
                    android:gravity="center_horizontal"
                    android:backgroundTint="@color/profile_background"
                    android:textColor="@color/profile_initials_color"
                    android:fontFamily="@font/rubikblack"
                    app:borderWidth="@dimen/profile_image_border_width"
                    app:borderColor="@color/app_blue"
                    />
                <android.support.v7.widget.AppCompatTextView
                    android:id="@+id/profile_name"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:paddingTop="@dimen/nav_header_vertical_spacing"
                    android:textColor="@color/profile_name_color"
                    android:textSize="@dimen/profile_name_text_size"
                    android:text="ALISON SUMMERFIELD"
                    />
            </LinearLayout>


            <!-- navigation drawer selection area-->
            <ExpandableListView
                    android:id="@+id/nav_list"
                    android:layout_height="match_parent"
                    android:layout_width="match_parent"
                    android:paddingLeft="@dimen/nav_drawer_menu_left_padding"
                    android:layout_gravity="top|start"
                    android:groupIndicator="@null"
                    />

        </LinearLayout>


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

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

（它有几个自定义控件，我改变了这个项目的高程，但布局是通用的，所以你应该得到要点）。

以下是导航绘图布局的抽象结构图：

还有一个更详细的：

如果您想要满足完整的Material Design规范并且有一个半透明状态栏并且导航抽屉滑过它，请记住正确设置您的主题：

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

  <style name="AppTheme.AppBarOverlay" parent="ThemeOverlay.AppCompat.Dark.ActionBar" />

  <style name="AppTheme.PopupOverlay" parent="ThemeOverlay.AppCompat.Light" />

Answer 2

另一方面，如果您指的是通知，请尝试将高程设置为高于导航抽屉的高程。默认情况下，抽屉高程由<dimen name="design_navigation_elevation">16dp</dimen>设置，因此如果您将高程设置为24dp，则它应显示在其上方。