how to pin title in Toolbar inside CollapsingToolbarLayout

Question

Here is my layout:

Answer 1

It actually looks like the title from the Toolbar is gone when you wrap it inside a CollapsingToolBarLayout, so the only solution I got for this issue is to create a new TextView and add it to the ToolBar, remember that Toolbar is a ViewGroup, so you can add widgets to it. It's not as clean as I would like, but it works for now.

TextView text = new TextView(this);
text.setText(title);
text.setTextAppearance(this, android.R.style.TextAppearance_Material_Widget_ActionBar_Title_Inverse);
toolbar.addView(text);

Hope I can find an xml-friendly solution for this soon, too.

Answer 2

You need to enable actionBar.setDisplayHomeAsUpEnabled(true); in your code

Answer 3

In order for the Toolbar title to work with the CollapsingToolbarLayout you need to set the ctl's title enabled to false

CollapsingToolbarLayout collapsingToolbarLayout = (CollapsingToolbarLayout) findViewById(R.id.collapsing_toolbar);
collapsingToolbarLayout.setTitleEnabled(false);

Answer 4

Maybe this? Just add android:fitsSystemWindows="true" to AppBarLayout

<android.support.design.widget.CoordinatorLayout
    ...
    android:fitsSystemWindows="true">

    <android.support.design.widget.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="300dp"
        ...
        android:fitsSystemWindows="true"
        >

        <android.support.design.widget.CollapsingToolbarLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            >

            <android.support.v7.widget.Toolbar
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:minHeight="?attr/actionBarSize"
                android:background="?attr/colorPrimary"
                app:title="My Title"
                />

        </android.support.design.widget.CollapsingToolbarLayout>

    </android.support.design.widget.AppBarLayout>

    ...

</android.support.design.widget.CoordinatorLayout>

This is what you get

Answer 5

The solution is easy. As Daniel Persson said, you just set collapsingToolbarLayout.setTitleEnabled(false); or use the XML attribute app:titleEnabled="false" and set the title with the inner Toolbar instead of the CollapsingToolbarLayout, i.e.: toolbar.setTitle(title);

It is very simple and it not required workarounds.

Answer 6

The trick here is to set the titleEnabled = false of CollapsingToolbarLayout

<android.support.design.widget.CollapsingToolbarLayout
        android:id="@+id/collapsing_toolbar_layout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:contentScrim="?attr/colorPrimary"
        app:layout_scrollFlags="scroll|enterAlways"
        app:titleEnabled="false">

        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            android:minHeight="?attr/actionBarSize"
            app:layout_collapseMode="pin"
            app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
            app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
            app:title="Message"
            app:titleMarginTop="13dp"
            app:titleTextColor="@android:color/white" />

    </android.support.design.widget.CollapsingToolbarLayout>

Or through code:

CollapsingToolbarLayout collapsingToolbarLayout = (CollapsingToolbarLayout) findViewById(R.id.collapsing_toolbar_layout);
collapsingToolbarLayout.setTitleEnabled(false);