Develop Reference

remove default margin bottom from Toolbar

In my application I use the android.support.v7.widget.Toolbar for the toolbar.
Here is my layout
<?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"
tools:context="com.todo.app.MainActivity"
style="#style/MainActivityBg">
<android.support.design.widget.AppBarLayout
android:layout_height="wrap_content"
android:layout_width="match_parent">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
android:elevation="4dp"
android:theme="#style/AppTheme.AppBarOverlay"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"
style="#style/AppTheme.ActionBar"/>
</android.support.design.widget.AppBarLayout>
<include layout="#layout/content_main"/>
and
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
tools:showIn="#layout/activity_main"
tools:context="com.todo.app.MainActivity"
android:layout_marginTop="5dp"> <!-- for adding some space between the toolbar and the rest, and this is the cause of the problem! -->
<android.support.v7.widget.RecyclerView
android:id="#+id/task_list"
android:layout_width="match_parent"
android:layout_height="match_parent" />
I try to add some space between the toolbar and the rest of the view. To do that I added 5dp in marginTop to the layout which is right under the view. And this causes this problem:
While I scrolling the view there is some space remaining under the toolbar.
In my style files xml, there is no style for margin or padding.
How I can adding some space between toolbar and the rest without trigger this problem (when I scrolling the view)?

Reason
Based on the xml files, it seems to me that:
<android.support.constraint.ConstraintLayout
...
android:layout_marginTop="5dp">
is the reason for cropping RecyclerView content.
When you set the layout_marginTop between the AppBarLayout and the upper edge of ConstraintLayout appears a 5dp high empty space.
You can confirm that by turning on one of the Android options for developers: Show Layout Bounds.
Solution
For the effect which you want to achieve try to remove android:layout_marginTop and set android:paddingTop for the RecyclerView but also set android:clipToPadding to false.
Check the gif in this SO answer.
<android.support.v7.widget.RecyclerView
android:id="#+id/task_list"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingTop="5dp"
android:clipToPadding="false" />
This will allow you to add the desired space at the beginning of scrollable content but prevent cropping the items.

If the 5dp top margin isn't the problem, it may be the toolbar elevation, try to change 4dp to something much higher and check if changes your problem. Can you try same with margin top? Also a negetive margin sometimes work. Put a negetive margin on button of the toolbar and check.

Toolbar not getting invisible appropriately. Please see details

I want an invisible toolbar but I want the back arrow and title to be displayed.
For achieving this, I did the following:
<?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"
tools:context="com.abc.xyz.AboutActivity">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay"
android:background="#color/toolbarTransparent">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"/>
</android.support.design.widget.AppBarLayout>
<FrameLayout
android:id="#+id/header_about"
android:layout_width="match_parent"
android:layout_height="160dp"
android:background="#color/colorAccent"/>
<ImageView
android:id="#+id/a"
android:layout_width="match_parent"
android:layout_height="70dp"
android:src="#drawable/a"
app:layout_anchor="#id/header_about"
app:layout_anchorGravity="bottom|center"/>
<include layout="#layout/content_about"/>
</android.support.design.widget.CoordinatorLayout>
But, I'm getting the following result (Look how toolbar is still appearing to be there):
I want the toolbar to get invisible and only the title and back arrow to be shown.
Please let me know how can I achieve that.
Sorry for bad format of the question. I'm still a beginner here.

AppBarLayout has default elevation value and that is why you can see shadow. You can set AppBarLayout elevation to 0dp
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay"
app:elevation="0dp"
android:background="#color/toolbarTransparent">
or just remove AppBarLayout. Toolbar is transparent by default.
If you want to use AppBarLayout with transparent background on Android Lolipop version and greater - set outline provider to BACKGROUND like below:
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
appBarLayout.setOutlineProvider(ViewOutlineProvider.BACKGROUND);
}
In this case when your background is transparent shadow will be not visible.

please check the android manifest file it should have AppTheme.NoActionBar then u will be able to hide it

how to make tablayout transparent on image slider

how to make tab layout transparent on image slider...here is my layout where i declared tab layout...i searched lot but i don't got any solution for this...
<RelativeLayout
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.support.design.widget.TabLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="150dp"
android:id="#+id/tablayout"
android:textAllCaps="false"
android:background="#db000000"
app:tabMode="fixed"
app:elevation="0dp"
app:tabGravity="fill"
app:tabTextColor="#FFFFFF"
app:tabSelectedTextColor="#EF9C1A"
android:tabStripEnabled="true"
>
</android.support.design.widget.TabLayout>
</RelativeLayout>
like in this image..
my app is like this

Just set it's android:background to #70000000. This will make it semi transparent. Just change the 70 value to something that fits you better. 99 is darken. 10 is transparent (lighter)
Edit: For making it completely transparent just use android:background="#android:color/transparent"

Remove Tabs layout's shadow in android. API >= 21

I wanna remove this shadow from the TabLayout, but in api 21 nothing is working. I've tried defining windowContentOverlay to #null or elevation to 0dp or #null, but not seems to work.
Could someone help me?
http://i.stack.imgur.com/Qh7ml.png
Heres is a screenschot.
<android.support.design.widget.CoordinatorLayout
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.support.design.widget.AppBarLayout
android:layout_height="wrap_content"
style="#style/tabs"
android:layout_width="match_parent">
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
style="#style/tabs"
android:layout_height="wrap_content"
app:layout_scrollFlags="scroll|enterAlways"/>
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
</android.support.design.widget.CoordinatorLayout>

I am facing same problem and windowContentOverlay to #null also not worked for me. But when I changed android.support.design.widget.CoordinatorLayout and android.support.design.widget.AppBarLayout to LinearLayout it worked for me and bottom shadow of tablayout get removed.
I was tried with custom styles for android.support.design.widget.CoordinatorLayout and android.support.design.widget.AppBarLayout but did not get any success.
For now I keeping it in LinearLayout to remove bottom shadow.

Set app:elevation="0dp" in your AppBarLayout (maybe in the TabLayout too..)

Extended Toolbar with Custom View not Displaying with Full Width

I went through lots of answers here related to Toolbar but none of the answers could help me.
What I'm trying to achieve is to have an extended toolbar whhich will display a logo, possibly a name of the Activity/App, it will have an action button/drawer toggle to the right that will display a navigation-like drawer to the right, an overflow menu with other options like settings and also a navigation Tab at the bottom that will allow the user to move between different fragments (different days in a month).
The way I'm trying to achieve this is through toolbar.
First I create the toolbar and add my custom view.
<?xml version="1.0" encoding="utf-8"?>
<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_actionbar"
android:layout_width="match_parent"
android:layout_height="#dimen/min_double_toolbar_height"
app:theme="#style/ThemeOverlay.AppCompat.ActionBar"
android:minHeight="?attr/actionBarSize"
android:background="#color/primary"
app:contentInsetStart="0dp"
app:contentInsetEnd="0dp"
app:contentInsetLeft="0dp"
app:contentInsetRight="0dp"
android:clipToPadding="false"
>
<!-- ThemeOVerlay Makes sure the text and items are using solid colors-->
<include
android:layout_width="match_parent"
android:layout_height="72dp"
android:layout_gravity="bottom"
layout="#layout/day_navigation_tab"
/>
</android.support.v7.widget.Toolbar>
day_navigation_tab is just a horizontal with Two image views with Padding of 72dp (as by guidelines) and a text view with layout weight set to 1 so it stretches for the whole available space. And a height of 72dp.
Now in my BaseActivity XML I include the toolbar in the Framelayout of the main context (otherwise the toolbar would cover the whole screen for an unknown reason for me (took me ages to figre that out))
<...ommited>
<FrameLayout
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent">
<include
android:id="#+id/toolbar"
layout="#layout/app_bar"
/>
</FrameLayout>
<!-- android:layout_gravity="start" tells DrawerLayout to treat
this as a sliding drawer on the left side for left-to-right
languages and on the right side for right-to-left languages.
If you're not building against API 17 or higher, use
android:layout_gravity="left" instead. -->
<!-- The drawer is given a fixed width in dp and extends the full height of
the container. -->
<fragment android:id="#+id/navigation_drawer"
android:layout_width="#dimen/navigation_drawer_width"
android:layout_height="match_parent"
android:layout_gravity="right"
android:name="alterway.agency.timeentry.NavigationDrawerFragment"
tools:layout="#layout/fragment_navigation_drawer"
app:layout="#layout/fragment_navigation_drawer"
/>
</android.support.v4.widget.DrawerLayout>
However, when I use the toolbar I inflate the Menu on the actionBar in onCreateOptionsMenu my custom view gets shrinked and won't extend the edge of the created options.
A picture below illustrates that better, It's a screenshot from a Design View in Android Studio.
Yellow rectangle indicates where the option items will be placed.
Purple indicates the original size in the DesignView. Black indicates the size when running the app.
Thank you for any help.
Related questions that might be useful to anybody who comes across this looking to solve a similar problem:
design - Support Toolbars custom view not using full width
How do I set up an extended toolbar on Android L

So in order to achieve this and have complete control over the padding in the toolbar I created two toolbars. The first toolbar with standard height of 56dp and second with height of 72dp which together made a double layered toolbar as specified by material design.
And because I am not inflating any menu items in the second toolbar all my cusotm views inside behave as desired.
These lines still need to be used though
app:contentInsetStart="0dp"
app:contentInsetEnd="0dp"
app:contentInsetLeft="0dp"
app:contentInsetRight="0dp"
android:clipToPadding="false"
This solved my issue so now I'm including two toolbars into my XMl.

since versions 23 of the design support libraries there is a much simpler way to do it using android.support.design.widget.CoordinatorLayout
This is an example:
<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.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:popupTheme="#style/AppTheme.PopupOverlay">
</android.support.v7.widget.Toolbar>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/project_light_green"
android:orientation="horizontal"
android:paddingLeft="#dimen/activity_horizontal_margin_half"
android:paddingRight="#dimen/activity_horizontal_margin_half"
android:paddingTop="#dimen/activity_vertical_margin_half">
<ImageView
android:layout_width="24dp"
android:layout_height="24dp"
android:layout_margin="12dp"
android:src="#drawable/ic_search_24dp" />
<EditText
android:id="#+id/search_field"
android:layout_width="0dp"
android:layout_height="48dp"
android:layout_weight="1"
android:background="#null"
android:hint="#string/autocomplete_hint"
android:singleLine="true"
android:textColor="#color/project_black"
android:textColorHint="#color/project_dark_gray"/>
<include layout="#layout/close_button"
android:id="#+id/clearButton"/>
</LinearLayout>
</android.support.design.widget.AppBarLayout>
<include layout="#layout/content_search_location" />
</android.support.design.widget.CoordinatorLayout>

From the Toolbar documentation:
One or more custom views. The application may add arbitrary child
views to the Toolbar. They will appear at this position within the
layout. If a child view's Toolbar.LayoutParams indicates a Gravity
value of CENTER_HORIZONTAL the view will attempt to center within the
available space remaining in the Toolbar after all other elements have
been measured.
So from what it look like, your custom view is behaving as it should. The options menu is taking up a certain amount of space in your toolbar, so the Toolbar is measuring the remaining space for your custom view to fit in.