How To Make Material Design Actionbar/Toolbar In 7 Simple Steps.
Step 1.
Open Android Studio and create a new project and select a blank activity.
Step 2.
Add Appcombat v7 Support library to your project or not if already.Step 3.
Make new resources file "colors.xml", clear it and add these to it.
- <?xml version="1.0" encoding="utf-8"?>
- <resources>
- <color name="ColorPrimary">#FF5722</color>
- <color name="ColorPrimaryDark">#E64A19</color>
- </resources>
Step 4.
Open "style.xml", clear it and add these to it.
- <resources>
- <item name="colorPrimary">@color/ColorPrimary</item>
- <item name="colorPrimaryDark">@color/ColorPrimaryDark</item>
- <!-- Base application theme. -->
- <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
- <item name="colorPrimary">@color/ColorPrimary</item>
- <item name="colorPrimaryDark">@color/ColorPrimaryDark</item>
- <!-- Customize your theme here. -->
- </style>
- </resources>
Step 5.
Make a new layout "toolbar.xml", clear it and add these to it.- <?xml version="1.0" encoding="utf-8"?>
- <android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
- android:layout_width="match_parent"
- android:layout_height="wrap_content"
- android:elevation="4dp"
- android:background="#ff404040">
- </android.support.v7.widget.Toolbar>
Step 6.
On your "activity_main.xml" clear all and add these.
- <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
- xmlns:tools="http://schemas.android.com/tools"
- android:layout_width="match_parent"
- android:layout_height="match_parent"
- tools:context=".MainActivity">
- <include
- android:id="@+id/toolbar"
- layout="@layout/toolbar"/>
- <RelativeLayout
- android:layout_width="fill_parent"
- android:layout_height="fill_parent"
- android:layout_alignParentLeft="true"
- android:layout_alignParentStart="true"
- android:layout_below="@+id/toolbar"
- android:layout_alignParentRight="true"
- android:layout_alignParentEnd="true"
- android:layout_alignParentBottom="true"
- android:paddingLeft="@dimen/activity_horizontal_margin"
- android:paddingTop="@dimen/activity_vertical_margin"
- android:paddingRight="@dimen/activity_horizontal_margin"
- android:paddingBottom="@dimen/activity_vertical_margin">
- <TextView
- android:layout_width="wrap_content"
- android:layout_height="wrap_content"
- android:text="@string/hello_world" />
- </RelativeLayout>
- </RelativeLayout>
Note : Don't Use Padding In Layout That Holds Toolbar.
Step 7.
Open "MainActivity.java" and add these in onCreate.
Comments
Post a Comment