Develop Reference

Android Edittext error area's arrow not poining to the error icon

I am attaching a screenshot to show you what's going on.
As we can see there is a red arrow coming from error area and it is not poining to the error icon on EditText area. I hope you understand what I mean. How to solve that?
Here is my layout.
fragment_credentials_register.xml
<?xml version="1.0" encoding="utf-8"?>
<layout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<data>
<variable
name="viewModel"
type="pl.jawegiel.wordsbyassociations.viewmodel.ViewModelCredentialsRegister" />
</data>
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent">
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/coordinatorLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<RelativeLayout
android:id="#+id/rl_main"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent">
<LinearLayout
android:id="#+id/ll"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:orientation="horizontal"
android:weightSum="10"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<RelativeLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="5">
<com.google.android.material.textfield.TextInputLayout
android:id="#+id/input_name"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginRight="10dp"
android:layout_marginLeft="10dp"
app:layout_constraintLeft_toLeftOf="parent">
<EditText
android:id="#+id/et_username"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:autofillHints="name"
android:ems="10"
android:hint="#string/username"
android:inputType="textPersonName"
android:textColor="#FFFFFF" />
</com.google.android.material.textfield.TextInputLayout>
</RelativeLayout>
<RelativeLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_weight="5">
<com.google.android.material.textfield.TextInputLayout
android:id="#+id/input_email"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginRight="10dp"
android:layout_marginLeft="10dp">
<EditText
android:id="#+id/et_email"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:autofillHints="email"
android:ems="10"
android:hint="email"
android:inputType="textEmailAddress"
android:textColor="#FFFFFF" />
</com.google.android.material.textfield.TextInputLayout>
</RelativeLayout>
</LinearLayout>
<LinearLayout
android:id="#+id/ll2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:orientation="horizontal"
android:weightSum="10"
android:layout_below="#id/ll"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<RelativeLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginRight="3dp"
android:layout_marginEnd="3dp"
android:layout_weight="5">
<com.google.android.material.textfield.TextInputLayout
android:id="#+id/input_pass"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginStart="10dp"
android:layout_marginRight="3dp"
android:layout_marginEnd="3dp"
android:layout_marginTop="10dp"
>
<EditText
android:id="#+id/et_pass"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:autofillHints="#string/password"
android:ems="10"
android:hint="#string/password"
android:inputType="textPassword"
android:textColor="#FFFFFF" />
</com.google.android.material.textfield.TextInputLayout>
</RelativeLayout>
<RelativeLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginLeft="3dp"
android:layout_marginStart="3dp"
android:layout_weight="5">
<com.google.android.material.textfield.TextInputLayout
android:id="#+id/input_pass_con"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="3dp"
android:layout_marginStart="3dp"
android:layout_marginRight="10dp"
android:layout_marginEnd="10dp"
android:layout_marginTop="10dp">
<EditText
android:id="#+id/et_pass_confirmation"
android:layout_width="200dp"
android:layout_height="wrap_content"
android:autofillHints="pass_confirmation"
android:ems="10"
android:hint="pass_confirmation"
android:inputType="textPassword"
android:textColor="#FFFFFF" />
</com.google.android.material.textfield.TextInputLayout>
</RelativeLayout>
</LinearLayout>
</RelativeLayout>
<CheckBox
android:id="#+id/cb_terms"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="i_declare"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/rl_main" />
<TextView
android:id="#+id/tv_terms"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:gravity="center_vertical"
android:text="terms_and_conditions2"
android:textColor="#0080ff"
android:textStyle="bold"
app:layout_constraintBottom_toBottomOf="#+id/cb_terms"
app:layout_constraintStart_toEndOf="#+id/cb_terms"
app:layout_constraintTop_toBottomOf="#+id/rl_main" />
<Button
android:id="#+id/b_registration"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:enabled="false"
android:text="#string/register"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.498"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/tv_terms" />
<TextView
android:id="#+id/tv_registration_status"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:paddingLeft="30dp"
android:paddingRight="30dp"
android:text=""
android:textSize="20sp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/b_registration" />
<ProgressBar
android:id="#+id/pb"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:visibility="invisible"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/b_registration" />
</androidx.constraintlayout.widget.ConstraintLayout>
</ScrollView>
</layout>
Is there anything you need more?
Thank you in advance!

Is there a way to scroll behind the keyboard on Android?

I have a screen with view that get affected when the soft keyboard appears, the entire white portion is in a ScrollView:
When I set the windowSoftInputMode to adjustPan in the manifest, the keyboard covers the save button, which can't be pressed until the keyboard is collapsed:
If I set it to adjustResize, the the views are all raised to overlap each other:
In neither case does the screen scroll. What I would like is for all of the views to remain in their original positions, but allow the user to scroll to the bottom behind the keyboard, until the bottom of the screen below the save button is adjacent to the top of the open keyboard. Is this possible?
Edit: .xml layout:
<ScrollView
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:fillViewport="true"
>
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="0dp"
>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/white"
android:orientation="vertical">
<FrameLayout
android:id="#+id/paypalActionBar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
android:background="#color/app_yellow_bold">
<TextView
android:id="#+id/paypalToastContainer"
android:tag="paypal"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="top"
android:background="#color/onboarding_button_blue"
android:elevation="1dp"
android:gravity="center"
android:orientation="horizontal"
android:paddingTop="30dp"
android:paddingBottom="5dp"
android:visibility="gone"
android:text="#string/payout_pay_pal_saved"
android:textColor="#color/white"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
tools:visibility="gone">
</TextView>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:fontFamily="#font/radikal_bold"
android:paddingTop="50dp"
android:paddingBottom="30dp"
android:text="#string/payout_pay_pal_connect_title"
android:textColor="#color/black"
android:textSize="30sp"/>
<com.weare8.android.ui.widgets.BackButton
android:id="#+id/pp_back"
android:layout_width="wrap_content"
android:layout_marginTop="20dp"
android:layout_height="match_parent"/>
</FrameLayout>
<ScrollView android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true"
app:layout_constraintTop_toBottomOf="#+id/paypalActionBar">
<FrameLayout
android:layout_width="match_parent"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toBottomOf="#+id/paypalActionBar" android:id="#+id/frameLayout4">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingLeft="20dp"
android:paddingRight="20dp">
<androidx.appcompat.widget.AppCompatImageView
android:id="#+id/paypal_logo"
android:layout_width="252dp"
android:layout_height="67dp"
android:layout_alignParentStart="true"
android:layout_alignParentTop="true"
android:layout_marginTop="50dp"
android:src="#drawable/paypal_logo"/>
<TextView
android:id="#+id/paypalDescription"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/paypal_logo"
android:layout_marginTop="20dp"
android:layout_marginEnd="20dp"
android:fontFamily="#font/radikal"
android:lineSpacingMultiplier="1.2"
android:text="#string/payout_pay_pal_description"
android:textColor="#color/app_dark_gray"
android:textSize="16sp"/>
<TextView
android:id="#+id/paypalWarning"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/paypalDescription"
android:layout_marginTop="5dp"
android:layout_marginEnd="20dp"
android:fontFamily="#font/radikal"
android:lineSpacingMultiplier="1.2"
android:textStyle="italic"
android:text="#string/payout_pay_pal_payout_warning"
android:textColor="#color/app_light_gray"
android:textSize="14sp"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:orientation="vertical"
>
<EditText
android:id="#+id/text_email"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/bg_edit_text"
android:hint="#string/payout_pay_pal_email_hint"
android:elevation="2dp"
android:imeOptions="actionDone"
android:inputType="textEmailAddress"
android:fontFamily="#font/radikal"
android:maxLines="1"
android:layout_marginBottom="15dp"
android:paddingTop="20dp"
android:paddingBottom="20dp"
android:paddingStart="20dp"
android:textColor="#color/black"
android:textSize="16sp"
android:textColorHint="#8A8A8A"/>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
android:id="#+id/text_dont_have_account"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="5dp"
android:layout_marginEnd="3dp"
android:fontFamily="#font/radikal"
android:text="#string/payout_pay_pal_question"
android:textColor="#color/app_dark_gray"
android:textSize="14sp"/>
<TextView
android:id="#+id/text_create_account"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fontFamily="#font/radikal"
android:textStyle="bold"
android:textColor="#color/button_blue"
android:textSize="14sp"/>
</LinearLayout>
</LinearLayout>
</RelativeLayout>
<TextView
android:id="#+id/saveButton"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:background="#drawable/bg_button_blue_rounded"
android:layout_margin="25dp"
android:fontFamily="#font/radikal_bold"
android:gravity="center"
android:padding="20dp"
android:text="#string/payout_pay_pal_save"
android:textSize="16sp"
android:textColor="#color/white"/>
</FrameLayout>
</ScrollView>
</LinearLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
</ScrollView>

If you want to scroll and save button also show in scrolling when soft keypad open, then you should have to move scroll view from white area to top of the view.
I have made a demo for you. try this one. I hope It might be helpful.
<!--If you your scroll view top of the layout it will resolve your problem-->
<ScrollView
android:id="#+id/scroll_view"
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="0dp"
>
<!--Toolbar demo-->
<LinearLayout
android:id="#+id/ll_toolbar"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="200dp"
android:background="#color/teal_200"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent"
/>
<!-- <ScrollView-->
<!-- android:id="#+id/scroll_view"-->
<!-- android:layout_width="match_parent"-->
<!-- android:layout_height="0dp"-->
<!-- app:layout_constraintStart_toStartOf="parent"-->
<!-- app:layout_constraintEnd_toEndOf="parent"-->
<!-- app:layout_constraintTop_toBottomOf="#+id/ll_toolbar"-->
<!-- >-->
<!--Your white area of scroll which you want to scroll-->
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/white_portain"
android:layout_width="match_parent"
android:layout_height="0dp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toBottomOf="#+id/ll_toolbar"
>
<TextView
android:id="#+id/tv_paypal_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="PayPal"
android:layout_marginStart="20dp"
android:layout_marginTop="30dp"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintStart_toStartOf="parent"
android:textColor="#color/black"
android:textSize="35dp"
/>
<TextView
android:id="#+id/tv_sub_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Connect your PayPal account to receive \n payments!"
android:layout_marginStart="20dp"
android:layout_marginTop="10dp"
app:layout_constraintStart_toStartOf="parent"
android:textColor="#color/black"
android:textSize="18dp"
app:layout_constraintTop_toBottomOf="#+id/tv_paypal_title"
/>
<TextView
android:id="#+id/tv_sub_2_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Please note:You must have a minimum balance of \n$1.00 to make a payout via PayPal."
android:layout_marginStart="20dp"
android:layout_marginTop="10dp"
app:layout_constraintStart_toStartOf="parent"
android:textColor="#color/gray_600"
android:textSize="15dp"
app:layout_constraintTop_toBottomOf="#+id/tv_sub_title"
/>
<EditText
android:id="#+id/edit_email"
android:layout_width="0dp"
android:layout_marginTop="10dp"
android:hint="Enter your email"
android:paddingStart="10dp"
android:textColorHint="#color/gray_600"
android:layout_height="wrap_content"
android:layout_marginEnd="20dp"
app:layout_constraintTop_toBottomOf="#+id/tv_sub_2_title"
app:layout_constraintStart_toStartOf="#+id/tv_sub_title"
app:layout_constraintEnd_toEndOf="parent"
/>
<TextView
android:id="#+id/tv_create_one"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Dont have a PayPal account?"
android:layout_marginStart="20dp"
android:layout_marginTop="10dp"
app:layout_constraintStart_toStartOf="#+id/edit_email"
android:textColor="#color/gray_600"
android:textSize="15dp"
app:layout_constraintTop_toBottomOf="#+id/edit_email"
/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Save"
android:layout_marginTop="160dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/tv_create_one" />
</androidx.constraintlayout.widget.ConstraintLayout>
<!--</ScrollView>-->
</androidx.constraintlayout.widget.ConstraintLayout>
</ScrollView>
I follow your layout and try to fix it. now it's working as you want. if you get any trouble with this layout then i will happy to help you futher
<?xml version="1.0" encoding="utf-8"?>
<ScrollView
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"
>
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="0dp"
>
<LinearLayout
android:id="#+id/ll_toolbar"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/white"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent"
android:orientation="vertical">
<FrameLayout
android:id="#+id/paypalActionBar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
android:background="#color/teal_200">
<TextView
android:id="#+id/paypalToastContainer"
android:tag="paypal"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="top"
android:background="#color/black"
android:elevation="1dp"
android:gravity="center"
android:orientation="horizontal"
android:paddingTop="30dp"
android:paddingBottom="5dp"
android:visibility="gone"
android:text="#string/payout_pay_pal_saved"
android:textColor="#color/white"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
tools:visibility="gone">
</TextView>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:paddingTop="50dp"
android:paddingBottom="30dp"
android:text="#string/payout_pay_pal_connect_title"
android:textColor="#color/black"
android:textSize="30sp"/>
<ImageView
android:id="#+id/pp_back"
android:background="#drawable/ic_launcher_background"
android:layout_width="wrap_content"
android:layout_marginTop="20dp"
android:layout_height="match_parent"/>
</FrameLayout>
</LinearLayout>
<!-- <ScrollView android:layout_width="match_parent"-->
<!-- android:layout_height="match_parent"-->
<!-- android:fillViewport="true"-->
<!-- app:layout_constraintTop_toBottomOf="#+id/paypalActionBar">-->
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="0dp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toBottomOf="#+id/ll_toolbar"
android:id="#+id/frameLayout4">
<!-- <RelativeLayout-->
<!-- android:layout_width="match_parent"-->
<!-- android:layout_height="match_parent"-->
<!-- android:paddingLeft="20dp"-->
<!-- android:paddingRight="20dp">-->
<androidx.appcompat.widget.AppCompatImageView
android:id="#+id/paypal_logo"
android:layout_width="252dp"
android:layout_height="67dp"
android:layout_marginStart="20dp"
android:layout_marginTop="30dp"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintStart_toStartOf="parent"
android:background="#color/gray_600"/>
<TextView
android:id="#+id/paypalDescription"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/paypal_logo"
android:layout_marginTop="20dp"
android:layout_marginEnd="20dp"
app:layout_constraintTop_toBottomOf="#+id/paypal_logo"
app:layout_constraintStart_toStartOf="#+id/paypal_logo"
android:lineSpacingMultiplier="1.2"
android:text="#string/payout_pay_pal_description"
android:textColor="#color/gray_600"
android:textSize="16sp"/>
<TextView
android:id="#+id/paypalWarning"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/paypalDescription"
app:layout_constraintTop_toBottomOf="#+id/paypalDescription"
app:layout_constraintStart_toStartOf="#+id/paypalDescription"
android:layout_marginTop="5dp"
android:layout_marginEnd="20dp"
android:lineSpacingMultiplier="1.2"
android:textStyle="italic"
android:text="#string/payout_pay_pal_payout_warning"
android:textColor="#color/gray_600"
android:textSize="14sp"/>
<LinearLayout
android:id="#+id/ll_edittext"
app:layout_constraintTop_toBottomOf="#+id/paypalWarning"
app:layout_constraintStart_toStartOf="#+id/paypalDescription"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_centerInParent="true"
android:orientation="vertical"
>
<EditText
android:id="#+id/text_email"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="#string/payout_pay_pal_email_hint"
android:elevation="2dp"
android:imeOptions="actionDone"
android:inputType="textEmailAddress"
android:maxLines="1"
android:layout_marginBottom="15dp"
android:paddingTop="20dp"
android:paddingBottom="20dp"
android:paddingStart="20dp"
android:textColor="#color/black"
android:textSize="16sp"
android:textColorHint="#8A8A8A"/>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
android:id="#+id/text_dont_have_account"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="5dp"
android:layout_marginEnd="3dp"
android:text="#string/payout_pay_pal_question"
android:textColor="#color/black"
android:textSize="14sp"/>
<TextView
android:id="#+id/text_create_account"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textStyle="bold"
android:text="asd"
android:textColor="#color/purple_700"
android:textSize="14sp"/>
</LinearLayout>
</LinearLayout>
<!-- </RelativeLayout>-->
<View
android:id="#+id/spacing"
android:layout_width="match_parent"
android:layout_height="100dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toBottomOf="#+id/ll_edittext"
/>
<TextView
android:id="#+id/saveButton"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:layout_margin="25dp"
android:background="#color/teal_200"
android:gravity="center"
android:padding="20dp"
android:text="#string/payout_pay_pal_save"
android:textColor="#color/white"
android:textSize="16sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toBottomOf="#+id/spacing"
/>
</androidx.constraintlayout.widget.ConstraintLayout>
<!-- </ScrollView>-->
</androidx.constraintlayout.widget.ConstraintLayout>
</ScrollView>

Try this...its working fine for me. Please change color names in this layout xml and their hex code in your values>.color .xml and also the string values to get desired results.
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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:orientation="vertical"
tools:context=".MainActivity">
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:overScrollMode="never"
tools:ignore="UnknownIdInLayout">
<LinearLayout
android:id="#+id/idLinear"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_gravity="center_horizontal"
android:gravity="center"
android:padding="5dp"
app:layout_constraintTop_toBottomOf="#+id/idTopic"
tools:ignore="MissingConstraints">
<TextView
android:layout_width="wrap_content"
android:layout_height="150dp"
android:layout_gravity="center"
android:gravity="center|top"
android:text="Your Text/nYourImage"
android:padding="10dp"
android:background="#00ffff"
android:textColor="#66ff33"
android:textSize="45sp"
/>
<EditText
android:id="#+id/idUser"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:digits="abcdefghijklmnopqrstuvwxyz.#1234567890_"
android:inputType="textEmailAddress"
android:imeOptions="actionDone"
android:maxLength="40"
android:hint="email"
android:padding="10dp"
android:gravity="center"
android:layout_marginTop="15dp"
android:textSize="15sp"
android:background="#cccccc"
/>
<EditText
android:id="#+id/idPass"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:inputType="textPassword"
android:imeOptions="actionDone"
android:hint="password"
android:padding="10dp"
android:gravity="center"
android:layout_marginTop="15dp"
android:textSize="15sp"
android:autofillHints=""
android:background="#cccccc"/>
<Button
android:id="#+id/idLogin"
android:layout_width="wrap_content"
android:minWidth="100dp"
android:layout_height="40dp"
android:text="login"
android:textStyle="bold"
android:textAllCaps="true"
android:gravity="center"
android:textSize="15sp"
android:layout_marginTop="10dp"
android:paddingStart="10dp"
android:paddingEnd="10dp"
android:background="#ffff00"
android:textColor="#ffffff"
/>
<Button
android:id="#+id/idReset"
android:layout_width="200dp"
android:layout_height="wrap_content"
android:text="forgot"
android:textAllCaps="true"
android:gravity="center"
android:textSize="15sp"
android:layout_marginTop="30dp"
android:paddingStart="10dp"
android:paddingEnd="10dp"
android:background="#ffff00"
android:textColor="#ffffff"
/>
<Button
android:id="#+id/idSignup"
android:layout_width="200dp"
android:layout_height="wrap_content"
android:text="sign up"
android:textAllCaps="true"
android:gravity="center"
android:textSize="15sp"
android:layout_marginTop="30dp"
android:paddingStart="10dp"
android:paddingEnd="10dp"
android:background="#ffff00"
android:textColor="#ffffff"
/>
</LinearLayout>
</ScrollView>
</androidx.constraintlayout.widget.ConstraintLayout>

How to show image in the place of creating message in androidX..?

I am creating an offlline SMS app.In that I have to place the option of selecting an image button and after selecting image I want to place it at the position of sending image.But do not understand how to adjust the imageView button to get desired layout.Someone can help me..?
I have searched a lot but found nothing.
XML FILE
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent" xmlns:app="http://schemas.android.com/apk/res-auto">
<LinearLayout
android:layout_width="match_parent"
android:padding="5dp"
android:layout_height="wrap_content"
android:gravity="left"
android:orientation="horizontal" tools:ignore="MissingConstraints" android:id="#+id/linearLayout">
<ImageView
android:id="#+id/inbox_thumb"
android:layout_width="60dp"
android:layout_height="60dp"
android:src="#drawable/circle"/>
<TextView
android:hint="Phone Number"
android:layout_width="5dp"
android:layout_marginTop="6dp"
android:padding="10dp"
android:textStyle="bold"
android:textSize="15dp"
android:gravity="left"
android:layout_height="wrap_content" android:id="#+id/phone" android:layout_weight="1"/>
</LinearLayout>
<androidx.recyclerview.widget.RecyclerView android:layout_width="384dp"
android:layout_height="661dp"
android:scrollbarAlwaysDrawVerticalTrack="true"
android:id="#+id/reyclerview_message_list"
android:layout_marginLeft="16dp"
android:layout_marginStart="16dp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#+id/linearLayout">
</androidx.recyclerview.widget.RecyclerView>
<View android:layout_width="0dp"
android:layout_height="2dp"
tools:ignore="MissingConstraints"
android:background="#color/colorPrimaryDark"
android:layout_marginBottom="0dp"
app:layout_constraintBottom_toTopOf="#+id/message_area"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent">
</View>
<LinearLayout android:layout_width="0dp" android:layout_height="wrap_content"
android:id="#+id/message_area"
android:orientation="horizontal"
android:minHeight="48dp"
android:background="#ffffff"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
tools:ignore="MissingConstraints">
<Button
android:text="attach img"
android:layout_width="wrap_content"
android:layout_height="wrap_content" android:id="#+id/btn1"
/>
<EditText
android:id="#+id/txtMessage"
android:hint="Enter message"
android:background="#android:color/transparent"
android:layout_gravity="center"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:maxLines="6"/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content" app:srcCompat="#mipmap/ic_launcher" android:id="#+id/imageView2"
android:layout_weight="1"/>
<Button
android:id="#+id/btnSend"
android:text="SEND"
android:textSize="14dp"
android:clickable="true"
android:layout_width="64dp"
android:layout_height="48dp"
android:gravity="center"
android:layout_gravity="bottom" />
</LinearLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
Expected
Actual

I have created a basic template using your Layout in AndroidX. You can beautify it using your style, icons and colors accordingly. Please copy it and look at it in your Android Studio.
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:id="#+id/linearLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="left"
android:orientation="horizontal"
android:padding="5dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent">
<androidx.appcompat.widget.AppCompatImageView
android:id="#+id/inbox_thumb"
android:layout_width="60dp"
android:layout_height="60dp"
android:src="#drawable/ic_launcher" />
<androidx.appcompat.widget.AppCompatTextView
android:id="#+id/phone"
android:layout_width="5dp"
android:layout_height="wrap_content"
android:layout_marginTop="6dp"
android:layout_weight="1"
android:gravity="left"
android:hint="Phone Number"
android:padding="10dp"
android:textSize="15dp"
android:textStyle="bold" />
</LinearLayout>
<LinearLayout
android:id="#+id/message_area"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="10dp"
android:background="#drawable/rounded_rect_shape"
android:orientation="horizontal"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent">
<androidx.appcompat.widget.AppCompatImageButton
android:id="#+id/btn1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:src="#drawable/ic_launcher" />
<androidx.cardview.widget.CardView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
app:cardBackgroundColor="#android:color/darker_gray"
app:cardCornerRadius="6dp"
app:cardElevation="2dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<androidx.appcompat.widget.AppCompatImageView
android:id="#+id/imageView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:srcCompat="#mipmap/ic_launcher" />
<androidx.appcompat.widget.AppCompatEditText
android:id="#+id/txtMessage"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:background="#android:color/transparent"
android:hint="Enter message"
android:maxLines="6" />
</LinearLayout>
</androidx.cardview.widget.CardView>
<androidx.appcompat.widget.AppCompatButton
android:id="#+id/btnSend"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:gravity="center"
android:text="SEND"
android:textSize="14dp" />
</LinearLayout>
<View
android:layout_width="0dp"
android:layout_height="2dp"
android:layout_marginBottom="0dp"
android:background="#color/colorPrimaryDark"
app:layout_constraintBottom_toTopOf="#+id/message_area"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"/>
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/reyclerview_message_list"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_marginStart="16dp"
android:scrollbarAlwaysDrawVerticalTrack="true"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintBottom_toTopOf="#id/message_area"
app:layout_constraintTop_toBottomOf="#+id/linearLayout"/>

If I understand correctly, you're trying to place the "imageView2" ImageView on top of the "txtMessage" EditText, is that right?
If that's how it is, what you need to do is wrap both of them in a vertical LinearLayout, like so:
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<EditText
android:id="#+id/txtMessage"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:layout_weight="1"
android:background="#android:color/transparent"
android:hint="Enter message"
android:maxLines="6" />
<ImageView
android:id="#+id/imageView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
app:srcCompat="#mipmap/ic_launcher" />
</LinearLayout>

<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="bottom"
android:orientation="horizontal"
android:padding="8dp">
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/circle_drawable"
android:backgroundTint="#android:color/black"
android:padding="8dp"
android:layout_margin="8dp"
android:src="#drawable/ic_add_black_24dp"
android:tint="#android:color/white" />
<android.support.v7.widget.CardView
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:cardBackgroundColor="#android:color/darker_gray"
app:cardCornerRadius="6dp"
app:cardElevation="2dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="8dp"
android:src="#mipmap/ic_launcher" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:gravity="bottom"
android:weightSum="1">
<EditText
android:id="#+id/et1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_toStartOf="#+id/ib2"
android:layout_margin="8dp"
android:text="Hello" />
<ImageButton
android:id="#+id/ib2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/circle_drawable"
android:backgroundTint="#android:color/black"
android:padding="8dp"
android:layout_margin="8dp"
android:layout_alignParentEnd="true"
android:src="#drawable/ic_send_black_24dp"
android:tint="#android:color/white" />
</RelativeLayout>
</LinearLayout>
</android.support.v7.widget.CardView>
</LinearLayout>
I have used background drawable, you can replace with your add and send image.
Hope it solves your problem.

Issue with constraint layout

I'm having a considerable issue that I haven't encountered before. I did what I normally do working with constraints. Not all of my fields will fit on the screen. It shows up fine running on an external tablet. Below is my activitymain. I've also ran it in linear and relative layout. I can Any help would be appreciated.
<android.support.constraint.ConstraintLayout 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:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/colorBlack"
tools:context=".MainActivity">
<Spinner
android:id="#+id/spCompany"
android:layout_width="match_parent"
android:layout_height="40dp"
android:layout_marginBottom="468dp"
android:background="#color/colorWhite"
android:gravity="center"
android:spinnerMode="dropdown"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/rnumberText" />
<TextView
android:id="#+id/densityText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="7dp"
android:background="#color/colorWhite"
android:text=""
android:visibility="gone"
app:layout_constraintBottom_toTopOf="#id/strainerLabel"
app:layout_constraintTop_toBottomOf="#+id/spCompany" />
<TextView
android:id="#+id/strainerLabel"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:background="#color/colorWhite"
android:gravity="center"
android:text="#string/strainer"
android:textStyle="bold"
app:layout_constraintBottom_toTopOf="#+id/strainerText"
app:layout_constraintTop_toBottomOf="#+id/spCompany" />
<TextView
android:id="#+id/strainerText"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="7dp"
android:background="#color/colorWhite"
android:gravity="center"
android:text=""
android:textSize="30sp"
android:textStyle="bold"
app:layout_constraintBottom_toTopOf="#+id/spRatio"
app:layout_constraintTop_toBottomOf="#+id/strainerLabel" />
<Spinner
android:id="#+id/spRatio"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/colorWhite"
android:spinnerMode="dropdown"
app:layout_constraintBottom_toTopOf="#+id/enterweightLabel"
app:layout_constraintTop_toBottomOf="#+id/strainerText" />
<TextView
android:id="#+id/rnumberText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="7dp"
android:background="#color/colorWhite"
android:text=""
android:visibility="gone"
app:layout_constraintBottom_toTopOf="#+id/spCompany"
app:layout_constraintEnd_toStartOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_chainStyle="spread_inside" />
<TextView
android:id="#+id/catdensityText"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/colorWhite"
android:text=""
app:layout_constraintBottom_toBottomOf="#+id/spRatio"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/spRatio" />
<TextView
android:id="#+id/enterweightLabel"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:background="#color/colorWhite"
android:gravity="center"
android:text="#string/enter_weight"
android:textAlignment="center"
android:textStyle="bold"
android:visibility="visible"
app:layout_constraintBottom_toTopOf="#+id/weightInput"
app:layout_constraintTop_toBottomOf="#+id/spRatio" />
<EditText
android:id="#+id/weightInput"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="7dp"
android:autofillHints="Enter Weight"
android:background="#color/colorWhite"
android:clickable="true"
android:ems="10"
android:focusable="true"
android:gravity="center"
android:imeOptions="actionDone"
android:importantForAutofill="yes"
android:inputType="numberDecimal"
android:singleLine="true"
android:textStyle="bold"
app:layout_constraintBottom_toTopOf="#+id/totalcatLabel"
app:layout_constraintTop_toBottomOf="#+id/enterweightLabel"
tools:targetApi="o" />
<TextView
android:id="#+id/totalcatLabel"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:background="#color/colorWhite"
android:gravity="center"
android:text="#string/total_catalyst"
android:textStyle="bold"
app:layout_constraintBottom_toTopOf="#+id/totalcatText"
app:layout_constraintTop_toBottomOf="#+id/weightInput" />
<TextView
android:id="#+id/totalcatText"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="7dp"
android:background="#color/colorWhite"
android:clickable="false"
android:gravity="center"
android:text=""
android:textStyle="bold"
app:layout_constraintBottom_toTopOf="#+id/totalweightLabel"
app:layout_constraintTop_toBottomOf="#+id/totalcatLabel" />
<TextView
android:id="#+id/totalweightLabel"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:background="#color/colorWhite"
android:gravity="center"
android:text="#string/total_weight"
android:textSize="30sp"
android:textStyle="bold"
app:layout_constraintBottom_toTopOf="#+id/totalweightText"
app:layout_constraintTop_toBottomOf="#+id/totalcatText" />
<TextView
android:id="#+id/totalweightText"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:background="#color/colorWhite"
android:gravity="center_horizontal|center_vertical"
android:text=""
android:textSize="60sp"
android:textStyle="bold"
app:layout_constraintBottom_toTopOf="#+id/calcButton"
app:layout_constraintTop_toBottomOf="#+id/totalweightLabel" />
<Button
android:id="#+id/calcButton"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:background="#color/colorWhite"
android:clickable="true"
android:focusable="true"
android:text="#string/calculate"
android:visibility="visible"
app:layout_constraintBottom_toTopOf="#+id/clearButton"
app:layout_constraintTop_toBottomOf="#+id/totalweightText" />
<Button
android:id="#+id/clearButton"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/colorWhite"
android:clickable="true"
android:focusable="true"
android:text="#string/Clear"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toBottomOf="#+id/calcButton" />
</android.support.constraint.ConstraintLayout>

You can put your ConstraintLayout inside a ScrollView

Yeah, your content takes more room than the available then your view overflows the device. Using a ScrollView will solve you problem with short screens.
This is how looks like:
<?xml version="1.0" encoding="utf-8"?>
<ScrollView 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="wrap_content"
android:id="#+id/root">
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/colorBlack"
tools:context=".MainActivity">
<Spinner
android:id="#+id/spCompany"
android:layout_width="match_parent"
android:layout_height="40dp"
android:layout_marginBottom="468dp"
android:background="#color/colorWhite"
android:gravity="center"
android:spinnerMode="dropdown"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/rnumberText" />
<TextView
android:id="#+id/densityText"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_marginBottom="7dp"
android:background="#color/colorWhite"
android:text=""
android:visibility="gone"
app:layout_constraintBottom_toTopOf="#id/strainerLabel"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/spCompany" />
<TextView
android:id="#+id/strainerLabel"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:background="#color/colorWhite"
android:gravity="center"
android:text="#string/strainer"
android:textStyle="bold"
app:layout_constraintBottom_toTopOf="#+id/strainerText"
app:layout_constraintTop_toBottomOf="#+id/spCompany" />
<TextView
android:id="#+id/strainerText"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="7dp"
android:background="#color/colorWhite"
android:gravity="center"
android:text=""
android:textSize="30sp"
android:textStyle="bold"
app:layout_constraintBottom_toTopOf="#+id/spRatio"
app:layout_constraintTop_toBottomOf="#+id/strainerLabel" />
<Spinner
android:id="#+id/spRatio"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/colorWhite"
android:spinnerMode="dropdown"
app:layout_constraintBottom_toTopOf="#+id/enterweightLabel"
app:layout_constraintTop_toBottomOf="#+id/strainerText" />
<TextView
android:id="#+id/rnumberText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="7dp"
android:background="#color/colorWhite"
android:text=""
android:visibility="gone"
app:layout_constraintBottom_toTopOf="#+id/spCompany"
app:layout_constraintEnd_toStartOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_chainStyle="spread_inside" />
<TextView
android:id="#+id/catdensityText"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/colorWhite"
android:text=""
app:layout_constraintBottom_toBottomOf="#+id/spRatio"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/spRatio" />
<TextView
android:id="#+id/enterweightLabel"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:background="#color/colorWhite"
android:gravity="center"
android:text="#string/enter_weight"
android:textAlignment="center"
android:textStyle="bold"
android:visibility="visible"
app:layout_constraintBottom_toTopOf="#+id/weightInput"
app:layout_constraintTop_toBottomOf="#+id/spRatio" />
<EditText
android:id="#+id/weightInput"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="7dp"
android:autofillHints="Enter Weight"
android:background="#color/colorWhite"
android:clickable="true"
android:ems="10"
android:focusable="true"
android:gravity="center"
android:imeOptions="actionDone"
android:importantForAutofill="yes"
android:inputType="numberDecimal"
android:singleLine="true"
android:textStyle="bold"
app:layout_constraintBottom_toTopOf="#+id/totalcatLabel"
app:layout_constraintTop_toBottomOf="#+id/enterweightLabel"
tools:targetApi="o" />
<TextView
android:id="#+id/totalcatLabel"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:background="#color/colorWhite"
android:gravity="center"
android:text="#string/total_catalyst"
android:textStyle="bold"
app:layout_constraintBottom_toTopOf="#+id/totalcatText"
app:layout_constraintTop_toBottomOf="#+id/weightInput" />
<TextView
android:id="#+id/totalcatText"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="7dp"
android:background="#color/colorWhite"
android:clickable="false"
android:gravity="center"
android:text=""
android:textStyle="bold"
app:layout_constraintBottom_toTopOf="#+id/totalweightLabel"
app:layout_constraintTop_toBottomOf="#+id/totalcatLabel" />
<TextView
android:id="#+id/totalweightLabel"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:background="#color/colorWhite"
android:gravity="center"
android:text="#string/total_weight"
android:textSize="30sp"
android:textStyle="bold"
app:layout_constraintBottom_toTopOf="#+id/totalweightText"
app:layout_constraintTop_toBottomOf="#+id/totalcatText" />
<TextView
android:id="#+id/totalweightText"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:background="#color/colorWhite"
android:gravity="center_horizontal|center_vertical"
android:text=""
android:textSize="60sp"
android:textStyle="bold"
app:layout_constraintBottom_toTopOf="#+id/calcButton"
app:layout_constraintTop_toBottomOf="#+id/totalweightLabel" />
<Button
android:id="#+id/calcButton"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:background="#color/colorWhite"
android:clickable="true"
android:focusable="true"
android:text="#string/calculate"
android:visibility="visible"
app:layout_constraintBottom_toTopOf="#+id/clearButton"
app:layout_constraintTop_toBottomOf="#+id/totalweightText" />
<Button
android:id="#+id/clearButton"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/colorWhite"
android:clickable="true"
android:focusable="true"
android:text="#string/Clear"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toBottomOf="#+id/calcButton" />
</androidx.constraintlayout.widget.ConstraintLayout>
</ScrollView>

How to align horizontal line in layout exactly to image

So I have this activity What I want to do is to align the separator line and background image. What i do so far is just margin the whole layout with specific height but that is definitely not a solution since on new device they aren't aligned anymore. The whole problem is that the separator line is in layout. To avoid misunderstandings here is the line and image i want to align here. And here is the code
<FrameLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:scaleType="fitStart"
android:src="#drawable/main_background" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<LinearLayout
android:layout_marginTop="110dp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginEnd="8dp"
android:layout_marginLeft="8dp"
android:layout_marginRight="8dp"
android:layout_marginStart="8dp"
android:background="#drawable/mainborder"
android:orientation="vertical"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<TextView
android:id="#+id/user_name"
style="#style/HeaderText"
android:layout_width="match_parent"
android:layout_height="50dp"
android:paddingLeft="15dp"
android:paddingTop="15dp"
android:text="#string/welcome" />
<include layout="#layout/separator_line_smaller_margin" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="15dp"
android:layout_marginRight="15dp">
<include layout="#layout/slider" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="100dp"
android:layout_gravity="bottom"
android:orientation="horizontal"
android:paddingBottom="10dp"
android:paddingLeft="15dp">
<LinearLayout
android:layout_width="203dp"
android:layout_height="match_parent"
android:orientation="vertical">
<TextView
style="#style/Text"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingLeft="4dp"
android:text="#string/profileInfo" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dip"
android:layout_weight="1"
android:gravity="bottom">
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#android:color/transparent"
android:fontFamily="sans-serif-medium"
android:gravity="start"
android:lineSpacingExtra="6sp"
android:onClick="goToProfile"
android:text="#string/myProfile"
android:textAlignment="textStart"
android:textColor="#4ED1AD"
android:textSize="14sp"
android:textStyle="normal" />
</LinearLayout>
</LinearLayout>
<de.hdodenhof.circleimageview.CircleImageView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
android:src="#drawable/face" />
</LinearLayout>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:layout_marginEnd="8dp"
android:layout_marginLeft="8dp"
android:layout_marginRight="8dp"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:background="#drawable/mainborder"
android:orientation="vertical"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.105">
<TextView
style="#style/HeaderText"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingLeft="15dp"
android:paddingTop="15dp"
android:text="#string/comingViews"
android:textSize="25sp" />
<include layout="#layout/separator_line_smaller_margin" />
<LinearLayout
style="#style/DoctorsLayouts"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="10dp">
<de.hdodenhof.circleimageview.CircleImageView
android:layout_width="49dp"
android:layout_height="match_parent"
android:src="#drawable/face" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="horizontal">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#mipmap/ic_data_range" />
<TextView
style="#style/Text"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center|left"
android:paddingLeft="5dp"
android:text="22.01.2018г. 9:00 часа"
tools:layout_editor_absoluteX="65dp"
tools:layout_editor_absoluteY="261dp" />
</LinearLayout>
<TextView
style="#style/Doctors"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:paddingLeft="3dp"
android:text="Др. Хаус"
android:textSize="15sp" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
<LinearLayout
style="#style/LayoutPadding"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:layout_marginEnd="8dp"
android:layout_marginLeft="8dp"
android:layout_marginRight="8dp"
android:layout_marginStart="8dp"
android:orientation="vertical">
<TextView
style="#style/SecondHeaderText"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="15dp"
android:text="#string/HowDoesItWork" />
<TextView
style="#style/Text"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/dummyText" />
</LinearLayout>
<LinearLayout
style="#style/LayoutPadding"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#android:color/transparent"
android:text="#string/Help"
android:textColor="#4ED1AD"
android:textSize="17sp" />
</LinearLayout>
</LinearLayout>
</FrameLayout>