When extend AppCompatEditText it overlap on TextView – Android

July 28, 2022

I have bellow layout:

<?xml version="1.0" encoding="utf-8"?>
<androidx.coordinatorlayout.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true"
    tools:context=".activities.completion_information_activity.CompletionInformationActivity">

    <com.google.android.material.appbar.AppBarLayout
        android:id="@+id/appBarCompletionInformation"
        android:layout_width="match_parent"
        android:layout_height="240dp"
        android:theme="@style/AppTheme.AppBarOverlay">

        <com.google.android.material.appbar.CollapsingToolbarLayout
            android:id="@+id/toolbarLayoutCompletionInformation"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:minHeight="60dp"
            app:contentScrim="?attr/colorPrimary"
            app:layout_scrollFlags="scroll|exitUntilCollapsed"
            app:toolbarId="@+id/toolbarCompletionInformation">

            <androidx.appcompat.widget.Toolbar
                android:id="@+id/toolbarCompletionInformation"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                android:contentInsetStart="0dp"
                android:contentInsetLeft="0dp"
                android:contentInsetEnd="0dp"
                android:contentInsetRight="0dp"
                app:contentInsetEnd="0dp"
                app:contentInsetLeft="0dp"
                app:contentInsetRight="0dp"
                app:contentInsetStart="0dp"
                app:layout_collapseMode="pin"
                app:popupTheme="@style/AppTheme.PopupOverlay"
                app:title="SSADSDWQEWQ">

                <RelativeLayout

                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:layout_gravity="center">

                    <ImageButton
                        android:id="@+id/imgBackCompletionInformation"
                        android:layout_width="50dp"
                        android:layout_height="match_parent"
                        android:layout_centerVertical="true"
                        android:background="@null"
                        android:src="@drawable/ic_baseline_arrow_back_24"
                        app:tint="@color/black" />


                </RelativeLayout>
            </androidx.appcompat.widget.Toolbar>


            <RelativeLayout
                android:id="@+id/relativeLayoutCompletionInformation"
                android:layout_width="75dp"
                android:layout_height="75dp"
                android:layout_gravity="center_horizontal"
                android:layout_marginTop="25dp"
                android:background="@drawable/border">

                <ImageView
                    android:id="@+id/imgProfileCompletionInformation"
                    android:layout_width="70dp"
                    android:layout_height="70dp"
                    android:layout_centerInParent="true"
                    android:adjustViewBounds="true"
                    android:padding="3dp"
                    android:scaleType="fitXY" />

                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_alignBottom="@+id/imgProfileCompletionInformation"
                    android:layout_alignParentRight="true"
                    android:src="@drawable/ic_baseline_photo_camera_24" />

            </RelativeLayout>

            <RelativeLayout
                android:id="@+id/relativeLayoutToFadeOutCompletionInformation"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                app:layout_collapseMode="parallax">

                <TextView
                    android:id="@+id/txtProfileNameCompletionInformation"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="User Name"
                    android:textColor="@color/black"
                    android:textSize="20sp"
                    android:textStyle="bold" />
            </RelativeLayout>

        </com.google.android.material.appbar.CollapsingToolbarLayout>

    </com.google.android.material.appbar.AppBarLayout>

    <androidx.core.widget.NestedScrollView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@color/bright_gray"
        android:fitsSystemWindows="true"
        app:layout_behavior="@string/appbar_scrolling_view_behavior"
        tools:context="...CompletionInformationActivity"
        tools:showIn="@layout/activity_completion_information">

        <androidx.constraintlayout.widget.ConstraintLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:focusable="true"
            android:focusableInTouchMode="true">

            <androidx.constraintlayout.widget.ConstraintLayout
                android:id="@+id/one"
                android:layout_width="match_parent"
                android:layout_height="70dp"
                android:background="@drawable/custom_cardview_bottom_top_shadow"
                app:layout_constraintLeft_toLeftOf="parent"
                app:layout_constraintRight_toRightOf="parent"
                app:layout_constraintTop_toTopOf="parent">

                <RelativeLayout
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:layout_marginLeft="16dp"
                    android:layout_marginRight="16dp"
                    android:orientation="horizontal">

                    <androidx.appcompat.widget.AppCompatEditText
                        android:id="@+id/edtUserNameEdit"
                        android:layout_width="wrap_content"
                        android:layout_height="48dp"
                        android:layout_alignParentLeft="true"
                        android:background="@drawable/text_input_layout_stroke_color"
                        android:hint="User Name"
                        android:inputType="text"
                        android:isScrollContainer="true"
                        android:maxLines="1"
                        android:padding="5dp"
                        android:scrollHorizontally="true" />

                    <TextView
                        android:id="@+id/txtNameEditCompletion"
                        android:layout_width="wrap_content"
                        android:layout_height="match_parent"
                        android:layout_alignRight="@+id/edtUserNameEdit"
                        android:layout_alignParentRight="true"
                        android:gravity="center_vertical"
                        android:text="User Name"
                        android:textColor="@color/black"
                        android:textStyle="bold" />
                </RelativeLayout>

            </androidx.constraintlayout.widget.ConstraintLayout>

        </androidx.constraintlayout.widget.ConstraintLayout>


    </androidx.core.widget.NestedScrollView>

</androidx.coordinatorlayout.widget.CoordinatorLayout>

Problem:

When extend AppCompatEditText it overlap on TextView.

I need that AppCompatEditText be android:layout_width="wrap_content". And when user type extend AppCompatEditText to left TextView.

>Solution :

Replace your xml to this one :

I have made some changes as your requirements :

I have changed your RelativeLayout to the LinearLayout and made orientation horizontal with 1 weight of AppCompactTextView

<?xml version="1.0" encoding="utf-8"?>
<androidx.coordinatorlayout.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true">

    <com.google.android.material.appbar.AppBarLayout
        android:id="@+id/appBarCompletionInformation"
        android:layout_width="match_parent"
        android:layout_height="240dp"
        android:theme="@style/AppTheme.AppBarOverlay">

        <com.google.android.material.appbar.CollapsingToolbarLayout
            android:id="@+id/toolbarLayoutCompletionInformation"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:minHeight="60dp"
            app:contentScrim="?attr/colorPrimary"
            app:layout_scrollFlags="scroll|exitUntilCollapsed"
            app:toolbarId="@+id/toolbarCompletionInformation">

            <androidx.appcompat.widget.Toolbar
                android:id="@+id/toolbarCompletionInformation"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                android:contentInsetStart="0dp"
                android:contentInsetLeft="0dp"
                android:contentInsetEnd="0dp"
                android:contentInsetRight="0dp"
                app:contentInsetEnd="0dp"
                app:contentInsetLeft="0dp"
                app:contentInsetRight="0dp"
                app:contentInsetStart="0dp"
                app:layout_collapseMode="pin"
                app:popupTheme="@style/AppTheme.PopupOverlay"
                app:title="SSADSDWQEWQ">

                <RelativeLayout

                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:layout_gravity="center">

                    <ImageButton
                        android:id="@+id/imgBackCompletionInformation"
                        android:layout_width="50dp"
                        android:layout_height="match_parent"
                        android:layout_centerVertical="true"
                        android:background="@null"
                        android:src="@drawable/ic_baseline_arrow_back_24"
                        app:tint="@color/black" />


                </RelativeLayout>
            </androidx.appcompat.widget.Toolbar>


            <RelativeLayout
                android:id="@+id/relativeLayoutCompletionInformation"
                android:layout_width="75dp"
                android:layout_height="75dp"
                android:layout_gravity="center_horizontal"
                android:layout_marginTop="25dp"
                android:background="@drawable/border">

                <ImageView
                    android:id="@+id/imgProfileCompletionInformation"
                    android:layout_width="70dp"
                    android:layout_height="70dp"
                    android:layout_centerInParent="true"
                    android:adjustViewBounds="true"
                    android:padding="3dp"
                    android:scaleType="fitXY" />

                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_alignBottom="@+id/imgProfileCompletionInformation"
                    android:layout_alignParentRight="true"
                    android:src="@drawable/ic_baseline_photo_camera_24" />

            </RelativeLayout>

            <RelativeLayout
                android:id="@+id/relativeLayoutToFadeOutCompletionInformation"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                app:layout_collapseMode="parallax">

                <TextView
                    android:id="@+id/txtProfileNameCompletionInformation"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="User Name"
                    android:textColor="@color/black"
                    android:textSize="20sp"
                    android:textStyle="bold" />
            </RelativeLayout>

        </com.google.android.material.appbar.CollapsingToolbarLayout>

    </com.google.android.material.appbar.AppBarLayout>

    <androidx.core.widget.NestedScrollView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@color/bright_gray"
        android:fitsSystemWindows="true"
        app:layout_behavior="@string/appbar_scrolling_view_behavior"
        tools:context="...CompletionInformationActivity"
        tools:showIn="@layout/activity_completion_information">

        <androidx.constraintlayout.widget.ConstraintLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:focusable="true"
            android:focusableInTouchMode="true">

            <androidx.constraintlayout.widget.ConstraintLayout
                android:id="@+id/one"
                android:layout_width="match_parent"
                android:layout_height="70dp"
                android:background="@drawable/custom_cardview_bottom_top_shadow"
                app:layout_constraintLeft_toLeftOf="parent"
                app:layout_constraintRight_toRightOf="parent"
                app:layout_constraintTop_toTopOf="parent">
                
                <LinearLayout
                    android:orientation="horizontal"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    tools:ignore="MissingConstraints">

                    <RelativeLayout
                        android:layout_toStartOf="@+id/txtNameEditCompletion"
                        android:layout_weight="1"
                        android:layout_width="0dp"
                        android:layout_height="wrap_content">

                        <androidx.appcompat.widget.AppCompatEditText
                            android:id="@+id/edtUserNameEdit"
                            android:layout_width="wrap_content"
                            android:layout_height="48dp"
                            android:layout_alignParentStart="true"
                            
                            android:background="@drawable/text_input_layout_stroke_color"
                            android:hint="User Name"
                            android:inputType="text"
                            android:isScrollContainer="true"
                            android:maxLines="1"
                            android:padding="5dp"
                            android:scrollHorizontally="true" />

                    </RelativeLayout>

                    <TextView
                        android:layout_alignParentEnd="true"
                        android:id="@+id/txtNameEditCompletion"
                        android:layout_width="wrap_content"
                        android:layout_height="48dp"
                        android:gravity="center_vertical"
                        android:text="User Name"
                        android:textColor="@color/black"
                        android:textStyle="bold" />
                    
                </LinearLayout>

            </androidx.constraintlayout.widget.ConstraintLayout>

        </androidx.constraintlayout.widget.ConstraintLayout>


    </androidx.core.widget.NestedScrollView>

</androidx.coordinatorlayout.widget.CoordinatorLayout>