Develop Reference

navigation drawer is not tall enough

I created a navigation drawer in my app, but as you can see in the image above, the navigation drawer is too short and it is only long enough to contain the existing items.
My codes looks like:
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:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="ykim164cs242.tournamentor.UserMainActivity"
android:id="#+id/nav_layout">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"></LinearLayout>
<android.support.design.widget.NavigationView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:menu="#menu/navigation_menu"
android:layout_gravity="start"
app:headerLayout="#layout/navigation_header">
</android.support.design.widget.NavigationView>
</android.support.v4.widget.DrawerLayout>
navigation_menu.xml
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:android="http://schemas.android.com/apk/res/android">
<group>
<item android:id="#+id/nav_select_channel"
android:title="Select Channel"
android:icon="#mipmap/channel_icon"/>
<item android:id="#+id/nav_team_list"
android:title="Team List"
android:icon="#mipmap/team_logo"/>
<item android:id="#+id/nav_league_status"
android:title="League Status"
android:icon="#mipmap/league_status_icon"/>
</group>
</menu>
I am not sure this happened because the background is dark, but I at least want it to fill the whole height of the app.

just make navigation view height to match_parent and width to wrap_content or give some value.
<android.support.design.widget.NavigationView
android:layout_width="wrap_content"
android:layout_height="match_parent"
app:menu="#menu/navigation_menu"
android:layout_gravity="start"
app:headerLayout="#layout/navigation_header">

Scrollable footer in Drawer

I tried to add a footer to a drawer. It works but it remain fixed and it cover some menu item. How can I do to have the footer at the end of the list (after the last element). It takes the menu item from a xml (activity_main_drawer.xml) and it has a header (nav_header_main.xml)
The code of the drawer is this:
<?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">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<include
layout="#layout/app_bar_main"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/side_nav_bar"
android:id="#+id/content_main"/>
</LinearLayout>
<android.support.design.widget.NavigationView
android:id="#+id/navigation_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">
<include layout="#layout/nav_footer_main"></include>
</android.support.design.widget.NavigationView>
</android.support.v4.widget.DrawerLayout>
the code of footer (nav_footer_main.xml)
<?xml version="1.0" encoding="utf-8"?>
<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="#dimen/nav_footer_height"
android:layout_alignParentBottom="true"
android:layout_gravity="bottom"
android:background="#drawable/side_nav_bar"
android:baselineAligned="false"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
android:theme="#style/ThemeOverlay.AppCompat.Dark">
<ImageView
android:id="#+id/imageView"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:paddingTop="#dimen/nav_header_vertical_spacing"
android:scaleType="centerCrop"
app:srcCompat="#mipmap/copyright"
tools:ignore="ContentDescription" />
<TextView
android:id="#+id/copyright"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/copyright" />
</LinearLayout>

According to #Adreamus answer to the question How to add footer to NavigationView - Android support design library?
you could make it by 2 navigation views, look at this app example on Github
Also, I suggest you use MaterialDrawer Library it will save you a lot of time

You can add footer as an item in the menu of the navigation view like this
menu_main:
<?xml version="1.0" encoding="utf-8"?>
<menu 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"
tools:showIn="navigation_view">
<group android:checkableBehavior="single">
<item
android:id="#+id/nav_home"
android:icon="#drawable/ic_home"
android:title="#string/home" />
<item
android:id="#+id/nav_about"
android:icon="#drawable/ic_about_me"
android:title="#string/about" />
</group>
<group>
<item
android:id="#+id/nav_footer"
android:title=""
app:actionLayout="#layout/nav_footer_main"
app:showAsAction="never" />
</group>
</menu>
It will be scrollable and also easy to access from the code, you can use this:
val navigationFooter = navView.menu.findItem(R.id.nav_footer).actionView as View
navigationFooter.findViewById<View>(R.id.btn_call_us).setOnClickListener {
onCallButtonClicked()
}
Good luck!

How to remove shadow below NavigationView?

If the height of a NavigationView is less than the height of its parent, there's a drop shadow below the NavigationView. How can I remove that shadow?
Here's my layout:
<?xml version="1.0" encoding="utf-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:layout_gravity="left"
android:orientation="vertical"
android:background="#android:color/white">
<android.support.design.widget.NavigationView
android:id="#+id/map_type_menu"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="left"
app:menu="#menu/menu_map_type"/>
<!-- unwanted drop shadow here -->
<fragment
android:id="#+id/settings"
android:name="com.chalcodes.treasuremap.SettingsFragment"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
</LinearLayout>
I don't think this is relevant, but here's the menu_map_type XML:
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
<group android:checkableBehavior="single">
<item
android:id="#+id/item_street"
android:icon="#drawable/ic_menu_map_type_street"
android:title="#string/map_type_street" />
<item
android:id="#+id/item_satellite"
android:icon="#drawable/ic_menu_map_type_satellite"
android:title="#string/map_type_satellite" />
<item
android:id="#+id/item_hybrid"
android:icon="#drawable/ic_menu_map_type_satellite"
android:title="#string/map_type_hybrid" />
<item
android:id="#+id/item_terrain"
android:icon="#drawable/ic_menu_map_type_terrain"
android:title="#string/map_type_terrain" />
</group>
</menu>

Just add to your NavigationView layout:
app:elevation="0dp"

The shadow is caused by the NavigationView having a non-zero default elevation. This was actually the first thing I thought of, but the way I tried to change it didn't work, so I mistakenly thought elevation wasn't the problem.
I originally added android:elevation="0dp" in the NavigationView declaration. This produced a warning because I'm supporting APIs below 21. I incorrectly assumed that this attribute would remain effective for API 21+, but apparently it gets stripped.
The solution was to set the elevation in code:
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
navView.setElevation(0f);
}

Try this.
<android.support.design.widget.NavigationView
android:id="#+id/map_type_menu"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="left"
app:menu="#menu/menu_map_type">
<LinearLayout android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical">
<include layout="#layout/nav_header" />
<fragment android:id="#+id/settings" android:name="com.chalcodes.treasuremap.SettingsFragment" android:layout_width="match_parent" android:layout_height="wrap_content"/>
</LinearLayout>
</android.support.design.widget.NavigationView>

set navaigation Item text color white android

I want to set navigation menu text color to white how can able do it??
I want to make screen like this
Please check my following code snippet
My Navigation Menu Looks Like:
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
>
<item
android:id="#+id/nav_timer"
android:icon="#drawable/ic_av_timer_black_36dp"
android:title="Timer"
android:textColor="#000000"
/>
<item
android:id="#+id/nav_profile"
android:icon="#drawable/ic_account_circle_black_48dp"
android:title="Profile"
>#color/menuColor</item>
<item
android:id="#+id/nav_logs"
android:icon="#drawable/ic_assignment_black_48dp"
android:title="Logs" />
<item
android:id="#+id/nav_changeBusiness"
android:icon="#drawable/ic_business_black_48dp"
android:title="Change Business" />
<item
android:id="#+id/nav_logout"
android:icon="#drawable/ic_exit_to_app_black_48dp"
android:title="Logout" />

Add app:itemTextColor="#android:color/white" in your navigation view.
<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:itemTextColor="#android:color/white"
android:fitsSystemWindows="true"
app:menu="#menu/act_home_drawer_menu"
/>
It will give you desired result.

You can add a Listview under Navihation View. And then you can add your custom adapter with textview.
<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout
android:id="#+id/drawer_layout"
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=".MainActivity">
<FrameLayout
android:id="#+id/content_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<include layout="#layout/main_toolbar" />
</FrameLayout>
<android.support.design.widget.NavigationView
android:id="#+id/navigation_view"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"/>
<ListView
android:id="#+id/menuList"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</android.support.v4.widget.DrawerLayout>
This will solve your problem. It worked for me.

Android right to left NavigationDrawer menu items aren't RTL

I need to align navigation menu items to the right.
I read many articles and questions and answers but i couldn't find what's wrong in my project.
This is my 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="right">
<include
layout="#layout/content_activity_home"
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="right"
android:fitsSystemWindows="true"
app:headerLayout="#layout/nav_header_activity_home"
app:menu="#menu/activity_home_drawer" />
This is activity_home_drawer.xml:
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
<group android:checkableBehavior="single">
<item
android:id="#+id/menu_account"
android:icon="#drawable/ic_profile"
android:title="حساب کاربری" />
<item
android:id="#+id/menu_logout"
android:icon="#drawable/ic_sign_out"
android:title="خروج از حساب" />
</group>
I can make drawer itself to open from right but elements of NavigationView still remain left to right. You can see the result here:
As you see menu items aren't right to left. How to make them rtl?

try adding android:layoutDirection="rtl"
<android.support.design.widget.NavigationView
android:layoutDirection="rtl"
android:id="#+id/navigation_view"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="right"
android:fitsSystemWindows="true"
app:headerLayout="#layout/nav_header_main"
app:menu="#menu/activity_main_drawer" />
This works for api level 17 or above. For older devices there is a trick.
In application level of android manifest set supportRtl="false" and in layouts set layout_gravity="right". This works properly.

First delete app:menu="#menu/activity_main_drawer" and in
"#layout/nav_header_main" layout you can set custom layout.in the below you can see content of nav_header_main layout.
<?xml version="1.0" encoding="utf-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:gravity="right"
android:orientation="vertical"
android:paddingTop="#dimen/activity_vertical_margin"
android:theme="#style/ThemeOverlay.AppCompat.Dark">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="#dimen/nav_header_height"
android:background="#drawable/banner"
android:gravity="right">
</LinearLayout>
</LinearLayout>