How to add view below the toolbar?

Question

Is there a simple way to add view(s) below the toolbar, without compromising its current appearance? I just want to add an extra view right below the text of the toolbar. Note that toolbars have shadows and simply adding the view below the toolbar widget will not achieve what I want.

@Prachi I don't have any (yet).. I'm only using the default toolbar and just want to know how I can add view below its title's textview — Gama the Great, Aug 28 '15 at 06:59
same way you add components into `Relative layout` or `linear layout` — Prachi, Aug 28 '15 at 07:04
@Prachi by doing that, the toolbar will add the view horizontally (between the title and the menu buttons) not vertically — Gama the Great, Aug 28 '15 at 07:10

score 4 · Answer 1 · answered Dec 12 '16 at 06:16

Add android:layout_height="?attr/actionBarSize" in your Toolbar like:

 <android.support.v7.widget.Toolbar
                        android:id="@+id/toolbar"
                        android:layout_width="match_parent"
                        android:layout_height="?attr/actionBarSize"
                        android:titleTextColor="#ffffff"
                        android:background="#ECA539"
                        app:layout_collapseMode="pin"
                        app:popupTheme="@style/ThemeOverlay.AppCompat.Light"/>

and then add android:layout_marginTop="?attr/actionBarSize" in your Relativelayout like below:

<RelativeLayout

                app:layout_behavior="@string/appbar_scrolling_view_behavior"
                android:layout_width="match_parent"
                android:layout_marginTop="?attr/actionBarSize"
                android:layout_height="wrap_content">

score 2 · Answer 2 · edited May 23 '17 at 10:30

Use this code to do that.

<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:layout_gravity="top"
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/app_color"
    android:titleTextAppearance="@android:color/white"
    app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar" />

<FrameLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <!-- **** Place Your Content Here **** -->


    <TextView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:text="My Content"/>

    <!-- **** This is your view that appears below toolbar **** -->
    <View
        android:layout_width="match_parent"
        android:layout_height="5dp"
        android:background="@drawable/toolbar_dropshadow" />
</FrameLayout></LinearLayout>

@toolbar_dropshadow

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
<gradient
    android:startColor="@android:color/transparent"
    android:endColor="#88333333"
    android:angle="90"/>
</shape>

For more information follow this link : https://stackoverflow.com/a/26904102/3907780

score 0 · Answer 3 · answered Aug 28 '15 at 07:13

0

    <android.support.v7.widget.Toolbar
mlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/custom_tool_bar"
        android:layout_width="fill_parent"
        android:layout_height="@dimen/actionbar_height"
         android:gravity="center">

        <RelativeLayout
            android:layout_width="fill_parent"
            android:layout_height="fill_parent">

//Add your components here
 </RelativeLayout>

    </android.support.v7.widget.Toolbar>

answered Aug 28 '15 at 07:13

Prachi

2,559
4
25
37

tried it out and it still appeared between the title and the menu buttons – Gama the Great Aug 28 '15 at 07:24
post your xml and screenshot – Prachi Aug 28 '15 at 07:26
The black area in the [screenshot](http://i.imgur.com/qwXmup5.jpg) is the view I'm adding – Gama the Great Aug 28 '15 at 07:45

score 0 · Answer 4 · answered Aug 09 '16 at 08:31

0

What worked for me in the above post was changing the layout the toolbar was in into a linear layout.

Whilst using frame layout, the views were places underneath the toolbar.

answered Aug 09 '16 at 08:31

JoshuaTree

1,211
14
19

score 0 · Answer 5 · answered Aug 25 '16 at 16:46

If you are using the RelativeLayout, use:

<android.support.v7.widget.Toolbar
mlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/custom_tool_bar"
android:layout_width="fill_parent"
android:layout_height="@dimen/actionbar_height"
android:gravity="center">

<RelativeLayout
        android:layout_width="fill_parent"
        android:layout_height="fill_parent">

//Add your components here, ie.:
<MyView android:id="@+id/black_box"
android:layout_below="@id/my_toolbar" //relativity left or right available too
android:layout_width="match_parent"
etc.etc./>
</RelativeLayout>

</android.support.v7.widget.Toolbar>`

I'm not sure why your toolbar is above the layout scope, but try it and let us know.

How to add view below the toolbar?

5 Answers5