How to align an element of a Collapsingtoolbarlayout to the title?

Question

I have a CollapsingToolbarLayout with a LinearLayout inside (which contains some texts). Toolbar title has a default margin on the left (at least on LTR devices) when it is expanded and a different one when it is retracted.

How can I align this Linearlayout to the Toolbar title when it is expanded?

Answer 1

One solution is to apply the same value to the bar title margin (via the attribute expandedTitleMarginStart) and the element containing the text. In my case, android:layout_marginStart.

Example:

<android.support.design.widget.CollapsingToolbarLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:fitsSystemWindows="true"
        app:title="Título"
        app:expandedTitleMarginStart="36dp"
        android:background="@color/white"
        app:contentScrim="@color/orange"
        app:layout_scrollFlags="scroll|exitUntilCollapsed">

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

            <ImageView
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:scaleType="centerCrop"
                android:contentDescription="Foto" />

            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginStart="36dp"
                android:layout_marginLeft="36dp"
                android:layout_centerVertical="true"
                android:orientation="vertical">

                <TextView
                    android:textSize="18sp"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="Texto maior"/>

                <TextView
                    android:textSize="14sp"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="Texto menor"/>

            </LinearLayout>


        </RelativeLayout>


        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            app:layout_collapseMode="pin"
            app:popupTheme="@style/AppTheme.PopupOverlay" />

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