Material OutlinedBox hint with androidx

Question

I am referring this: Outlined Edit Text from Material Design where the answer relates to the outdated support libraries rather than androidx.

How to achieve creating the OutlinedBox with the hint on the top left frame rather than inside the box? Have spent the entire morning unsuccessful. What I want is this:

My graddle:

implementation 'androidx.appcompat:appcompat:1.1.0'
implementation 'com.google.android.material:material:1.1.0'

My app Theme:

style name="AppTheme" parent="Theme.MaterialComponents.Light.NoActionBar"

My layout:

<com.google.android.material.textfield.TextInputLayout
                android:id="@+id/textField"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginTop="20dp"
                style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"
                android:hint="Full name" >

                <com.google.android.material.textfield.TextInputEditText
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    />
            </com.google.android.material.textfield.TextInputLayout>

My result (the frame is continuous, without the hint embedded in the top left corner):

Answer 1

Try below code:

<com.google.android.material.textfield.TextInputLayout
            android:id="@+id/etlFirst"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"
            app:hintTextColor="@color/colorPrimary"
            android:focusable="true"
            android:hint="Label">
            <com.google.android.material.textfield.TextInputEditText
                android:id="@+id/etFirst"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:textColorHint="@color/colorAccent"
                android:hint="PlaceHolder"/>
        </com.google.android.material.textfield.TextInputLayout>

To displaying two hints try below code in .java file:

etFirst.setOnFocusChangeListener(new View.OnFocusChangeListener() {
        @Override
        public void onFocusChange(View v, boolean hasFocus) {
            if (hasFocus) {
                etFirst.setHint("Place Holder");

            } else {
                etFirst.setHint("Label");
            }
        }
    });

Output for above code is:

I hope this helps you