TextInputLayout text header gone when using FrameLayout

Question

This is my current xml layout:

<android.support.design.widget.TextInputLayout
                    android:id="@+id/emailAddressLayout"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_marginTop="20dp"
                    android:focusable="true"
                    android:clickable="true">

                    <FrameLayout
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:layout_marginTop="9dp"
                        android:padding="5dp"
                        android:focusable="false"
                        android:clickable="false">

                        <AutoCompleteTextView
                            android:id="@+id/emailAddress"
                            android:layout_width="match_parent"
                            android:layout_height="wrap_content"
                            android:focusableInTouchMode="true"
                            android:hint="email address"
                            android:inputType="textEmailAddress"
                            android:imeOptions="actionNext"
                            android:maxLines="1" />

                    <Button
                        android:id="@+id/emailTextClearButton"
                        android:layout_width="20dp"
                        android:layout_height="20dp"
                        android:layout_marginRight="5dp"
                        android:layout_marginEnd="5dp"
                        android:layout_gravity="end|center_vertical"
                        android:background="@drawable/ic_clear_black_svg" />

                    </FrameLayout>

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

I need my FrameLayout in order to accomplish a (x) clear button within my AutoCompleteTextView.

The problem is that the FrameLayout is negating the effect of TextInputLayout so the text is not pushed up when user inputs text or clicks on AutoCompleteTextView.

Current result: (Missing Email address header text)

Wanted result: (I added an x clear button to show what's missing when not using FrameLayout)

Answer 1

I ended up solving my question using the following in my XML:

<android.support.design.widget.TextInputLayout
                    android:id="@+id/emailAddressTextInput"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_marginTop="10dp">

                        <AutoCompleteTextView
                            android:id="@+id/emailAddress"
                            style="@style/body_text_style"
                            android:layout_width="match_parent"
                            android:layout_height="wrap_content"
                            android:clickable="true"
                            android:focusable="true"
                            android:focusableInTouchMode="true"
                            android:hint="@string/prompt_email_address"
                            android:imeOptions="actionNext"
                            android:inputType="textEmailAddress"
                            android:maxLines="1"/>

                        <!--work around solution using negative marginTop-->
                        <Button
                            android:id="@+id/emailTextClearButton"
                            android:layout_width="20dp"
                            android:layout_height="20dp"
                            android:layout_gravity="end|center_vertical"
                            android:layout_alignParentRight="true"
                            android:layout_alignParentEnd="true"
                            android:layout_centerVertical="true"
                            android:layout_marginEnd="5dp"
                            android:layout_marginRight="5dp"
                            //work around solution
                            android:layout_marginTop="-32dp"
                            android:background="@drawable/ic_clear_black_svg"/>

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

The WORKAROUND is to set my button underneath my AutoCompleteTextView and use a negative marginTop on the button to be able to set it where it needs to be set.

Result:

Note: I'm using a RelativeLayout as parent of TextInputLayout