Baseline aligned TextInputLayout and Spinner

Question

I try to align spinner and edit text by baseline, but it doesn't work:

It start happen after update support library dependency from 24.1.1 to 24.2.1 (support-v4, appcompat-v7, design). This is my xml code:

        <RelativeLayout
            android:id="@+id/email_layout"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal">

            <android.support.v7.widget.AppCompatSpinner
                android:id="@+id/spinner"
                style="@style/MailSpinner"
                android:layout_width="120dp"
                android:layout_height="wrap_content"
                android:layout_alignParentEnd="true"
                android:dropDownWidth="wrap_content" />
            <android.support.design.widget.TextInputLayout
                android:id="@+id/text_input_layout"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginEnd="8dp"
                android:layout_alignBaseline="@id/spinner"
                android:layout_toStartOf="@id/spinner"
                android:baselineAlignedChildIndex="0">
                <android.support.v7.widget.AppCompatEditText
                    android:id="@+id/edit_text"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:hint="E-mail"
                    android:ellipsize="end"
                    android:imeOptions="actionNext"
                    android:inputType="textEmailAddress"
                    android:textSize="16sp"/>
            </android.support.design.widget.TextInputLayout>


        </RelativeLayout>

MailSpinner style:

<style name="MailSpinner" parent="Widget.AppCompat.Spinner.Underlined">
    <item name="android:background">@drawable/spinner_textfield_background</item>
    <item name="backgroundTint">@color/spinner_tint</item>
    <item name="backgroundTintMode">src_atop</item>
</style>

Answer 1

Essentially the TextInputLayout isn't providing a baseline value to it's parent. We need to pipe the correct baseline of the EditText by extending TextInputLayout. This works for me, however, I'm not sure if the baseline would change due to other events from the TextInputLayout.

public class CTextInputLayout extends TextInputLayout {
    public CTextInputLayout(Context context) {
        super(context);
    }

    public CTextInputLayout(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    public CTextInputLayout(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
    }

    @Override
    public int getBaseline()
    {
        EditText editText = getEditText();
        return editText.getPaddingTop() + editText.getBaseline();
    }
}

Answer 2

I think this version is better when hint label is floating

public class CTextInputLayout extends TextInputLayout {
public CTextInputLayout(Context context) {
    super(context);
}

public CTextInputLayout(Context context, AttributeSet attrs) {
    super(context, attrs);
}

public CTextInputLayout(Context context, AttributeSet attrs, int defStyleAttr) {
    super(context, attrs, defStyleAttr);
}

@Override
public int getBaseline() {
    EditText editText = getEditText();
    return getMeasuredHeight() - (editText.getMeasuredHeight() - editText.getBaseline());
}
}