I have two XML layout files, each has a ScrollView as parent.
While one is working properly, the other one doesn't (each XML has the same hierarchy).
activity_login.xml
<?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"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true">
<android.support.constraint.ConstraintLayout
android:id="#+id/login_container"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:id="#+id/tvLogo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/logo"
android:textSize="50sp"
app:layout_constraintBottom_toTopOf="#+id/guideline2"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<android.support.constraint.Guideline
android:id="#+id/guideline2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintGuide_percent="0.25" />
<TextView
android:id="#+id/tvRegisterLabel"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginLeft="3dp"
android:layout_marginStart="3dp"
android:text="#string/btn_login"
android:textSize="20sp"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintLeft_toLeftOf="#+id/guideline3"
app:layout_constraintRight_toLeftOf="#+id/guideline6"
app:layout_constraintTop_toTopOf="#+id/guideline2" />
<android.support.design.widget.TextInputLayout
android:id="#+id/textInputLayout2"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="15dp"
app:layout_constraintLeft_toLeftOf="#+id/guideline3"
app:layout_constraintRight_toLeftOf="#+id/guideline6"
app:layout_constraintTop_toBottomOf="#+id/tvRegisterLabel">
<EditText
android:id="#+id/etEmail"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="#string/et_email_hint"
android:inputType="textEmailAddress"
android:maxLength="70"
android:maxLines="1"
android:minLines="1"
android:text="akarki#yahoo.com"
android:textSize="#dimen/et_hint_size" />
</android.support.design.widget.TextInputLayout>
<android.support.constraint.Guideline
android:id="#+id/guideline3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
app:layout_constraintGuide_percent="0.15" />
<android.support.constraint.Guideline
android:id="#+id/guideline6"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
app:layout_constraintGuide_percent="0.85" />
<android.support.design.widget.TextInputLayout
android:id="#+id/textInputLayout7"
android:layout_width="0dp"
android:layout_height="wrap_content"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintLeft_toLeftOf="#+id/guideline3"
app:layout_constraintRight_toLeftOf="#+id/guideline6"
app:layout_constraintTop_toBottomOf="#+id/textInputLayout2">
<EditText
android:id="#+id/etPassword"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="#string/et_password_hint"
android:inputType="textPassword"
android:maxLength="30"
android:maxLines="1"
android:minLines="1"
android:text="1234qwer"
android:textSize="#dimen/et_hint_size" />
</android.support.design.widget.TextInputLayout>
<ProgressBar
android:id="#+id/progressBar"
style="?android:attr/progressBarStyleHorizontal"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginLeft="8dp"
android:layout_marginRight="8dp"
android:layout_marginTop="8dp"
android:visibility="invisible"
app:layout_constraintLeft_toLeftOf="#+id/guideline3"
app:layout_constraintRight_toLeftOf="#+id/guideline6"
app:layout_constraintTop_toBottomOf="#+id/textInputLayout7" />
<Button
android:id="#+id/btnLogIn"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:background="#drawable/round_button"
android:text="#string/btn_login"
android:textColor="#color/colorWhite"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintLeft_toLeftOf="#+id/guideline3"
app:layout_constraintRight_toLeftOf="#+id/guideline6"
app:layout_constraintTop_toBottomOf="#+id/progressBar" />
<com.facebook.login.widget.LoginButton
android:id="#+id/btnFacebook"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:paddingBottom="15dp"
android:paddingLeft="15dp"
android:paddingTop="15dp"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintLeft_toLeftOf="#+id/guideline3"
app:layout_constraintRight_toLeftOf="#+id/guideline6"
app:layout_constraintTop_toBottomOf="#+id/btnLogIn" />
<ImageButton
android:id="#+id/btnGoogle"
android:layout_width="0dp"
android:layout_height="50dp"
android:layout_marginTop="8dp"
android:background="#drawable/google_round_button"
android:scaleType="centerInside"
android:src="#drawable/google_button_background"
app:layout_constraintLeft_toLeftOf="#+id/guideline3"
app:layout_constraintRight_toLeftOf="#+id/guideline6"
app:layout_constraintTop_toBottomOf="#+id/btnFacebook" />
<TextView
android:id="#+id/tvRegister"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:layout_marginTop="8dp"
android:maxLines="2"
android:text="#string/tv_create_account"
android:textAlignment="center"
android:textColor="#color/colorPrimaryDark"
android:textSize="14sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintLeft_toLeftOf="#+id/guideline3"
app:layout_constraintRight_toLeftOf="#+id/guideline6"
app:layout_constraintTop_toBottomOf="#+id/tvForgotPassword" />
<TextView
android:id="#+id/tvForgotPassword"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:text="#string/tv_forgot_password"
android:textAlignment="center"
android:textColor="#color/colorAccent"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintLeft_toLeftOf="#+id/guideline3"
app:layout_constraintRight_toLeftOf="#+id/guideline6"
app:layout_constraintTop_toBottomOf="#+id/btnGoogle" />
</android.support.constraint.ConstraintLayout>
activity_register
<?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"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true">
<android.support.constraint.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="10dp">
<android.support.constraint.Guideline
android:id="#+id/guideline"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintGuide_percent="0.25" />
<android.support.constraint.Guideline
android:id="#+id/guideline4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
app:layout_constraintGuide_percent="0.15" />
<android.support.constraint.Guideline
android:id="#+id/guideline5"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
app:layout_constraintGuide_percent="0.85" />
<TextView
android:id="#+id/tvLogo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/logo"
android:textSize="50sp"
android:textStyle="bold"
app:layout_constraintBottom_toTopOf="#+id/guideline"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/tvRegisterLabel"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginEnd="3dp"
android:layout_marginLeft="3dp"
android:layout_marginRight="3dp"
android:layout_marginStart="3dp"
android:fontFamily="sans-serif"
android:text="#string/label_register"
android:textAllCaps="true"
android:textSize="20sp"
app:layout_constraintLeft_toLeftOf="#+id/guideline4"
app:layout_constraintRight_toRightOf="#+id/guideline5"
app:layout_constraintTop_toTopOf="#+id/guideline" />
<android.support.design.widget.TextInputLayout
android:id="#+id/textInputLayout"
android:layout_width="0dp"
android:layout_height="wrap_content"
app:layout_constraintLeft_toLeftOf="#+id/guideline4"
app:layout_constraintRight_toRightOf="#+id/guideline5"
app:layout_constraintTop_toBottomOf="#+id/tvRegisterLabel">
<EditText
android:id="#+id/etEmailReg"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:focusable="true"
android:hint="#string/et_email_hint"
android:inputType="textEmailAddress"
android:maxLength="70"
android:maxLines="1"
android:minLines="1"
android:textSize="#dimen/et_hint_size" />
</android.support.design.widget.TextInputLayout>
<android.support.design.widget.TextInputLayout
android:id="#+id/textInputLayout3"
android:layout_width="0dp"
android:layout_height="wrap_content"
app:layout_constraintLeft_toLeftOf="#+id/guideline4"
app:layout_constraintRight_toRightOf="#+id/guideline5"
app:layout_constraintTop_toBottomOf="#+id/textInputLayout">
<EditText
android:id="#+id/etNameReg"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:focusable="true"
android:hint="#string/et_name_hint"
android:inputType="textCapWords"
android:maxLength="30"
android:maxLines="1"
android:minLines="1"
android:textSize="#dimen/et_hint_size" />
</android.support.design.widget.TextInputLayout>
<android.support.design.widget.TextInputLayout
android:id="#+id/textInputLayout4"
android:layout_width="0dp"
android:layout_height="wrap_content"
app:layout_constraintLeft_toLeftOf="#+id/guideline4"
app:layout_constraintRight_toRightOf="#+id/guideline5"
app:layout_constraintTop_toBottomOf="#+id/textInputLayout3">
<EditText
android:id="#+id/etPasswordReg"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:focusable="true"
android:hint="#string/et_password_hint"
android:inputType="textPassword"
android:maxLength="30"
android:maxLines="1"
android:minLines="1"
android:textSize="#dimen/et_hint_size" />
</android.support.design.widget.TextInputLayout>
<android.support.design.widget.TextInputLayout
android:id="#+id/textInputLayout5"
android:layout_width="0dp"
android:layout_height="wrap_content"
app:layout_constraintLeft_toLeftOf="#+id/guideline4"
app:layout_constraintRight_toRightOf="#+id/guideline5"
app:layout_constraintTop_toBottomOf="#+id/textInputLayout4">
<EditText
android:id="#+id/etPasswordConfirmReg"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:focusable="true"
android:hint="#string/et_password_confirm_hint"
android:inputType="textPassword"
android:maxLength="30"
android:maxLines="1"
android:minLines="1"
android:textSize="#dimen/et_hint_size" />
</android.support.design.widget.TextInputLayout>
<android.support.design.widget.TextInputLayout
android:id="#+id/textInputLayout6"
android:layout_width="0dp"
android:layout_height="wrap_content"
app:layout_constraintLeft_toLeftOf="#+id/guideline4"
app:layout_constraintRight_toRightOf="#+id/guideline5"
app:layout_constraintTop_toBottomOf="#+id/textInputLayout5">
<EditText
android:id="#+id/etPhoneNumber"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:focusable="true"
android:hint="#string/et_phone_hint"
android:inputType="phone"
android:maxLength="13"
android:maxLines="1"
android:minLines="1"
android:textSize="#dimen/et_hint_size" />
</android.support.design.widget.TextInputLayout>
<TextView
android:id="#+id/tvRequired"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:text="#string/label_required"
android:textAlignment="textStart"
android:textSize="12sp"
app:layout_constraintLeft_toLeftOf="#+id/guideline4"
app:layout_constraintRight_toRightOf="#+id/guideline5"
app:layout_constraintTop_toBottomOf="#+id/textInputLayout6" />
<Button
android:id="#+id/btnRegister"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="40dp"
android:background="#drawable/round_button"
android:text="#string/label_register"
android:textColor="#android:color/white"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintLeft_toLeftOf="#+id/guideline4"
app:layout_constraintRight_toRightOf="#+id/guideline5"
app:layout_constraintTop_toBottomOf="#+id/tvRequired" />
</android.support.constraint.ConstraintLayout>
So, to clarify my problem: In the activity_login the scrollview works correctly, as expected. While in the activity_register the scrollview doesn't scroll to the bottom, I don't know why, because I've used the same hierarcy as in the activity_login.
I've searched in SO for the same problem, but I haven't found any solution to my problem.
Any help would be appreciated, I'm searching for a solution for days.
I don't know for sure why it's a problem, but the problem seems to be your horizontal Guideline. If I delete the Guideline, delete tvLogo's reference to it, and change tvRegisterLabel's reference to app:layout_constraintTop_toBottomOf="#+id/tvLogo", everything works.
I suspect that it is because you seem to have a circular set of rules in your layout. The ConstraintLayout's height is wrap_content, so it has to lay out all of its views to know how big it is. To lay out its views, it must lay out tvLogo. To lay out tvLogo, it must lay out guideline. To lay out guideline, the ConstraintLayout must know how tall it is. And so on.
By the way, it looks like you could perhaps just replace this ConstraintLayout with a LinearLayout.
Sorry couldn't have much reputations to add comment so giving answer,
<android.support.constraint.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="10dp">
remove padding from this code in activity_register xml, It will solve your problem
Related
I'm having trouble lining up a LinearLayout in a XML file. I'm trying to use a LinearLayout because I have TextViews that have to be hidden/shown upon certain options being selected, which I have that down. My problem is that I'm trying to use margin to line everything up centered, but if I run it on my Pixel 5 emulator, it's shift to the right when I have everything centered in my XML. Should I be using padding instead in my LinearLayout, or what should I be doing? Thank you!
App Screen
XML Design
dialog_job_request_confirmation.xml
<?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="#BF090909">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="1.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="1.0">
<androidx.cardview.widget.CardView
android:layout_width="0dp"
android:layout_height="560dp"
android:layout_marginStart="24dp"
android:layout_marginEnd="24dp"
app:cardBackgroundColor="#color/background_view"
app:cardCornerRadius="8dp"
app:cardElevation="5dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<com.google.android.material.appbar.AppBarLayout
android:id="#+id/app_bar_layout"
android:layout_width="match_parent"
android:layout_height="70dp"
android:background="#color/main_purple"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:layout_width="125dp"
android:layout_height="56dp"
android:layout_marginTop="8dp"
android:contentDescription="#string/skedaddle_service_logo"
android:scaleType="fitXY"
android:src="#drawable/skedaddle_services_"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
</com.google.android.material.appbar.AppBarLayout>
<androidx.appcompat.widget.Toolbar
android:layout_width="match_parent"
android:layout_height="70dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<ScrollView
android:id="#+id/scrollView3"
android:layout_width="match_parent"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/app_bar_layout">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginBottom="12dp"
android:orientation="vertical"
app:layout_constraintBottom_toTopOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<TextView
android:id="#+id/confirmJobRequestLabelTextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="50dp"
android:layout_marginTop="495dp"
android:text="#string/confirm_job_request_details"
android:textColor="#color/black"
android:textSize="16sp"
android:textStyle="bold" />
<TextView
android:id="#+id/fullnameLabelTextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="110dp"
android:layout_marginTop="12dp"
android:text="#string/full_name_"
android:textColor="#color/black"
android:textSize="16sp"
android:textStyle="bold" />
<TextView
android:id="#+id/fullnameDetailLabelTextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="95dp"
android:layout_marginTop="8dp"
android:textAlignment="center"
android:textColor="#color/black"
android:textSize="16sp"
android:textStyle="italic" />
<TextView
android:id="#+id/addressLabelTextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="115dp"
android:layout_marginTop="12dp"
android:text="#string/address_"
android:textColor="#color/black"
android:textSize="16sp"
android:textStyle="bold" />
<TextView
android:id="#+id/addressDetailLabelTextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="95dp"
android:layout_marginTop="8dp"
android:textAlignment="center"
android:textColor="#color/black"
android:textSize="16sp"
android:textStyle="italic" />
<TextView
android:id="#+id/dateAndTimeLabelTextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="120dp"
android:layout_marginTop="12dp"
android:text="#string/dates_and_times_"
android:textColor="#color/black"
android:textSize="16sp"
android:textStyle="bold" />
<TextView
android:id="#+id/firstDateAndTimeDetailLabelTextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="170dp"
android:layout_marginTop="8dp"
android:textAlignment="center"
android:textColor="#color/black"
android:textSize="16sp"
android:textStyle="italic" />
<TextView
android:id="#+id/secondDateAndTimeDetailLabelTextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="170dp"
android:layout_marginTop="8dp"
android:textAlignment="center"
android:textColor="#color/black"
android:textSize="16sp"
android:textStyle="italic" />
<TextView
android:id="#+id/thirdDateAndTimeDetailLabelTextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="170dp"
android:layout_marginTop="8dp"
android:textAlignment="center"
android:textColor="#color/black"
android:textSize="16sp"
android:textStyle="italic" />
<TextView
android:id="#+id/timeConstraintsLabelTextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="110dp"
android:layout_marginTop="12dp"
android:text="#string/time_constraints_"
android:textColor="#color/black"
android:textSize="16sp"
android:textStyle="bold" />
<TextView
android:id="#+id/timeConstraintsDetailLabelTextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="170dp"
android:layout_marginTop="8dp"
android:textAlignment="center"
android:textColor="#color/black"
android:textSize="16sp"
android:textStyle="italic" />
<TextView
android:id="#+id/jobDescriptionLabelTextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="115dp"
android:layout_marginTop="12dp"
android:text="#string/job_description_"
android:textColor="#color/black"
android:textSize="16sp"
android:textStyle="bold" />
<TextView
android:id="#+id/jobDescriptionDetailLabelTextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="170dp"
android:layout_marginTop="8dp"
android:textAlignment="center"
android:textColor="#color/black"
android:textSize="16sp"
android:textStyle="italic" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal">
<Button
android:id="#+id/cancelConfirmJobButton"
style="?android:attr/buttonBarButtonStyle"
android:layout_width="120dp"
android:layout_height="48dp"
android:layout_marginStart="48dp"
android:layout_marginTop="12dp"
android:layout_marginEnd="12dp"
android:background="#color/black"
android:text="#android:string/cancel"
android:textAllCaps="false"
android:textColor="#color/white" />
<Button
android:id="#+id/confirmJobRequestButton"
android:layout_width="120dp"
android:layout_height="48dp"
android:layout_marginTop="12dp"
android:layout_marginEnd="45dp"
android:background="#color/main_purple"
android:text="#string/confirm_job"
android:textAllCaps="false"
android:textColor="#color/white"
style="?android:attr/buttonBarButtonStyle" />
</LinearLayout>
</LinearLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
</ScrollView>
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.cardview.widget.CardView>
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
You shouldn't center anything using just padding or margin. In your case it's enough to use the layout_gravity in each TextView:
android:layout_gravity="center_horizontal"
More details here.
I'm currently practicing UI designing in Android and needed to make a layout be included in multiple layouts as a header. So I made this quite complex layout below.
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.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="wrap_content"
android:background="#f5f5f5">
<include
android:id="#+id/includeItem"
layout="#layout/dialog_header"
android:layout_width="0dp"
android:layout_height="wrap_content"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<ScrollView
android:layout_width="match_parent"
android:layout_height="500dp"
android:layout_marginTop="60dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/includeItem">
<android.support.constraint.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.constraint.Guideline
android:id="#+id/guideline"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
app:layout_constraintGuide_begin="16dp" />
<android.support.constraint.Guideline
android:id="#+id/guideline2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
app:layout_constraintGuide_end="16dp" />
<EditText
android:id="#+id/editText4"
style="#style/CustomEditText"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginTop="8dp"
android:layout_marginEnd="16dp"
android:ems="10"
android:hint="#string/name"
android:inputType="textPersonName"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="#+id/imageView5"
app:layout_constraintTop_toTopOf="#+id/imageView5" />
<ImageView
android:id="#+id/imageView5"
android:layout_width="120dp"
android:layout_height="120dp"
android:layout_marginStart="16dp"
android:layout_marginTop="32dp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="#color/btn_bg" />
<Button
android:id="#+id/button4"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:background="#drawable/border_transparent_bg"
android:drawableRight="#drawable/ic_chevron_right_black_24dp"
android:gravity="start|center_vertical"
android:padding="8dp"
android:text="#string/select_category"
android:textSize="24sp"
app:layout_constraintEnd_toEndOf="#+id/editText4"
app:layout_constraintStart_toStartOf="#+id/editText4"
app:layout_constraintTop_toBottomOf="#+id/editText4" />
<TextView
android:id="#+id/textView10"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:text="#string/tap_to_edit"
android:textColor="#color/textDarkSecondary"
android:textSize="18sp"
app:layout_constraintEnd_toEndOf="#+id/imageView5"
app:layout_constraintStart_toStartOf="#+id/imageView5"
app:layout_constraintTop_toBottomOf="#+id/imageView5" />
<TableRow
android:id="#+id/tableRow4"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:background="#drawable/border_transparent_bg"
android:padding="8dp"
app:layout_constraintEnd_toEndOf="#+id/tableRow3"
app:layout_constraintStart_toStartOf="#+id/tableRow3"
app:layout_constraintTop_toBottomOf="#+id/tableRow3">
<EditText
android:id="#+id/editText7"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="4dp"
android:layout_weight="1"
android:background="#color/white"
android:ems="10"
android:hint="#string/price"
android:inputType="textPersonName"
android:padding="8dp"
android:textSize="24sp" />
<EditText
android:id="#+id/editText6"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="4dp"
android:layout_weight="1"
android:background="#color/white"
android:ems="10"
android:hint="#string/sku"
android:inputType="textPersonName"
android:padding="8dp"
android:textSize="24sp" />
</TableRow>
<TextView
android:id="#+id/textView11"
style="#style/ModuleTitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:text="#string/variations"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/textView10" />
<TableRow
android:id="#+id/tableRow3"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="16dp"
android:layout_marginEnd="16dp"
android:background="#drawable/border_transparent_bg"
android:padding="8dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="#+id/textView11"
app:layout_constraintTop_toBottomOf="#+id/textView11">
<EditText
android:id="#+id/editText8"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#color/white"
android:ems="10"
android:hint="#string/name"
android:inputType="textPersonName"
android:padding="8dp"
android:textSize="24sp" />
</TableRow>
<Button
android:id="#+id/button6"
style="#style/CommonButton"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="16dp"
android:text="#string/add_variation"
app:layout_constraintEnd_toEndOf="#+id/tableRow4"
app:layout_constraintStart_toStartOf="#+id/tableRow4"
app:layout_constraintTop_toBottomOf="#+id/tableRow4" />
<TextView
android:id="#+id/textView12"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:text="#string/add_variation_msg"
android:textColor="#color/textDarkSecondary"
android:textSize="18sp"
app:layout_constraintEnd_toEndOf="#+id/button6"
app:layout_constraintStart_toStartOf="#+id/button6"
app:layout_constraintTop_toBottomOf="#+id/button6" />
<TextView
android:id="#+id/textView13"
style="#style/ModuleTitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:text="#string/modifier_sets"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/textView12" />
<android.support.v7.widget.RecyclerView
android:id="#+id/recyclerView"
android:layout_width="0dp"
android:layout_height="200dp"
android:layout_marginTop="8dp"
app:layout_constraintEnd_toStartOf="#+id/guideline2"
app:layout_constraintStart_toStartOf="#+id/guideline"
app:layout_constraintTop_toBottomOf="#+id/textView13">
</android.support.v7.widget.RecyclerView>
<TextView
android:id="#+id/textView14"
style="#style/ModuleTitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="24dp"
android:text="#string/taxes"
app:layout_constraintStart_toStartOf="#+id/guideline"
app:layout_constraintTop_toBottomOf="#+id/recyclerView" />
<android.support.v7.widget.RecyclerView
android:id="#+id/recyclerView2"
android:layout_width="0dp"
android:layout_height="200dp"
android:layout_marginTop="16dp"
app:layout_constraintEnd_toStartOf="#+id/guideline2"
app:layout_constraintHorizontal_bias="1.0"
app:layout_constraintStart_toStartOf="#+id/guideline"
app:layout_constraintTop_toBottomOf="#+id/textView14" />
<TextView
android:id="#+id/textView17"
style="#style/ModuleTitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:text="#string/select_kitchen_location"
app:layout_constraintStart_toStartOf="#+id/guideline"
app:layout_constraintTop_toBottomOf="#+id/recyclerView2" />
<Spinner
android:id="#+id/spinner"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:padding="8dp"
app:layout_constraintEnd_toStartOf="#+id/guideline2"
app:layout_constraintStart_toStartOf="#+id/guideline"
app:layout_constraintTop_toBottomOf="#+id/textView17" />
<CheckBox
android:id="#+id/checkBox"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="16dp"
android:text="#string/available"
android:textColor="#color/black"
android:textSize="24sp"
app:layout_constraintEnd_toStartOf="#+id/guideline2"
app:layout_constraintStart_toStartOf="#+id/guideline"
app:layout_constraintTop_toBottomOf="#+id/spinner" />
<EditText
style="#style/CustomEditText"
android:layout_width="0dp"
android:layout_height="200dp"
android:layout_marginTop="16dp"
android:layout_marginBottom="16dp"
android:textColor="#color/black"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toStartOf="#+id/guideline2"
app:layout_constraintStart_toStartOf="#+id/guideline"
app:layout_constraintTop_toBottomOf="#+id/checkBox" />
</android.support.constraint.ConstraintLayout>
</ScrollView>
</android.support.constraint.ConstraintLayout>
This is the include layout.
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.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="wrap_content">
<ImageView
android:id="#+id/imgDlgHeaderAction"
android:layout_width="90dp"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="#+id/lblDlgHeaderTitle"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="#drawable/ic_add_24dp" />
<Button
android:id="#+id/btnDlgHeaderSave"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/border_bg_pressed"
android:paddingStart="32dp"
android:paddingTop="16dp"
android:paddingEnd="32dp"
android:paddingBottom="16dp"
android:text="#string/save"
android:textColor="#color/white"
android:textSize="24sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/lblDlgHeaderTitle"
android:layout_width="0dp"
android:layout_height="0dp"
android:gravity="center"
android:text="TextView"
android:textColor="#color/black"
android:textSize="24sp"
android:textStyle="bold"
app:layout_constraintBottom_toBottomOf="#+id/btnDlgHeaderSave"
app:layout_constraintEnd_toStartOf="#+id/btnDlgHeaderSave"
app:layout_constraintStart_toEndOf="#id/imgDlgHeaderAction"
app:layout_constraintTop_toTopOf="#+id/btnDlgHeaderSave" />
</android.support.constraint.ConstraintLayout>
In the layout editor, it looks fine. But when I compile my code, the ScrollView is clipping through the include without that much marginTop. I might file an issue if this is a bug.
From the suggestions below, I tried to change ScrollView to a NestedScrollView. As I have guessed, it still didn't work.
I also want to emphasized that my question is not about the RecyclerViews not being able to scroll, because I know that would happen, but about the clipping of the ScrollView through the include layout.
Change your include layout constraint like below
Remove bottom constarint and used NestedScrollView in main layout instead of ScrollView
<?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"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/imgDlgHeaderAction"
android:layout_width="90dp"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="#+id/btnDlgHeaderSave"
app:layout_constraintEnd_toStartOf="#+id/lblDlgHeaderTitle"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="#+id/btnDlgHeaderSave"
app:srcCompat="#drawable/ic_email" />
<Button
android:id="#+id/btnDlgHeaderSave"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:background="#color/bg_toolbar"
android:gravity="center"
android:paddingStart="32dp"
android:paddingTop="16dp"
android:paddingEnd="32dp"
android:paddingBottom="16dp"
android:text="#string/save"
android:textColor="#android:color/white"
android:textSize="24sp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="#+id/lblDlgHeaderTitle"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/lblDlgHeaderTitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:text="TextView"
android:textColor="#android:color/black"
android:textSize="24sp"
android:textStyle="bold"
app:layout_constraintBottom_toBottomOf="#+id/btnDlgHeaderSave"
app:layout_constraintEnd_toStartOf="#+id/btnDlgHeaderSave"
app:layout_constraintStart_toEndOf="#+id/imgDlgHeaderAction"
app:layout_constraintTop_toTopOf="#+id/btnDlgHeaderSave" />
</androidx.constraintlayout.widget.ConstraintLayout>
Main layout
<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"
android:background="#f5f5f5">
<include
android:id="#+id/includeItem"
layout="#layout/test_include"
android:layout_width="0dp"
android:layout_height="wrap_content"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<androidx.core.widget.NestedScrollView
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginTop="20dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/includeItem">
<!.. Remining one as it is>
</androidx.core.widget.NestedScrollView>
</androidx.constraintlayout.widget.ConstraintLayout>
Hi I am new to using android studio and I do not get why the layout that I am seeing in the preview of the IDE does not match with the ones that I am seeing on my screen. I am using Samsung J7 Prime.
This is what I see in the preview
however, this is what I see on my device.
Please help, thank you in advance.
<?xml version="1.0" encoding="utf-8"?>
<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:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<TextView
android:id="#+id/textView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="65dp"
android:layout_marginEnd="32dp"
android:text="#string/original_price"
app:layout_constraintBaseline_toBaselineOf="#+id/etNum1"
app:layout_constraintEnd_toStartOf="#+id/etNum1"
app:layout_constraintStart_toStartOf="parent" />
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="72dp"
android:layout_marginTop="6dp"
android:layout_marginEnd="60dp"
android:text="#string/rate"
app:layout_constraintEnd_toStartOf="#+id/etNum2"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="#+id/etNum2" />
<TextView
android:id="#+id/textView3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="65dp"
android:layout_marginEnd="61dp"
android:text="#string/discount"
app:layout_constraintEnd_toStartOf="#+id/etNum3"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="#+id/etNum3" />
<TextView
android:id="#+id/textView4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="65dp"
android:layout_marginTop="8dp"
android:layout_marginEnd="46dp"
android:text="#string/sales_price"
app:layout_constraintEnd_toStartOf="#+id/etNum4"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="#+id/etNum4" />
<EditText
android:id="#+id/etNum1"
android:layout_width="0dp"
android:layout_height="39dp"
android:layout_marginTop="101dp"
android:layout_marginEnd="75dp"
android:autofillHints=""
android:ems="10"
android:inputType="number"
android:labelFor="#id/etNum1"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="#+id/textView"
app:layout_constraintTop_toTopOf="parent" />
<EditText
android:id="#+id/etNum2"
android:layout_width="0dp"
android:layout_height="37dp"
android:layout_marginTop="79dp"
android:layout_marginEnd="72dp"
android:layout_marginBottom="80dp"
android:autofillHints=""
android:ems="10"
android:inputType="number"
android:labelFor="#id/etNum2"
app:layout_constraintBottom_toBottomOf="#+id/etNum3"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="#+id/textView2"
app:layout_constraintTop_toTopOf="#+id/textView" />
<EditText
android:id="#+id/etNum3"
android:layout_width="0dp"
android:layout_height="34dp"
android:layout_marginTop="143dp"
android:layout_marginEnd="76dp"
android:layout_marginBottom="143dp"
android:autofillHints=""
android:ems="10"
android:inputType="number"
android:labelFor="#id/etNum3"
app:layout_constraintBottom_toTopOf="#+id/calculate"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="#+id/textView3"
app:layout_constraintTop_toBottomOf="#+id/textView"
android:editable="false"/>
<EditText
android:id="#+id/etNum4"
android:layout_width="0dp"
android:layout_height="39dp"
android:layout_marginTop="47dp"
android:layout_marginEnd="72dp"
android:autofillHints=""
android:ems="10"
android:inputType="number"
android:labelFor="#id/etNum4"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="#+id/textView4"
app:layout_constraintTop_toBottomOf="#+id/etNum3"
android:editable="false"/>
<Button
android:id="#+id/calculate"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="14dp"
android:layout_marginBottom="229dp"
android:text="#string/compute"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toEndOf="#+id/textView4" />
<Button
android:id="#+id/clear"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="29dp"
android:text="#string/erase"
app:layout_constraintStart_toStartOf="#+id/calculate"
app:layout_constraintTop_toBottomOf="#+id/calculate" />
</android.support.constraint.ConstraintLayout>
You are using a fixed size in a lot of places for your views(for example android:layout_marginTop="79dp" and android:layout_height="37dp").
Because different phones got different screen size, when you are using a fixed size on your view you are making your layout less responsive.
If you want to place some view anywhere at your screen I would recommend using guielines and constraint your views into the guideline rather then give your view a fixed size value to fit the preview(don't forget that with fixed sizes what may fit one screen may not fit another screen).
For your desired layout you can simply use chains.
Here is an example of the layout that you want to achieve using cnostraintLayout and chains:
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.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">
<TextView
android:id="#+id/textView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/original_price"
app:layout_constraintBottom_toTopOf="#+id/textView2"
app:layout_constraintEnd_toStartOf="#+id/etNum1"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/textView2"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:text="#string/rate"
app:layout_constraintBottom_toTopOf="#+id/textView3"
app:layout_constraintEnd_toEndOf="#+id/textView"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toStartOf="#+id/textView"
app:layout_constraintTop_toBottomOf="#+id/textView" />
<TextView
android:id="#+id/textView3"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:text="#string/discount"
app:layout_constraintBottom_toTopOf="#+id/textView4"
app:layout_constraintEnd_toEndOf="#+id/textView"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toStartOf="#+id/textView"
app:layout_constraintTop_toBottomOf="#+id/textView2" />
<TextView
android:id="#+id/textView4"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:text="#string/sales_price"
app:layout_constraintBottom_toTopOf="#+id/calculate"
app:layout_constraintEnd_toEndOf="#+id/textView"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toStartOf="#+id/textView"
app:layout_constraintTop_toBottomOf="#+id/textView3" />
<EditText
android:id="#+id/etNum1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:autofillHints=""
android:ems="10"
android:inputType="number"
android:labelFor="#id/etNum1"
app:layout_constraintBottom_toBottomOf="#+id/textView"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toEndOf="#+id/textView"
app:layout_constraintTop_toTopOf="#+id/textView" />
<EditText
android:id="#+id/etNum2"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:autofillHints=""
android:ems="10"
android:inputType="number"
android:labelFor="#id/etNum2"
app:layout_constraintBottom_toBottomOf="#+id/textView2"
app:layout_constraintEnd_toEndOf="#+id/etNum1"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toStartOf="#+id/etNum1"
app:layout_constraintTop_toTopOf="#+id/textView2" />
<EditText
android:id="#+id/etNum3"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:autofillHints=""
android:editable="false"
android:ems="10"
android:inputType="number"
android:labelFor="#id/etNum3"
app:layout_constraintBottom_toBottomOf="#+id/textView3"
app:layout_constraintEnd_toEndOf="#+id/etNum1"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toStartOf="#+id/etNum1"
app:layout_constraintTop_toTopOf="#+id/textView3" />
<EditText
android:id="#+id/etNum4"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:autofillHints=""
android:editable="false"
android:ems="10"
android:inputType="number"
android:labelFor="#id/etNum4"
app:layout_constraintBottom_toBottomOf="#+id/textView4"
app:layout_constraintEnd_toEndOf="#+id/etNum1"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toStartOf="#+id/etNum1"
app:layout_constraintTop_toTopOf="#+id/textView4" />
<Button
android:id="#+id/calculate"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="compute"
app:layout_constraintBottom_toTopOf="#+id/clear"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/textView4" />
<Button
android:id="#+id/clear"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:text="erase"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="#+id/calculate"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toStartOf="#+id/calculate"
app:layout_constraintTop_toBottomOf="#+id/calculate" />
</android.support.constraint.ConstraintLayout>
And it will look like this:
Try this:
<?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:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="50dp"
android:gravity="center">
<TextView
android:id="#+id/textView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Title 1" />
<EditText
android:id="#+id/etNum1"
android:layout_width="wrap_content"
android:layout_height="39dp"
android:layout_marginStart="20dp"
android:ems="10"
android:hint="Title 1"
android:inputType="number"
android:labelFor="#id/etNum1" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:gravity="center">
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Title 2" />
<EditText
android:id="#+id/etNum2"
android:layout_width="wrap_content"
android:layout_height="39dp"
android:layout_marginStart="20dp"
android:ems="10"
android:hint="Title 2"
android:inputType="number"
android:labelFor="#id/etNum1" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:gravity="center">
<TextView
android:id="#+id/textView3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Title 3" />
<EditText
android:id="#+id/etNum3"
android:layout_width="wrap_content"
android:layout_height="39dp"
android:layout_marginStart="20dp"
android:ems="10"
android:hint="Title 3"
android:inputType="number"
android:labelFor="#id/etNum1" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:gravity="center">
<TextView
android:id="#+id/textView4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Title 4" />
<EditText
android:id="#+id/etNum4"
android:layout_width="wrap_content"
android:layout_height="39dp"
android:layout_marginStart="20dp"
android:ems="10"
android:hint="Title 4"
android:inputType="number"
android:labelFor="#id/etNum1" />
</LinearLayout>
<Button
android:id="#+id/calculate"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_marginTop="30dp"
android:text="Button 1" />
<Button
android:id="#+id/clear"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_marginTop="20dp"
android:text="Button 2" />
</LinearLayout>
Remove all constraints top of and remap them according to what should be on top of for example textView should be on top of textView1 Goodluck
I have added xml for my layout edit text is not getting focus, only selects first one then cannot selects another edittext
I am afraid that somehow focus is not getting or is messed up but could not resolve it anyway.
maybe constraintlayout is culprit but no idea.
<?xml version="1.0" encoding="utf-8"?>
<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:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/black">
<include
android:id="#+id/toolbar"
layout="#layout/toolbar_layout" />
<ScrollView
android:id="#+id/svScroll"
android:layout_width="0dp"
android:layout_height="0dp"
android:padding="10dp"
android:scrollbars="none"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/toolbar"
app:layout_constraintBottom_toTopOf="#+id/btUpdate"
>
<android.support.constraint.ConstraintLayout
android:id="#+id/constraint_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/black"
>
<EditText
android:id="#+id/etEmailid"
android:layout_width="match_parent"
android:layout_height="48dp"
android:background="#drawable/profile_background"
android:hint="#string/email_txt"
android:padding="10dp"
android:textColor="#color/white"
android:textColorHint="#color/white"
android:textSize="16sp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
android:inputType="text" />
<EditText
android:id="#+id/etFirstName"
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_marginTop="10dp"
android:background="#drawable/profile_background"
android:padding="10dp"
android:hint="#string/First_name"
android:textColorHint="#color/white"
android:textColor="#color/white"
android:textSize="16sp"
android:inputType="textCapWords"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/etEmailid"
/>
<EditText
android:id="#+id/etLastName"
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_marginTop="10dp"
android:background="#drawable/profile_background"
android:padding="10dp"
android:hint="#string/last_name"
android:inputType="textCapWords"
android:textColorHint="#color/white"
android:textColor="#color/white"
android:textSize="16sp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/etFirstName" />
<TextView
android:id="#+id/dob"
android:layout_width="0dp"
android:layout_height="50dp"
android:layout_marginTop="10dp"
android:background="#drawable/profile_background"
android:drawablePadding="10dp"
android:drawableEnd="#mipmap/mdate"
android:gravity="center_vertical"
android:padding="10dp"
android:hint="#string/dob"
android:textColorHint="#color/white"
android:textColor="#color/white"
android:textSize="16sp"
app:layout_constraintEnd_toStartOf="#+id/genderSpinner"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/etLastName" />
<Spinner
android:id="#+id/genderSpinner"
android:layout_width="0dp"
android:layout_height="50dp"
android:layout_marginStart="10dp"
android:background="#drawable/profile_background"
android:entries="#array/gender"
android:textColor="#color/white"
android:textColorHint="#color/white"
android:textSize="16sp"
app:layout_constraintBottom_toBottomOf="#+id/dob"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="#+id/dob"
app:layout_constraintTop_toTopOf="#+id/dob"/>
<EditText
android:id="#+id/etMobileno"
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_marginTop="10dp"
android:background="#drawable/profile_background"
android:padding="10dp"
android:hint="#string/mobile_txt"
android:textColor="#color/white"
android:textColorHint="#color/white"
android:textSize="16sp"
android:inputType="number"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/genderSpinner" />
<EditText
android:id="#+id/etAddress"
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_marginTop="10dp"
android:background="#drawable/profile_background"
android:padding="10dp"
android:hint="#string/address"
android:inputType="textCapWords"
android:textColorHint="#color/white"
android:textColor="#color/white"
android:textSize="16sp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/etMobileno" />
<EditText
android:id="#+id/etCity"
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_marginTop="10dp"
android:background="#drawable/profile_background"
android:padding="10dp"
android:hint="#string/S_city"
android:textColor="#color/white"
android:textColorHint="#color/white"
android:textSize="16sp"
android:inputType="textCapWords"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/etAddress" />
<EditText
android:id="#+id/etPincode"
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_marginTop="10dp"
android:background="#drawable/profile_background"
android:padding="10dp"
android:hint="#string/pincode"
android:textColor="#color/white"
android:textColorHint="#color/white"
android:textSize="16sp"
android:inputType="number"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/etCity" />
<TextView
android:id="#+id/tvMandatory"
android:layout_width="match_parent"
android:layout_height="12dp"
android:layout_marginTop="10dp"
android:text="#string/mandatory"
android:textColor="#color/white"
android:textSize="10sp"
android:gravity="right"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#+id/etPincode" />
<de.hdodenhof.circleimageview.CircleImageView
android:id="#+id/ivProfile"
android:layout_width="80dp"
android:layout_height="80dp"
android:layout_marginTop="10dp"
android:src="#drawable/prof_img"
app:civ_border_color="#000"
app:civ_border_width="0.5dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toBottomOf="#+id/tvMandatory" />
<TextView
android:id="#+id/tvChoosePhoto"
android:layout_width="150dp"
android:layout_height="40dp"
android:layout_marginLeft="16dp"
android:background="#drawable/prof_cam"
android:gravity="center|left"
android:paddingLeft="#dimen/plus_15dp"
android:text="CHOOSE YOUR PHOTO"
android:textColor="#color/black"
android:textSize="10sp"
app:layout_constraintBottom_toBottomOf="#+id/ivProfile"
app:layout_constraintLeft_toRightOf="#+id/ivProfile"
app:layout_constraintTop_toTopOf="#+id/ivProfile" />
<TextView
android:id="#+id/tvClear"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="32dp"
android:gravity="center|left"
android:text="#string/clear"
android:textColor="#color/white"
app:layout_constraintBottom_toBottomOf="#+id/tvChoosePhoto"
app:layout_constraintLeft_toRightOf="#+id/tvChoosePhoto"
app:layout_constraintTop_toTopOf="#+id/tvChoosePhoto"
tools:ignore="MissingConstraints" />
</android.support.constraint.ConstraintLayout>
</ScrollView>
<Button
android:id="#+id/btUpdate"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/btn_update"
android:text="UPDATE"
android:layout_marginBottom="10dp"
android:textColor="#color/white"
android:layout_marginLeft="40dp"
android:layout_marginRight="40dp"
app:layout_constraintBottom_toBottomOf="parent"
/>
</android.support.constraint.ConstraintLayout>
This shows that I am using scrollview inside constraintlayout which has multiple edit texts and cannot focus second or any of other elements
You can use android:imeOptions="actionNext" to get focus on next EditText item in layout. I have used EditText( or AppCompatEditText) within ConstrainLayout in Scrollview, it working fine.
I am just new diving into Android app development world and created recently my first calculator app. When I run the app on the simulator, I saw a problem that there is a difference between the layout in the Preview mode and the one in the Simulator mode, as you can see below:
And here is my content_main.xml file:
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
tools:showIn="#layout/activity_main"
tools:context="com.example.sonduong.calculator.MainActivity">
<TextView
android:id="#+id/textView3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="of"
android:textSize="24sp"
tools:layout_editor_absoluteX="181dp"
tools:layout_editor_absoluteY="255dp" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="%"
android:textSize="24sp"
tools:layout_editor_absoluteX="300dp"
tools:layout_editor_absoluteY="207dp" />
<EditText
android:id="#+id/numberTxt"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:ems="10"
android:hint="Enter Number"
android:inputType="numberDecimal"
android:textAlignment="center"
tools:layout_editor_absoluteX="85dp"
tools:layout_editor_absoluteY="296dp" />
<TextView
android:id="#+id/totalTextView"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:text="0"
android:textAlignment="center"
android:textSize="36sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.101" />
<TextView
android:id="#+id/textView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="What is"
android:textSize="24sp"
tools:layout_editor_absoluteX="152dp"
tools:layout_editor_absoluteY="129dp" />
<EditText
android:id="#+id/percentageTxt"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:ems="10"
android:hint="Enter Percentage"
android:inputType="numberDecimal"
android:textAlignment="center"
tools:layout_editor_absoluteX="85dp"
tools:layout_editor_absoluteY="193dp" />
<Button
android:id="#+id/calcBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="CALCULATE"
tools:layout_editor_absoluteX="147dp"
tools:layout_editor_absoluteY="374dp" />
</android.support.constraint.ConstraintLayout>
However in this xml file I also got some errors and they look like:
Can anyone help me how can I adjust to have the same view between Preview and Simulator. Thank you!
Adjust According to your needs.
Replace your XML with this XML
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="#+id/textView3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="of"
android:textSize="24sp"
android:layout_marginLeft="8dp"
app:layout_constraintLeft_toLeftOf="parent"
android:layout_marginRight="8dp"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintHorizontal_bias="0.501"
android:layout_marginBottom="92dp"
app:layout_constraintBottom_toTopOf="#+id/numberTxt" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="%"
android:textSize="24sp"
android:layout_marginRight="8dp"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintBaseline_toBaselineOf="#+id/percentageTxt"
android:id="#+id/textView2" />
<EditText
android:id="#+id/numberTxt"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:ems="10"
android:hint="Enter Number"
android:inputType="numberDecimal"
android:textAlignment="center"
android:layout_marginLeft="8dp"
app:layout_constraintLeft_toLeftOf="parent"
android:layout_marginRight="8dp"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintHorizontal_bias="0.505"
android:layout_marginBottom="0dp"
app:layout_constraintBottom_toTopOf="#+id/calcBtn" />
<TextView
android:id="#+id/totalTextView"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:text="0"
android:textAlignment="center"
android:textSize="36sp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintHorizontal_bias="0.0"
android:layout_marginTop="8dp" />
<TextView
android:id="#+id/textView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="What is"
android:textSize="24sp"
android:layout_marginLeft="8dp"
app:layout_constraintLeft_toLeftOf="parent"
android:layout_marginRight="8dp"
app:layout_constraintRight_toRightOf="parent"
android:layout_marginTop="8dp"
app:layout_constraintTop_toBottomOf="#+id/totalTextView"
app:layout_constraintHorizontal_bias="0.502" />
<EditText
android:id="#+id/percentageTxt"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:ems="10"
android:hint="Enter Percentage"
android:inputType="numberDecimal"
android:textAlignment="center"
android:layout_marginLeft="8dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toLeftOf="#+id/textView2"
android:layout_marginRight="8dp"
app:layout_constraintHorizontal_bias="0.0"
android:layout_marginBottom="8dp"
app:layout_constraintBottom_toTopOf="#+id/textView3"
android:layout_marginTop="8dp"
app:layout_constraintTop_toBottomOf="#+id/textView" />
<Button
android:id="#+id/calcBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="CALCULATE"
android:layout_marginLeft="8dp"
app:layout_constraintLeft_toLeftOf="parent"
android:layout_marginRight="8dp"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
android:layout_marginBottom="9dp"
app:layout_constraintHorizontal_bias="0.502" />
ok , you need to use linear layout with weight to do this ,, try this code ..
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout android:layout_height="match_parent"
android:layout_width="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="vertical"
android:weightSum="7"
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools">
<TextView
android:id="#+id/textView3"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" android:text="of"
android:textSize="24sp"
tools:layout_editor_absoluteX="181dp"
tools:layout_editor_absoluteY="255dp" />
<TextView
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" android:text="%"
android:textSize="24sp"
tools:layout_editor_absoluteX="300dp"
tools:layout_editor_absoluteY="207dp" />
<EditText
android:id="#+id/numberTxt"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" android:ems="10"
android:hint="Enter Number"
android:inputType="numberDecimal"
android:textAlignment="center"
tools:layout_editor_absoluteX="85dp"
tools:layout_editor_absoluteY="296dp" />
<TextView
android:id="#+id/totalTextView"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_weight="1" android:text="0"
android:textAlignment="center"
android:textSize="36sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.101" />
<TextView
android:id="#+id/textView"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" android:text="What is"
android:textSize="24sp"
tools:layout_editor_absoluteX="152dp"
tools:layout_editor_absoluteY="129dp" />
<EditText
android:id="#+id/percentageTxt"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" android:ems="10"
android:hint="Enter Percentage"
android:inputType="numberDecimal"
android:textAlignment="center"
tools:layout_editor_absoluteX="85dp"
tools:layout_editor_absoluteY="193dp" />
<Button
android:id="#+id/calcBtn"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:text="CALCULATE"
tools:layout_editor_absoluteX="147dp"
tools:layout_editor_absoluteY="374dp" />
</LinearLayout>