如何将导航抽屉放在工具栏下方？

【问题标题】：How to put navigation drawer below toolbar?如何将导航抽屉放在工具栏下方？
【发布时间】：2016-03-05 05:18:04
【问题描述】：

这里我的导航抽屉在工具栏上方。我还添加了一些 xml 代码。请帮助我。

这是我的activity.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/app_bar_categories"
        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:menu="@menu/activity_main2_drawer" />

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

还有我的 app_bar 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.ezybzy.ezybzy.categoris">

    <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>

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

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

和我的内容 main.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    app:layout_behavior="@string/appbar_scrolling_view_behavior"
    tools:context="com.ezybzy.ezybzy.categoris"
    tools:showIn="@layout/app_bar_categories"
    android:background="#ffffff">
</RelativeLayout>

我使用 android studios 导航抽屉活动创建了导航抽屉..

【问题讨论】：

标签： android navigation-drawer toolbar


【解决方案1】：

当然android:layout_marginTop="?attr/actionBarSize" 做这项工作

<android.support.v4.widget.DrawerLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/my_drawer_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_marginTop="?attr/actionBarSize">

但问题是抽屉布局位于工具栏的顶部。这就是这里褪色的原因。 您可以通过

来消除褪色 
mDrawerLayout.setScrimColor(getResources().getColor(android.R.color.transparent));

但在某些设备上它可能看起来是有线的。

解决方案

使用 Android Studio 时。我们可以创建NavigationDrawerActiviity 有3个文件命名

activity_main.xml

app_bar_main.xml

nav_header_main.xml

content_main.xml

所以我们可以跳过app_bar_main.xml，然后我们可以移除褪色。

步骤 1

将活动主视图的根视图设为垂直LinearLayout

<LinearLayout 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:orientation="vertical"
android:fitsSystemWindows="true"
tools:context="com.example.MainActivity">
</LinearLayout>

在activity_main.xml 中添加DrawerLayout 并在DrawerLayout 中包含content_main.xml。并在DrawerLayout 上方添加AppBarLayout。

<LinearLayout 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:orientation="vertical"
tools:context="com.qproinnovations.schoolmanagement.activity.HomeActivity">
    <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.v7.widget.Toolbar>

    </android.support.design.widget.AppBarLayout>
    <android.support.v4.widget.DrawerLayout
        android:id="@+id/drawer_layout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:fitsSystemWindows="true"
        tools:openDrawer="start">
    <!-- drawer view -->
        <include layout="@layout/content_main" />
<!-- drawer content -->
        <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:menu="@menu/activity_home_drawer" />
    </android.support.v4.widget.DrawerLayout>

</LinearLayout>

第二步

添加和替换 NavigationDrawerActivity 的 setContentView() 到

setContentView(R.layout.activity_main);

终于有了

【讨论】：

  • 救命稻草。谢谢
【解决方案2】：

添加

android:layout_marginTop="?attr/actionBarSize"

到您用作抽屉的布局。

【讨论】：

  • 当我在导航视图中添加它时它可以工作。但是当导航抽屉出现时，操作栏正在褪色..我不希望这种褪色。
  • 请参阅this 以消除操作栏褪色。
  • @ProgDevCode 很乐意为您提供帮助。
【解决方案3】：

在您的导航抽屉 xml 中，您应该将 android:layout_marginTop ="?android:attr/actionBarSize" 添加到容器中。

【讨论】：

  • 但是当导航抽屉出现时，动作栏正在消失......我不希望这个动作栏消失
【解决方案4】：

如果您使用的是自定义工具栏，请以这种方式使用抽屉布局..

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">

    <!-- The toolbar -->
    <android.support.v7.widget.Toolbar  
        android:id="@+id/my_awesome_toolbar"
        android:layout_height="wrap_content"
        android:layout_width="match_parent"
        android:minHeight="?attr/actionBarSize"
        android:background="?attr/colorPrimary" />

    <android.support.v4.widget.DrawerLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/my_drawer_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

        <!-- drawer view -->
        <LinearLayout
            android:layout_width="304dp"
            android:layout_height="match_parent"
            android:layout_gravity="left|start">
            ....
        </LinearLayout>

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

</LinearLayout>

如果您不使用自定义工具栏，则必须将边距设置为抽屉布局..

android:layout_marginTop ="?android:attr/actionBarSize"

【讨论】：

    【解决方案5】：

    为

    设置了一个简单而良好的解决方案 fitsSystemWindows=false 
    android.support.v4.widget.DrawerLayout

    id 为

    android:id="@+id/drawer_layout"

    对于 navigationView 将 layout_marginTop 设置为 ?attr/actionBarSize 将获取操作栏大小并将其设置为边距

    这里是完整的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="false"
    tools:openDrawer="start">

    <include
        layout="@layout/app_bar_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_marginTop="?attr/actionBarSize"
        android:layout_gravity="start"
        android:fitsSystemWindows="true"

        app:menu="@menu/activity_main_drawer" />
    <!--app:headerLayout="@layout/nav_header_main"-->
</android.support.v4.widget.DrawerLayout>

    【讨论】：

    • 因为打开导航抽屉时整个布局会褪色
    • 正确的做法是只淡化布局的重叠部分
    • 这不是因为我在上述代码中应用的更改。 DrawerLayout 的默认行为
    • 但是可以通过这个问题的答案来实现
    • 如果您不想褪色，请使用稀松布颜色mDrawerLayout.setScrimColor(ContextCompat.getColor(getApplicationContext(), android.R.color.transparent));
    【解决方案6】：

    创建一个这样的布局：

     <android.support.v4.widget.DrawerLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:tools="http://schemas.android.com/tools"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:id="@+id/drawer_layout"
        android:layout_width="match_parent"
        android:elevation="4dp"
        android:layout_height="fill_parent"
        >


        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical"

            >
            <include
                android:id="@+id/tool_bar"
                layout="@layout/toolbar"
                android:layout_height="wrap_content"
                android:layout_width="match_parent"
                />


            <FrameLayout
                android:id="@+id/content_frame"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:background="@drawable/bg_new">


    <put your layout here................>

            </FrameLayout>



        </LinearLayout>

        <android.support.design.widget.NavigationView
            android:id="@+id/navigation"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:layout_gravity="start"
            android:fitsSystemWindows="true"
            android:background="@drawable/bg_all"

            app:itemIconTint="@android:color/white"
            app:itemTextColor="@android:color/white"
            app:theme="@style/list_item_appearance"
            app:menu="@menu/drawer_menu" >


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

    【讨论】：

      【解决方案7】：

      你的抽屉覆盖了你的工具栏，以避免尝试下面的代码

      <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true">

    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="56dp"
        android:layout_gravity="start"
        android:background="@android:color/transparent"
        android:minHeight="?attr/actionBarSize"
        app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
        app:theme="@style/toolBarStyle"
        app:titleTextAppearance="@style/Toolbar.TitleText" />

    <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:layout_below="@+id/toolbar"
        android:fitsSystemWindows="true">

        <RelativeLayout
            android:id="@+id/container"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_marginTop="0dp"
            android:background="@android:color/transparent" />

        <fragment
            android:id="@+id/navigation_drawer"
            class="com.buzzintown.consumer.drawer.NavigationDrawerFragment"
            android:layout_width="310dp"
            android:layout_height="match_parent"
            android:layout_gravity="start"
            tools:layout="@layout/drawer_layout" />
    </android.support.v4.widget.DrawerLayout>
</RelativeLayout>

      【讨论】：

        【解决方案8】： 
        <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true">
<android.support.design.widget.AppBarLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    tools:openDrawer="start">

    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"

android:layout_height="@dimen/abc_action_bar_default_height_material"
        android:background="?attr/colorPrimary"
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"/>

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

<android.support.v4.widget.DrawerLayout
    android:id="@+id/drawer_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

   <!--content_main is my layout you can design your own-->
   <!--one more thing is dont put toolbar in your content_main layout-->
    <include layout="@layout/content_main" />

    <FrameLayout
        android:id="@+id/content"
        layout="@layout/content_main"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

    <!-- The navigation drawer -->
    <android.support.design.widget.NavigationView
        android:id="@+id/nav_view"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        app:menu="@menu/activity_main_drawer" />

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


</LinearLayout>

        【讨论】：

          【解决方案9】：

          使用可以改变导航抽屉xmlandroid:layout_marginTop ="0dp"设置工具栏上边距

          【讨论】：

          • 但是当导航抽屉出现时，操作栏正在褪色..我不希望这种褪色..
          猜你喜欢
          • 2015-01-15
          • 1970-01-01
          • 2015-05-30
          • 2014-12-23
          • 2016-06-01
          • 2019-09-15
          • 2016-11-25
          • 1970-01-01
          相关资源
          最近更新 更多
          热门标签
          Java Python linux javascript Mysql C# Docker 算法 前端 SpringBoot Redis Vue spring 设计模式 .net core .net kubernetes c++ 数据库 数据结构 大数据 js 机器学习 微服务 Android Go 程序员 面试 JVM ASP.net core 云原生 人工智能 后端 PHP git CSS golang k8s Nginx Django mybatis 深度学习 多线程 React 架构 devops 爬虫 云计算 Spring Boot LeetCode