Develop Reference

How to put pagertitlestrip in the center top

I am trying to update my app and wanted to make the toolbar look like the black player. As of now i am able to set the search and navigation but how to put the pager title strip in the middle as inside viewpager i cannot use gravity i tried the margin and padding not working at all.
this is my xml
<com.antonyt.infiniteviewpager.InfiniteViewPager
android:id="#+id/pager"
android:layout_width="match_parent"
android:layout_height="match_parent">
<me.alexrs.fontpagertitlestrip.lib.FontPagerTitleStrip
android:id="#+id/titlestrip"
android:layout_width="wrap_content"
android:layout_height="50dp"
android:layout_marginEnd="50dp"
android:layout_marginStart="50dp"
android:background="#color/material_fragment_top"
app:fontFamily="#font/font"
app:theme="#style/AppTheme.PopupOverlay" />
</com.antonyt.infiniteviewpager.InfiniteViewPager>
<android.support.v7.widget.Toolbar
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="50dp"
app:theme="#style/CustomActionBar" />
how i can put the pagertitlestrip in the middle
So I want to put the padding but not able to do it at all

Seems like you want to change StatusBarColor.
try setStatusBarColor(int)and set colour of your toolbar or you can make it transparent
All you need to do is set these properties in your theme:
<item name="android:windowTranslucentStatus">true</item>
<item name="android:windowTranslucentNavigation">true</item>
Your activity / container layout you wish to have a transparent status bar needs this property set:
android:fitsSystemWindows="true"
but since you never specified API you're using I refer you to different question, you should find the answer.
How to change the status bar color in android
Android Completely transparent Status Bar?

Remove shadow toolbar below actionbar in blank activity

I've created a new project with a new blank activity using Android Studio and I'm trying to remove the shadow below the toolbar in >=API21. I've tried many things.
This works for < API21
<item name="android:windowContentOverlay">#null</item>
This doesn't work for me in phone with >=API21:
getSupportActionBar().setElevation(0);
<item name="android:elevation">0dp</item>
I don't know what else I can try. Any help is appreciated.
EDIT: I've tried everything from other questions like this but nothing worked.

As #Vipul Asri said, I had to add app:elevation="0dp" but I was adding it to the wrong place. This works:
<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="android.teechart.steema.com.androiddemo.DashboardWebAnalytics">
<android.support.design.widget.AppBarLayout
app:elevation="0dp"
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_dashboard_web_analytics" />
</android.support.design.widget.CoordinatorLayout>
I was adding it in android.support.v7.widget.Toolbar but the correct place was in android.support.design.widget.AppBarLayout.

This shadow is part of windowContentOverlay on APIs below LOLLIPOP (on LOLLIPOP it's #null).
When you work with Toolbar widget the toolbar isn't part of window decor anymore so the shadow starts at the top of the window over the toolbar instead of below it (so you want the windowContentOverlay to be #null). Additionally you need to add an extra empty View below the toolbar pre-LOLLIPOP with its background set to a vertical shadow drawable (8dp tall gradient from #20000000 to #00000000 works best). On LOLLIPOP you can set 8dp elevation on the toolbar instead.

How to center toolbar back button?

I'm having a problem trying to center the back button on the support toolbar.
I'm using it inside an ActionBarActivity.
<android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:toolbar="http://schemas.android.com/apk/res-auto"
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?attr/colorPrimary"
android:minHeight="?attr/actionBarSize"
toolbar:popupTheme="#style/ThemeOverlay.AppCompat.Light"
toolbar:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar" />
And set the up navigation inside the Activity's onCreate() like this:
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
getSupportActionBar().setTitle(R.string.title_activity_scanner);
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
However, what I'm getting is this:
As you can see the back button is misplaced
Edit:
The problem seems to lie in a custom value for ?attr/actionBarSize set to 40dp, however, it turns out now, that it's the title that is misplaced instead.

From the developer.android.com :
Toolbar supports a more focused feature set than ActionBar. From start
to end, a toolbar may contain a combination of the following optional
elements:
A navigation button. This may be an Up arrow, navigation menu toggle,
close, collapse, done or another glyph of the app's choosing. This
button should always be used to access other navigational destinations
within the container of the Toolbar and its signified content or
otherwise leave the current context signified by the Toolbar. The
navigation button is vertically aligned within the Toolbar's minimum
height, if set.
So if you set minHeight attribute the same as your toolbar height (layout_height ), the back arrow will be centered vertically.

(2020)
In case you have a non-standard toolbar height, to center the back button nowadays (2k20) with androidx Toolbar you can just use the buttonGravity property.
This allows you to use wrap_content instead of a specific height (minHeight doesn't allow you to do so):
<androidx.appcompat.widget.Toolbar
app:buttonGravity="center_vertical"
android:layout_height="wrap_content"
... />

Inside ActionBarActivity
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
getSupportActionBat().setTitle("Hello World");
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
getSupportActionBar().setHomeButtonEnabled(true);
Layout code :
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#color/primary"
app:theme="#style/ToolbarTheme"
app:popupTheme="#style/Theme.AppCompat"/>
And style :
<style name="AppTheme.Base" parent="Theme.AppCompat.Light">
<item name="colorPrimary">#color/primary</item>
<item name="colorPrimaryDark">#color/primaryDark</item>
<item name="android:windowNoTitle">true</item>
<item name="android:windowActionBar">false</item>
<item name="windowActionBar">false</item>
</style>
<style name="AppTheme" parent="AppTheme.Base">
Remember that toolbar is just viewgroup, so u can style it in any way u like.
Here is image link : Toolbar sample
Hope it helps.

Best way to achieve this is remove regular Back button from the toolbar and add a custom ImageButton in your XML layout and set image to it. You can place this ImageButtton wherever you want on the toolbar.
Your activity layout code should be something like this.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<include
android:id="#+id/toolbar"
layout="#layout/toolbar" />
<ImageButton
android:layout_width="60dp"
android:layout_height="60dp"
android:id="#+id/button"
android:src="#drawable/attach_icon"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true" />
</RelativeLayout>

For me, none of the solutions worked. In my case the problem was the margin I applied:
<android.support.v7.widget.Toolbar
android:layout_width="match_parent"
android:layout_height="wrap_content"
... >
<View
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="10dp"
android:layout_marginTop="10dp" />
</android.support.v7.widget.Toolbar>
After applying it to the toolbar directly, the button was centered vertically:
<android.support.v7.widget.Toolbar
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="10dp"
android:layout_marginTop="10dp"
... >
<View
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</android.support.v7.widget.Toolbar>

Piggybacking off of #Rick Sanchez answer - if you know the size of the Toolbar's minHeight attribute you can then use:
android:gravity="top"
app:titleMarginTop="#dimen/margin_to_center"
in the Toolbar to center the text. If you are using android:minHeight="?actionBarSize" then this would be about 13p

#Rick Sanchez answer is work,setup Toolbar's layout_height the same as minHeight
I found in Toolbar constructor have a field can setup button gravity,
mButtonGravity = a.getInteger(R.styleable.Toolbar_buttonGravity, Gravity.TOP);
,but v7 support Toolbar can not setup,
mButtonGravity = Gravity.TOP;

make your button size 56dp and set scaleType to center with no margins on Appbar
Make sure your icon is 24x24 dimensions

I was using
<style name="MyActionBar" parent="#style/Widget.AppCompat.ActionBar">
when I should've been using
<style name="MyActionBar" parent="#style/Widget.AppCompat.Toolbar">

Set elevation to View automatically the elevation of the Toolbar, how to change this?

I'm using a theme that will not show the ActionBar by default:
<style name="AppTheme" parent="Theme.AppCompat">
<item name="windowActionBar">false</item>
<item name="android:textColorPrimary">#FFFFFF</item>
</style>
However, I'm replacing it with Toolbar in xml:
<LinearLayout 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"
android:orientation="vertical"
... >
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar_VenueDetail"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#color/MainColor" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="300dp"
android:background="#color/MainColor"
android:elevation="#dimen/default_elevation"
android:orientation="vertical">
</LinearLayout>
</LinearLayout>
in OnCreate:
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar_VenueDetail);
setSupportActionBar(toolbar);
The expected result is a flat Toolbar and a shadow below the LinearLayout, which is exactly what preview in Android Studio shows me:
However in real life, the Toolbar has also taken effect:
I want to just put the shadow below another View and keep my Toolbar flat, how to achieve this? Is this even possible?

Do not set the toolbar as a support actionbar. You can still set navigation button, title and inflate menu on the toolbar but the elevation shouldn't be applied unless you set it explicitly in code or in the activity layout.
Having said that, make sure that the removing the elevation is not against the principles of material design.

Appcompat v21 Toolbar elevation pre-lollipop

First off, I know that this question has been asked before, but it hasn't been answered before. I hope someone can give me an answer.
In my application, I use the Toolbar from Appcompat_v7 (API 21). This is my code:
<android.support.v7.widget.Toolbar
style="#style/DarkActionbarStyle"
android:id="#+id/toolBar"
android:layout_width="match_parent"
android:layout_height="#dimen/actionbar_height" />
And this is the ToolBar style I use:
<style name="DarkActionbarStyle" parent="#style/Widget.AppCompat.Toolbar">
<item name="android:background">?attr/colorPrimary</item>
<item name="titleTextAppearance">#style/ActionBarTitle</item>
<item name="android:elevation">2dp</item>
<item name="popupTheme">#style/ThemeOverlay.AppCompat.Light</item>
<item name="theme">#style/ThemeActionBarDark</item>
</style>
<style name="ThemeActionBarDark" parent="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<item name="actionBarItemBackground">#drawable/btn_dark_orange</item>
<item name="selectableItemBackground">#drawable/btn_dark_orange</item>
</style>
The problem is, that elevation doesn't work pre-lollipop. So my question is: Is it possible to have a shadow under the ToolBar on pre-lollipop devices?

This worked for me very well:
<android.support.v7.widget.CardView
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/primary"
card_view:cardElevation="4dp"
card_view:cardCornerRadius="0dp">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/primary"
android:minHeight="?attr/actionBarSize" />
</android.support.v7.widget.CardView>

Using CardView container for toolbar is a bad idea.
CardView is heavy, especially for low end devices.
The best way is to put a gradient Shadow view below the toolbar. Shadow view must be a direct child to the coordinator layout. ie. The appbar which contains toolbar and shadow View must be siblings.
Add this view component to your layout.
<View
android:id="#+id/gradientShadow"
android:layout_width="match_parent"
android:layout_height="5dp"
android:background="#drawable/toolbar_shadow"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
app:layout_collapseMode="pin"/>
The drawable toolbar_shadow.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<gradient
android:angle="90"
android:endColor="#33333333"
android:startColor="#android:color/transparent"/>
</shape>
This will solve the problems in pre-lollipop devices. But we don't want this shadow in lollipop and above devices so make visibility to gone in devices with lollipop and above.
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
findViewById(R.id.gradientShadow).setVisibility(View.GONE);
}
Done.

You can add the shadow (elevation) back by using a FrameLayout with foreground="?android:windowContentOverlay". The elevation attribute is not supported pre-Lollipop. So if you are using FrameLayout like fragment container just add foreground attribute to it.

As I've had issues with the CardView widget method, I've used the FrameLayout method as mentioned by #Sniper; it is working perfectly!
I just wanted to share the code snippet you'll have to use.
Just put this directly under the toolbar where your main content starts:
<FrameLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:foreground="?android:windowContentOverlay">
And don't forget to close with:
</FrameLayout>

It's possible to have real shadows - animated and generated. The method used by Lollipop is available since Froyo. Hardware acceleration used for shadow generation is available since Honeycomb I guess. Here's how it works:
draw your view to an off-screen bitmap with LightingColorFilter set to 0,0
blur the black shape (the off-screen bitmap) using the ScriptIntrinsicBlur class and elevation value as radius
draw the bitmap beneath the view
It requires adding custom elevation attributes, custom views capable of rendering shadows, and using render script and the compatibility library (for older devices). I'm not going to dive into the details, because there's a lot of them including issues with compilation and minor performance optimisations. But it's possible.
Why there's no shadows in the official support library?
it would require changes in the UI framework as it's impossible to freely draw outside view bounds
smooth animation requires a quite good GPU
See:
https://www.youtube.com/watch?v=jbU4SXblO5s
https://androidreclib.wordpress.com/2014/11/25/lollipops-shadows-on-gingerbread/
https://github.com/ZieIony/Carbon

I'm using this answer:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/orange"
android:titleTextAppearance="#color/White"
app:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar" />
<View
android:layout_width="match_parent"
android:layout_height="5dp"
android:background="#drawable/toolbar_shadow" />
</LinearLayout>
toolbar_shadow.xml:
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<gradient
android:startColor="#3f3f3f"
android:endColor="#android:color/transparent"
android:angle="270" />
</shape>

You can't use the elevation attribute before API 21 (Android Lollipop).
You can however add the shadow programmatically, for example using a custom view placed below the Toolbar.
For example:
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/toolbar"
android:background="#drawable/shadow"/>
Where the shadow is a drawable with a black gradient.

To show shadow under your toolbar please use AppBarLayout available in Google Android Design Support Library. Here is an example of how it should be used.
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.v7.widget.Toolbar
android:layout_height="?attr/actionBarSize"
android:layout_width="match_parent"/>
</android.support.design.widget.AppBarLayout>
To use Google Android Design Support Library enter following into your build.gradle file:
compile 'com.android.support:design:22.2.0'

The solution with a view to add a shadow manually would work as long as there are no action bar menus. If so, the shadow view would stop before the action bar icons.
i think it is easier to have a vertical linear layout with appbar on the top and a view for shadow below it as the next linear layout item or in my case, it is
<LinearLayout Vertical>
<v7 toolbar/>
<RelativeLayout>
<View for shadow with alignParent_top= true/>
....
</RelativeLayout>
</LinearLayout>
I really hope the near future appCompat would fix this.