First you must know default android material design check image below from android develper page
<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" />
change colorPrimary
From
<color name="colorPrimary">#3F51B5</color>
To
<color name="colorPrimary">#aa3939</color>
- Change toolbar background to image change android:background to your drawable file
android:background="?attr/colorPrimary"
- Change the status bar background color change
From
<color name="colorPrimaryDark">#303F9F</color>
To
<color name="colorPrimaryDark">#550000</color>
- Change the status bar background To image or gradient color
We cant change it direct but to do that you need to set colorPrimaryDark to transparent
<color name="colorPrimaryDark">#0000</color>
Then set background to “CoordinatorLayout” At “activity_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"
android:background="@drawable/coordinator_layout_bg"
tools:context=".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>
<include layout="@layout/content_main" />
</android.support.design.widget.CoordinatorLayout>
The final output
- Change menu position
From
To
By default display menu over toolbar is the new android metrical design
Open your values/style.xml and add overflowmenu style to your AppTheme
For before Lollipop
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">@color/colorPrimary</item>
<item name="colorPrimaryDark">@color/colorPrimaryDark</item>
<item name="colorAccent">@color/colorAccent</item>
<item name="actionOverflowMenuStyle">@style/overFlowMenyStyle</item>
</style>
<style name="overFlowMenyStyle" parent="Widget.AppCompat.PopupMenu.Overflow">
<item name="overlapAnchor">false</item>
<!--<item name="android:dropDownVerticalOffset">5dp</item>-->
</style>
For Lollipop open v21/style.xml
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">@color/colorPrimary</item>
<item name="colorPrimaryDark">@color/colorPrimaryDark</item>
<item name="colorAccent">@color/colorAccent</item>
<item name="actionOverflowMenuStyle">@style/overFlowMenyStyle</item>
</style>
<style name="overFlowMenyStyle" parent="Widget.AppCompat.PopupMenu.Overflow">
<item name="android:overlapAnchor">false</item>
<!--<item name="android:dropDownVerticalOffset">5dp</item>-->
</style>
- Change menu icon and add icons to menuItems
Open your menu_main.xml file
Then update the menu like below
<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_test"
android:icon="@android:drawable/ic_menu_more"
android:orderInCategory="1"
app:showAsAction="always">
<menu>
<item
android:id="@+id/action_settings"
android:icon="@android:drawable/ic_menu_manage"
android:title="@string/action_settings" />
</menu>
</item>
</menu>
open MainActivity.java
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
toolbar.setNavigationIcon(R.mipmap.ic_launcher);
setSupportActionBar(toolbar);
The MIT License (MIT)
Copyright (c) 2016 sallySalem
Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.