adding Edittext and Button when clicking a button in kotlin - android

my app needs an add button that adds two Edittext and another button every time they click the add button
adds again the same three things under the added ones, I attached a screenshot of how my app suppose to work, I really need help in this I am new in android development.
here is my activity layout
<?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"
tools:context=".Mark_calc">
<include
android:id="#+id/Mark_calcTB"
layout="#layout/toolbar"/>
<com.google.android.material.floatingactionbutton.FloatingActionButton
android:id="#+id/add_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="12dp"
android:layout_marginBottom="12dp"
android:clickable="true"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:srcCompat="#drawable/ic_add" />
<TextView
android:id="#+id/Box_1"
android:layout_width="0dp"
android:layout_height="207dp"
android:layout_marginStart="10dp"
android:layout_marginTop="12dp"
android:layout_marginEnd="10dp"
android:background="#drawable/rounded_button"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/Mark_calcTB" />
<TextView
android:id="#+id/Total_MarksTV"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="40dp"
android:layout_marginTop="40dp"
android:text="Total marks:"
android:textColor="#android:color/white"
android:textSize="24sp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="#+id/Box_1" />
<TextView
android:id="#+id/result_total_marksTV"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="52dp"
android:layout_marginEnd="85dp"
android:text="0"
android:textColor="#android:color/white"
android:textSize="24sp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toBottomOf="#+id/Mark_calcTB" />
<TextView
android:id="#+id/total_hours"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="44dp"
android:layout_marginBottom="40dp"
android:text="Total hours:"
android:textColor="#android:color/white"
android:textSize="24sp"
app:layout_constraintBottom_toBottomOf="#+id/Box_1"
app:layout_constraintStart_toStartOf="parent" />
<TextView
android:id="#+id/result_total_hours"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="84dp"
android:layout_marginBottom="40dp"
android:text="0"
android:textColor="#android:color/white"
android:textSize="24sp"
app:layout_constraintBottom_toBottomOf="#+id/Box_1"
app:layout_constraintEnd_toEndOf="parent" />
<EditText
android:id="#+id/mark1"
android:layout_width="144dp"
android:layout_height="wrap_content"
android:layout_marginStart="12dp"
android:layout_marginTop="28dp"
android:ems="10"
android:hint="Mark%"
android:inputType="numberSigned"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/Box_1" />
<EditText
android:id="#+id/hours1"
android:layout_width="144dp"
android:layout_height="wrap_content"
android:layout_marginStart="24dp"
android:layout_marginTop="28dp"
android:ems="10"
android:hint="Hours"
android:inputType="numberSigned"
app:layout_constraintStart_toEndOf="#+id/mark1"
app:layout_constraintTop_toBottomOf="#+id/Box_1" />
<Button
android:id="#+id/delete_button"
android:layout_width="35dp"
android:layout_height="38dp"
android:layout_marginStart="24dp"
android:layout_marginTop="32dp"
android:background="#drawable/ic_delete"
app:layout_constraintStart_toEndOf="#+id/hours1"
app:layout_constraintTop_toBottomOf="#+id/Box_1" />
</androidx.constraintlayout.widget.ConstraintLayout>
and here is a screenshot of how it should work.

Take Recyclerview and when you click on add Button add the data to your ArrayList and update the adapter to NotifyDataSetChanges.

Related

My fragment design is not visible on the navigation screen, how can I solve it?

I'm currently developing an android application, but I'm having trouble with navigation fragments. As in the photo, the design of my fragments cannot be displayed. When I add this navigation to my activity, I get an error. What do you think is the problem?
here are the fragment in xml codes
<?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"
xmlns:tools="http://schemas.android.com/tools">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".loginRegister.Activity.LoginFragment">
<ImageView
android:id="#+id/imageViewLoginFragmentAppIcon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="73dp"
android:background="#color/amber"
android:src="#drawable/ic_launcher_foreground"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<EditText
android:id="#+id/editTextLoginFragmentEMail"
android:layout_width="270dp"
android:layout_height="50dp"
android:layout_marginTop="69dp"
android:background="#drawable/edittext_custom"
android:drawableStart="#drawable/ic_mail"
android:drawablePadding="10dp"
android:ems="10"
android:hint="E-Posta"
android:inputType="textPersonName"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/imageViewLoginFragmentAppIcon" />
<EditText
android:id="#+id/editTextLoginFragmentPassword"
android:layout_width="270dp"
android:layout_height="50dp"
android:layout_marginTop="30dp"
android:background="#drawable/edittext_custom"
android:drawableStart="#drawable/ic_password"
android:drawablePadding="10dp"
android:ems="10"
android:hint="Şifre"
android:inputType="textPersonName"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/editTextLoginFragmentEMail" />
<Button
android:id="#+id/buttonLoginFragmentLogin"
android:layout_width="150dp"
android:layout_height="45dp"
android:layout_marginTop="41dp"
android:layout_marginEnd="35dp"
android:textStyle="italic"
android:background="#drawable/button_custom"
android:text="Giriş Yap"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toBottomOf="#+id/editTextLoginFragmentPassword" />
<TextView
android:id="#+id/textViewLoginFragmnetForgetPassword"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="32dp"
android:autoText="false"
android:elegantTextHeight="false"
android:freezesText="false"
android:text="Şifremi Unuttum"
android:textColor="#color/blue_gray_dark"
android:textIsSelectable="false"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.498"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/buttonLoginFragmentLogin" />
<Button
android:id="#+id/buttonLoginFragmentRegister"
style="#style/Widget.AppCompat.Button"
android:layout_width="150dp"
android:layout_height="45dp"
android:layout_marginStart="35dp"
android:layout_marginTop="41dp"
android:layout_marginBottom="192dp"
android:background="#drawable/button_custom2"
android:text="Kayıt ol"
android:textAllCaps="false"
android:textColor="#color/amber"
android:textSize="18sp"
android:textStyle="italic"
app:backgroundTint="#null"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/editTextLoginFragmentPassword"
app:rippleColor="#color/blue_gray" />
</androidx.constraintlayout.widget.ConstraintLayout>
</layout>
i wanted to display my navigation screen in my activity but the app crashed

how to edit xml ,add RecyclerView

I'm a newbie and I'm trying to edit quiz app
Some of the answers are long and need to be this xml Recycler View
Is there a way to add it or I have to create a new one?
please help
I'm a newbie and I'm trying to edit quiz app
Some of the answers are long and need to be this xml Recycler View
Is there a way to add it or I have to create a new one?
please help
<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"
tools:context=".QuizActivity">
<View
android:id="#+id/view4"
android:layout_width="wrap_content"
android:layout_height="130dp"
android:background="#drawable/background_bottom"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/question"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginLeft="16dp"
android:layout_marginTop="16dp"
android:layout_marginEnd="16dp"
android:layout_marginRight="16dp"
android:layout_marginBottom="16dp"
android:fontFamily="#font/roboto_bold"
android:gravity="center"
android:text=""
android:textColor="#color/color_white"
android:textSize="20sp"
app:layout_constraintBottom_toBottomOf="#+id/view5"
app:layout_constraintEnd_toEndOf="#+id/view5"
app:layout_constraintStart_toStartOf="#+id/view5"
app:layout_constraintTop_toTopOf="#+id/view5" />
<TextView
android:id="#+id/option_1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:background="#drawable/option_unselected"
android:onClick="onClick"
android:padding="15dp"
android:text="TextView"
app:layout_constraintEnd_toEndOf="#+id/view5"
app:layout_constraintStart_toStartOf="#+id/view5"
app:layout_constraintTop_toBottomOf="#+id/imageView4" />
<TextView
android:id="#+id/option_2"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:background="#drawable/option_unselected"
android:onClick="onClick"
android:padding="15dp"
android:text="TextView"
app:layout_constraintEnd_toEndOf="#+id/option_1"
app:layout_constraintStart_toStartOf="#+id/option_1"
app:layout_constraintTop_toBottomOf="#+id/option_1" />
<TextView
android:id="#+id/option_3"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:background="#drawable/option_unselected"
android:onClick="onClick"
android:padding="15dp"
android:text="TextView"
app:layout_constraintEnd_toEndOf="#+id/option_2"
app:layout_constraintStart_toStartOf="#+id/option_2"
app:layout_constraintTop_toBottomOf="#+id/option_2" />
<TextView
android:id="#+id/option_4"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:background="#drawable/option_unselected"
android:onClick="onClick"
android:padding="15dp"
android:text="TextView"
app:layout_constraintEnd_toEndOf="#+id/option_3"
app:layout_constraintStart_toStartOf="#+id/option_3"
app:layout_constraintTop_toBottomOf="#+id/option_3" />
<Button
android:id="#+id/nextBtn"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:layout_marginEnd="150dp"
android:background="#drawable/button_2"
android:onClick="onClick"
android:text="التالي"
android:textColor="#color/color_white"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toBottomOf="#+id/option_4" />
</androidx.constraintlayout.widget.ConstraintLayout>

How to insert text from textview according to checkbox?

I am making shopping list app in Kotlin. Main screen has 4 tabs, each for one store. On page for inserting new items I have 2 textview's, for product name and quantity. Also, on that page I have 4 checkboxes for 4 stores. I want to insert texts from textviews on specific tab when checkbox with same name as tab is checked. Didn't find any examples online. I would much appreciate everyones help.
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto" >
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingTop="30sp"
tools:context=".ItemInputActivity" >
<EditText
android:id="#+id/productId"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:visibility="gone"
tools:ignore="MissingConstraints"
/>
<EditText
android:id="#+id/inputItem"
android:layout_width="0dp"
android:layout_height="50dp"
android:layout_marginStart="22dp"
android:layout_marginTop="26dp"
android:layout_marginEnd="22dp"
android:ems="10"
android:hint="#string/naziv_proizvoda"
android:background="#drawable/bg_form"
android:paddingStart="10dp"
android:paddingEnd="10dp"
android:inputType="textPersonName"
android:textSize="16sp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
android:importantForAutofill="no" />
<EditText
android:id="#+id/inputNumber"
android:layout_width="0dp"
android:layout_height="50dp"
android:layout_marginStart="22dp"
android:layout_marginTop="20sp"
android:layout_marginEnd="22dp"
android:background="#drawable/bg_form"
android:ems="10"
android:hint="#string/kolicina_proizvoda"
android:importantForAutofill="no"
android:inputType="number"
android:paddingStart="10dp"
android:paddingEnd="10dp"
android:textSize="16sp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/inputItem" />
<CheckBox
android:id="#+id/konzumCheck"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="22sp"
android:layout_marginEnd="22sp"
android:minHeight="48dp"
android:text="#string/konzum"
app:layout_constraintBottom_toTopOf="#+id/lidlCheck"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/inputNumber" />
<CheckBox
android:id="#+id/lidlCheck"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="22sp"
android:layout_marginEnd="22sp"
android:text="#string/lidl"
android:minHeight="48dp"
app:layout_constraintTop_toBottomOf="#id/konzumCheck"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintBottom_toTopOf="#+id/kauflandCheck"
/>
<CheckBox
android:id="#+id/kauflandCheck"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="22sp"
android:layout_marginEnd="22sp"
android:text="#string/kaufland"
android:minHeight="48dp"
app:layout_constraintTop_toBottomOf="#id/lidlCheck"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintBottom_toTopOf="#+id/sparCheck"
/>
<CheckBox
android:id="#+id/sparCheck"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="22sp"
android:layout_marginEnd="22sp"
android:text="#string/spar"
android:minHeight="48dp"
app:layout_constraintTop_toBottomOf="#id/kauflandCheck"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintBottom_toTopOf="#+id/inputButton"
/>
<Button
android:id="#+id/inputButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="35sp"
android:text="#string/spremi"
android:textSize="12sp"
app:layout_constraintEnd_toStartOf="#id/itemListActivity"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/sparCheck" />
<Button
android:id="#+id/itemListActivity"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="35sp"
android:text="#string/lista_proizvoda"
android:textSize="12sp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="#id/inputButton"
app:layout_constraintTop_toBottomOf="#id/sparCheck"
/>
</androidx.constraintlayout.widget.ConstraintLayout>

Second EditText Skipped

<?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"
tools:context=".MainActivity">
<androidx.appcompat.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:background="#2A2E43"
android:minHeight="?attr/actionBarSize"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<ProgressBar
android:id="#+id/toolbar_progress_bar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="end"
android:indeterminateTint="#color/white"
tools:layout_editor_absoluteX="272dp"
tools:layout_editor_absoluteY="4dp" />
</androidx.appcompat.widget.Toolbar>
<TextView
android:id="#+id/deviceNameAndAddressText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:text="not connected"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/toolbar" />
<ImageView
android:id="#+id/one"
android:layout_width="25dp"
android:layout_height="25dp"
android:layout_marginStart="16dp"
android:layout_marginTop="28dp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/toolbar"
android:src="#drawable/one" />
<TextView
android:id="#+id/initial"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="11dp"
android:layout_marginTop="26dp"
android:text="initial"
android:textColor="#2A2E43"
app:layout_constraintStart_toEndOf="#id/one"
app:layout_constraintTop_toBottomOf="#id/toolbar" />
<TextView
android:id="#+id/denaturaion"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="11dp"
android:layout_marginTop="11dp"
android:text="Denaturation"
android:textColor="#2A2E43"
app:layout_constraintStart_toEndOf="#+id/one"
app:layout_constraintTop_toBottomOf="#+id/initial" />
<EditText
android:id="#+id/temp1"
android:layout_width="57dp"
android:layout_height="45dp"
android:layout_marginStart="20dp"
android:layout_marginTop="11dp"
android:ems="10"
android:inputType="number"
android:hint="\u2103"
android:imeOptions="actionNext"
android:textAlignment="center"
app:layout_constraintStart_toEndOf="#+id/denaturaion"
app:layout_constraintTop_toBottomOf="#+id/deviceNameAndAddressText"
app:layout_constraintEnd_toStartOf="#+id/mm_1"/>
<EditText
android:id="#+id/mm_1"
android:layout_width="55dp"
android:layout_height="45dp"
android:layout_marginStart="21dp"
android:layout_marginTop="37dp"
android:ems="10"
android:hint="mm"
android:imeOptions="actionNext"
android:textAlignment="center"
android:inputType="number"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toEndOf="#+id/temp1"
app:layout_constraintTop_toBottomOf="#+id/toolbar"
app:layout_constraintEnd_toStartOf="#+id/colon"/>
<TextView
android:id="#+id/colon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="7dp"
android:layout_marginTop="50dp"
android:text=":"
android:textColor="#2A2E43"
app:layout_constraintStart_toEndOf="#+id/mm_1"
app:layout_constraintTop_toBottomOf="#+id/toolbar"
app:layout_constraintEnd_toStartOf="#id/ss_1"/>
<EditText
android:id="#+id/ss_1"
android:layout_width="53dp"
android:layout_height="45dp"
android:layout_marginStart="9dp"
android:layout_marginTop="36dp"
android:layout_marginEnd="16dp"
android:ems="10"
android:inputType="number"
android:hint="ss"
android:imeOptions="actionNext"
android:textAlignment="center"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="#+id/colon"
app:layout_constraintTop_toBottomOf="#+id/toolbar"
/></androidx.constraintlayout.widget.ConstraintLayout>
This is my layout file. I am using constraint layout.When I am clicking next in the keypad the second edittext is skipped after first Edittext and focus the third eedittext. Please help me to sortout the issue.How to work on this issue, searched in google for solution no solutions
You can use these methods in your XML file for change focus according.
android:nextFocusDown="#+id/.."
android:nextFocusLeft="#+id/.."
android:nextFocusRight="#+id/.."
android:nextFocusUp="#+id/.."

how can I put empty space between password and register button in my constrainlayout

I am developing android app and I have implemented constrainlayout but in real device password edit text and register button overlapping to each other I want to empty space between them how can achieve that
below my currentlayout
<?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:background="#color/white">
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/constraintLayout"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_marginTop="100dp"
android:background="#drawable/circle_back"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="#drawable/ic_person">
<ImageView
android:id="#+id/person_icon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:contentDescription="#string/empty"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="#drawable/ic_person" />
</androidx.constraintlayout.widget.ConstraintLayout>
<EditText
android:id="#+id/name"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginTop="40dp"
android:layout_marginEnd="16dp"
android:hint="#string/firstname"
style="#style/textFieldStyle"
android:inputType="textEmailAddress"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/constraintLayout"
tools:ignore="RtlSymmetry"
android:autofillHints="" />
<EditText
android:id="#+id/email"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="16dp"
style="#style/textFieldStyle"
android:hint="#string/email"
android:inputType="textEmailAddress"
app:layout_constraintEnd_toEndOf="#+id/name"
app:layout_constraintStart_toStartOf="#+id/name"
app:layout_constraintTop_toBottomOf="#+id/lastName"
tools:ignore="TextFields" />
<Button
android:id="#+id/registration"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginBottom="40dp"
android:backgroundTint="#color/gray"
android:fontFamily="#font/roboto_black"
android:padding="16dp"
android:text="#string/register"
app:layout_constraintBottom_toTopOf="#+id/already_have_account"
app:layout_constraintEnd_toEndOf="#+id/password"
app:layout_constraintStart_toStartOf="parent" />
<TextView
android:id="#+id/already_have_account"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="32dp"
android:text="#string/already_have_an_account"
android:textColor="#color/primaryBlack"
android:textSize="12sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.33"
app:layout_constraintStart_toStartOf="parent" />
<TextView
android:id="#+id/login"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="32dp"
android:text="#string/login"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.73"
app:layout_constraintStart_toStartOf="parent" />
<EditText
android:id="#+id/password"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="16dp"
android:layout_marginBottom="16dp"
android:hint="#string/password"
android:inputType="textPassword"
style="#style/textFieldStyle"
app:layout_constraintEnd_toEndOf="#+id/email"
app:layout_constraintStart_toStartOf="#+id/email"
app:layout_constraintTop_toBottomOf="#+id/email" />
<EditText
android:id="#+id/lastName"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="16dp"
style="#style/textFieldStyle"
android:hint="#string/lastName"
android:inputType="textPersonName"
app:layout_constraintEnd_toEndOf="#+id/name"
app:layout_constraintStart_toStartOf="#+id/name"
app:layout_constraintTop_toBottomOf="#+id/name" />
</androidx.constraintlayout.widget.ConstraintLayout>
following screenshot in real device I want to know what I have to do in order to put space between password and register button
but I want to see in real device as if you see there space between password and register button
Add a constraint from the top of the register button to the bottom of the password field. Every element should have a top and bottom constraint to not overlap another element that is above or below it.
When you do something like android:layout_marginBottom="40dp", you will eventually get some views overlapping and that's because you are using hardcoded values, you want to adjust your views to the size of your screen in a responsive way.
You can do it using Guidelines, app:layout_constraintHeight_percent="0.xx" and chain verticly your views:
Inside you constarintLayout (I have used a single layout)
<ImageView
android:id="#+id/imageView"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintBottom_toTopOf="#+id/editTextTextPersonName"
app:layout_constraintDimensionRatio="1:1"
app:layout_constraintEnd_toStartOf="#+id/guideline4"
app:layout_constraintHeight_percent="0.25"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toStartOf="#+id/guideline3"
app:layout_constraintTop_toTopOf="parent"
tools:srcCompat="#tools:sample/backgrounds/scenic" />
<EditText
android:id="#+id/editTextTextPersonName"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintHeight_percent="0.07"
android:ems="10"
android:inputType="textPersonName"
android:text="FirstName"
app:layout_constraintBottom_toTopOf="#+id/editTextTextPersonName2"
app:layout_constraintEnd_toStartOf="#+id/guideline4"
app:layout_constraintStart_toStartOf="#+id/guideline3"
app:layout_constraintTop_toBottomOf="#+id/imageView" />
<EditText
android:id="#+id/editTextTextPersonName2"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintHeight_percent="0.07"
android:ems="10"
android:inputType="textPersonName"
android:text="LastName"
app:layout_constraintBottom_toTopOf="#+id/editTextTextPersonName3"
app:layout_constraintEnd_toEndOf="#+id/editTextTextPersonName"
app:layout_constraintStart_toStartOf="#+id/editTextTextPersonName"
app:layout_constraintTop_toBottomOf="#+id/editTextTextPersonName" />
<EditText
android:id="#+id/editTextTextPersonName3"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintHeight_percent="0.07"
android:ems="10"
android:inputType="textPersonName"
android:text="Email"
app:layout_constraintBottom_toTopOf="#+id/editTextTextPersonName4"
app:layout_constraintEnd_toEndOf="#+id/editTextTextPersonName"
app:layout_constraintStart_toStartOf="#+id/editTextTextPersonName"
app:layout_constraintTop_toBottomOf="#+id/editTextTextPersonName2" />
<EditText
android:id="#+id/editTextTextPersonName4"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintHeight_percent="0.07"
android:ems="10"
android:inputType="textPersonName"
android:text="Password"
app:layout_constraintBottom_toTopOf="#+id/button"
app:layout_constraintEnd_toEndOf="#+id/editTextTextPersonName"
app:layout_constraintStart_toStartOf="#+id/editTextTextPersonName"
app:layout_constraintTop_toBottomOf="#+id/editTextTextPersonName3" />
<Button
android:id="#+id/button"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintHeight_percent="0.07"
android:text="Register"
app:layout_constraintBottom_toTopOf="#+id/guideline2"
app:layout_constraintEnd_toEndOf="#+id/editTextTextPersonName4"
app:layout_constraintStart_toStartOf="#+id/editTextTextPersonName4"
app:layout_constraintTop_toBottomOf="#+id/editTextTextPersonName4" />
<androidx.constraintlayout.widget.Guideline
android:id="#+id/guideline2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintGuide_percent="0.85" />
<TextView
android:id="#+id/textView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Already have account?"
app:layout_constraintBottom_toBottomOf="#+id/textView2"
app:layout_constraintEnd_toStartOf="#+id/textView2"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="#+id/textView2" />
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Log in"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toEndOf="#+id/textView"
app:layout_constraintTop_toTopOf="#+id/guideline2" />
<androidx.constraintlayout.widget.Guideline
android:id="#+id/guideline3"
android:layout_width="wrap_content"
app:layout_constraintGuide_percent="0.05"
android:layout_height="wrap_content"
android:orientation="vertical" />
<androidx.constraintlayout.widget.Guideline
android:id="#+id/guideline4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintGuide_percent="0.95"
android:orientation="vertical" />
It will look like this (arrows pointing to the guidelines):
Adding app:layout_constraintTop_toBottomOf.
<Button
android:id="#+id/registration"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginBottom="40dp"
android:backgroundTint="#color/gray"
android:fontFamily="#font/roboto_black"
android:padding="16dp"
android:text="#string/register"
app:layout_constraintBottom_toTopOf="#+id/already_have_account"
app:layout_constraintEnd_toEndOf="#+id/password"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/password" />
Adding app:layout_constraintBottom_toTopOf="#id/registration"
<EditText
android:id="#+id/password"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="16dp"
android:layout_marginBottom="16dp"
android:hint="#string/password"
android:inputType="textPassword"
style="#style/textFieldStyle"
app:layout_constraintEnd_toEndOf="#+id/email"
app:layout_constraintStart_toStartOf="#+id/email"
app:layout_constraintTop_toBottomOf="#+id/email"
app:layout_constraintBottom_toTopOf="#id/registration" />
The above solution works only when all of your views are within a single screen. If height of the View is bigger than the screen, then you may need ScrollView or other method.
<?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">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/white">
... your main content here ...
</androidx.constraintlayout.widget.ConstraintLayout>
</LinearLayout>
</ScrollView>
Adding ScrollView and LinearLayout outside your main content ConstraintLayout solves the overlapping issue, and allow bigger view to scroll on smaller view.
Try increasing the margin_botton of the password field and also decreasing margin_botton of the Button.
The Problem is that your register button is bottom aligned, while the above elements are top aligned, which means they will overlap on smaller screens.
Try updating your Register button in the following way to enforce a minimum top margin with the password field if there is too little space (I just added a constraint to the password field, set constraintVerticalbias to 1.0 and set a topMargin):
<Button
android:id="#+id/registration"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginTop="ENTER YOUR TOP MARGIN HERE"
android:layout_marginBottom="40dp"
android:backgroundTint="#color/gray"
android:fontFamily="#font/roboto_black"
android:padding="16dp"
android:text="#string/register"
app:layout_constraintBottom_toTopOf="#+id/already_have_account"
app:layout_constraintEnd_toEndOf="#+id/password"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/password"
app:layout_constraintVertical_bias="1.0" />
IMPORTANT: To make this work you need to wrap your screen in a Scrollview with android:fillViewport="true".
Here would be your whole layout reworked so that it should work (with registerbutton minimum top margin of 40dp):
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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:background="#color/white">
<ScrollView
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="wrap_content">
<LinearLayout
android:id="#+id/constraintLayout"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_marginTop="100dp"
android:background="#drawable/circle_back"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="#drawable/ic_person">
<ImageView
android:id="#+id/person_icon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:contentDescription="#string/empty"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="#drawable/ic_person" />
</LinearLayout>
<EditText
android:id="#+id/name"
style="#style/textFieldStyle"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginTop="40dp"
android:layout_marginEnd="16dp"
android:autofillHints=""
android:hint="#string/firstname"
android:inputType="textEmailAddress"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/constraintLayout"
tools:ignore="RtlSymmetry" />
<EditText
android:id="#+id/email"
style="#style/textFieldStyle"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="16dp"
android:hint="#string/email"
android:inputType="textEmailAddress"
app:layout_constraintEnd_toEndOf="#+id/name"
app:layout_constraintStart_toStartOf="#+id/name"
app:layout_constraintTop_toBottomOf="#+id/lastName"
tools:ignore="TextFields" />
<Button
android:id="#+id/registration"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginTop="40dp"
android:layout_marginBottom="40dp"
android:backgroundTint="#color/gray"
android:fontFamily="#font/roboto_black"
android:padding="16dp"
android:text="#string/register"
app:layout_constraintBottom_toTopOf="#+id/already_have_account"
app:layout_constraintEnd_toEndOf="#+id/password"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/password"
app:layout_constraintVertical_bias="1.0" />
<TextView
android:id="#+id/already_have_account"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="32dp"
android:text="#string/already_have_an_account"
android:textColor="#color/primaryBlack"
android:textSize="12sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.33"
app:layout_constraintStart_toStartOf="parent" />
<TextView
android:id="#+id/login"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="32dp"
android:text="#string/login"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.73"
app:layout_constraintStart_toStartOf="parent" />
<EditText
android:id="#+id/password"
style="#style/textFieldStyle"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="16dp"
android:hint="#string/password"
android:inputType="textPassword"
app:layout_constraintEnd_toEndOf="#+id/email"
app:layout_constraintStart_toStartOf="#+id/email"
app:layout_constraintTop_toBottomOf="#+id/email" />
<EditText
android:id="#+id/lastName"
style="#style/textFieldStyle"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="16dp"
android:hint="#string/lastName"
android:inputType="textPersonName"
app:layout_constraintEnd_toEndOf="#+id/name"
app:layout_constraintStart_toStartOf="#+id/name"
app:layout_constraintTop_toBottomOf="#+id/name" />
</androidx.constraintlayout.widget.ConstraintLayout>
</ScrollView>
</LinearLayout>

Categories

Resources