set navaigation Item text color white android - 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.

Related

How to change drawer layout icon colours

I'm updating an existing project from a different developer in our company and am trying to set the colour of the icons to match the text (as you can see from the screenshot below). I've succeeded for the current selected item but not for the items that aren't selected. I cannot figure out why either of these do/don't work at the moment.
My layout
<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"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true">
<android.support.design.widget.CoordinatorLayout
android:id="#+id/coordinator_layout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<include layout="#layout/appbar_basic"/>
<android.support.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<include layout="#layout/activity_home_content"/>
</android.support.v4.widget.NestedScrollView>
</android.support.design.widget.CoordinatorLayout>
<include layout="#layout/navigation_view"/>
</android.support.v4.widget.DrawerLayout>
My code
#Bind(R.id.drawer_layout)
DrawerLayout mDrawerLayout;
private void initDrawer() {
Menu m = mNavigationView.getMenu();
for (ModuleVO module : Modules.getActiveModules()) {
m.add(0, module.id, 1, module.textRef).setIcon(module.drawerIconRef);
}
}
I have already done some searching and tried a couple of things, including the answers listed here:
Changing text color of menu item in navigation drawer
How to style Menu Items in Navigation Drawer in Android?
Using app:itemIconTint doesn't work and neither does writing a selector. The only way I've been able to change the colours has been by changing these attributes in my themes.xml file.
<?xml version="1.0" encoding="utf-8"?>
<resources xmlns:android="http://schemas.android.com/apk/res/android">
<style name="AppTheme.Base" parent="Theme.AppCompat.Light.NoActionBar">
<item name="android:textColorPrimary">#color/text</item>
<item name="android:textColorSecondary">#color/primary</item>
</style>
</resources>
I will be happy to provide more information/code if required to solve the issue!
I have also have that issue but I have found that solution may be it will work for you :-
<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_home"
app:itemBackground="#android:color/transparent"
app:itemIconTint="#drawable/drawer_item"
app:itemTextColor="#drawable/drawer_item"
app:menu="#menu/activity_home_drawer" />
and drawer_item.xml:-
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:color="#color/colorPrimaryDark" android:state_checked="true" />
<item android:color="#000000" />
</selector>
nav_header_home.xml is:-
<?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_header_height"
android:background="#000"
android:gravity="bottom"
android:orientation="vertical"
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="wrap_content"
android:paddingTop="#dimen/nav_header_vertical_spacing"
app:srcCompat="#drawable/user"
tools:ignore="VectorDrawableCompat" />
<LinearLayout
android:id="#+id/llLogin"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:orientation="horizontal">
<TextView
android:id="#+id/tvSignIn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginLeft="4dp"
android:layout_marginRight="4dp"
android:text="Sign In"
android:textAppearance="#style/TextAppearance.AppCompat.Body1"
android:textColor="#fff"
android:textSize="16sp"
android:textStyle="bold" />
<View
android:layout_width="2dp"
android:layout_height="match_parent"
android:background="#fff" />
<TextView
android:id="#+id/tvJoin"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginLeft="4dp"
android:layout_marginRight="4dp"
android:text="Join Free"
android:textColor="#fff"
android:textSize="16sp"
android:textStyle="bold" />
</LinearLayout>
</LinearLayout>
I found the answer! When looking over my layout file again I found <include layout="#layout/navigation_view"/> and when I applied a selector to navigation_view it worked! Below is my working code.
activity_home.xml
<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"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true">
<android.support.design.widget.CoordinatorLayout
android:id="#+id/coordinator_layout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<include layout="#layout/appbar_basic"/>
<android.support.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<include layout="#layout/activity_home_content"/>
</android.support.v4.widget.NestedScrollView>
</android.support.design.widget.CoordinatorLayout>
<include layout="#layout/navigation_view"/>
</android.support.v4.widget.DrawerLayout>
navigation_view.xml
<merge xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<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:itemIconTint="#drawable/drawer_item"
app:itemTextColor="#drawable/drawer_item"
/>
</merge>
drawer_item.xml (Kudos to Abhinav Gupta for this part)
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:color="#color/primary" android:state_checked="true" />
<item android:color="#color/text" />
</selector>

navigation drawer is always inflated when the app starts

I am trying to add navigation drawer to my main activity.
in design view of activity_main.xml it should be visible at left side of the activity layout as a shadowed animation(i don't know what terminology i should use here for that :| ),which on drag/swipe to right should be visible.
but in my case it is covering up the whole activity by default and is not displaying the actual contents of the activity ...which it ought to be...
i have gone through the solutionhere,but it is not working for me.
my layout code for activity_main.xml is as following:
<?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="com.example.mts3_.p1_d3_app_bar.MainActivity">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
>
<include
android:id="#+id/app_bar"
layout="#layout/app_bar"
android:layout_height="wrap_content"
android:layout_width="match_parent"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Hello World!"
android:id="#+id/tv"
/>
</LinearLayout>
<android.support.design.widget.NavigationView
android:id="#+id/navigation_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:menu="#menu/drawer_menu"
/>
</android.support.v4.widget.DrawerLayout>
and drawer_menu.xml(layout file) is as following:
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
<group android:checkableBehavior="single">
<item android:title="#string/img1"
android:id="#+id/img11"
android:icon="#drawable/pic_1"></item>
<item android:title="#string/img2"
android:id="#+id/img22"
android:icon="#drawable/pic_2"></item>
<item android:title="#string/img3"
android:id="#+id/img33"
android:icon="#drawable/pic_3"></item>
<item android:title="#string/img4"
android:id="#+id/img44"
android:icon="#drawable/pic_4"></item>
</group>
<item android:title="#string/social">
<menu>
<item android:title="#string/add_to_group"
android:id="#+id/add_to_group"
android:icon="#drawable/pic_5"></item>
<item android:title="#string/share"
android:id="#+id/share"
android:icon="#drawable/pic_6"></item>
<item android:title="#string/group"
android:id="#+id/group"
android:icon="#drawable/pic_7"></item>
</menu>
</item>
</menu>
First,change your height and width android:layout_width="wrap_content" and android:layout_height="match_parent",
Second,set gravity android:layout_gravity="left" in your NavigationView.
Try this .
<android.support.design.widget.NavigationView
android:id="#+id/navigation_view"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="left"
app:menu="#menu/drawer_menu"></android.support.design.widget.NavigationView>
Edit
If you use android:layout_gravity="left" in your xml code , you will start NavigationView on the left .
And android:layout_gravity="left" is the same of `android:layout_gravity="start``.
If you use android:layout_gravity="right" in your xml code , you will start NavigationView on the right.
And use tools:openDrawer="start" in your code ,it will display in the preview in the android studio .it did not effect your display in your device .
Put below Code in Drawerlayout tag
tools:openDrawer="start"
Like Following Code
<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">
After that implement that code in navigationView Tag
android:layout_gravity="start"
Hope it work fine.

Removing Shadow From Toolbar Buttons

I want to remove the shadow from these imagebuttons in my toolbar, but I can't seem to do it. I've tried setting the elevation, borderless style, and setting stateListAnimator as null. (These were suggestions on other posts.)
EDIT: Find the updated XML below. I have tried about every single suggestion in order to remove the shadows. (Even combined almost all of them) But I still can't get rid of them.
Main Layout
<?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"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:openDrawer="start">
<android.support.design.widget.CoordinatorLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:context="com.tqamobile.partyme.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">
<LinearLayout
android:layout_width="wrap_content"
android:background="#00aaaaaa"
android:layout_gravity="right"
android:layout_height="match_parent">
<ImageButton
android:id="#+id/notification_button"
android:layout_height="match_parent"
android:layout_width="wrap_content"
android:elevation="0dp"
android:background="#android:color/transparent"
android:stateListAnimator="#null"
android:theme="#style/AppTheme.ToolbarButton"
android:src="#drawable/ic_no_notifications_action" />
</LinearLayout>
</android.support.v7.widget.Toolbar>
</android.support.design.widget.AppBarLayout>
<include
layout="#layout/content_main" />
</android.support.design.widget.CoordinatorLayout>
<android.support.design.widget.NavigationView
android:id="#+id/navigation_view"
android:layout_height="match_parent"
android:layout_width="wrap_content"
android:layout_gravity="start"
app:itemTextColor="#color/colorAccent"
app:headerLayout="#layout/nav_header"
app:menu="#menu/menu_navigation" />
</android.support.v4.widget.DrawerLayout>
Styles
<style name="AppTheme.ToolbarButton" parent="#style/Widget.AppCompat.Button.Borderless"/>
Change background of buttons from your current attributes to #null like this:
android:background="#null"
You should add your buttons as menu items instead.
Full guide here: https://stackoverflow.com/a/31477092/4974603
<?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:context=".MainActivity">
<item
android:id="#+id/action_settings"
android:orderInCategory="100"
android:title="#string/action_settings"
app:showAsAction="never" />
<item
android:id="#+id/action_search"
android:orderInCategory="200"
android:title="Search"
android:icon="#drawable/ic_search"
app:showAsAction="ifRoom"
></item>
<item
android:id="#+id/action_user"
android:orderInCategory="300"
android:title="User"
android:icon="#drawable/ic_user"
app:showAsAction="ifRoom"></item>
</menu>

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!

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>

Categories

Resources