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>
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.
In this fragment as soon as try to scroll the contents start overlapping on each other.
This fragment opens immediately after a Splash Screen Activity. when I try to input something in first edit text and then scroll at that time all the things overlap on each other. The overlapping takes place only when I try to scroll. Please Help
<?xml version="1.0" encoding="utf-8"?>
<ScrollView
android:id="#+id/scrollView_login"
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"
tools:context=".LoginFragment"
android:layout_height="match_parent"
android:layout_width="match_parent">
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/layout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="#+id/textView3"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/MarginTop"
android:text="#string/app_name"
android:textAlignment="center"
android:textAppearance="#style/TextAppearance.AppCompat.Large"
android:textSize="30sp"
android:textStyle="bold"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<ImageView
android:id="#+id/imageView"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_marginTop="20dp"
android:src="#drawable/ic_launch"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/textView3" />
<TextView
android:id="#+id/tagline"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:text="#string/tagline"
android:textStyle="bold"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/imageView" />
<TextView
android:id="#+id/login"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="32dp"
android:text="#string/Candidate_login"
android:textColor="#000000"
android:textSize="18dp"
android:textStyle="bold"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/tagline" />
<TextView
android:id="#+id/email"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="56dp"
android:layout_marginTop="24dp"
android:text="#string/email"
android:textColor="#000000"
android:textSize="16dp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/login" />
<EditText
android:id="#+id/emailmobile"
android:layout_width="300dp"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:background="#color/White"
android:hint="Enter Email"
android:inputType="textEmailAddress"
android:padding="5dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/email" />
<TextView
android:id="#+id/password"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="56dp"
android:layout_marginTop="24dp"
android:text="#string/pass"
android:textColor="#000000"
android:textSize="16dp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/emailmobile" />
<EditText
android:id="#+id/passedit"
android:layout_width="300dp"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:background="#color/White"
android:hint="#string/pass"
android:inputType="textPassword"
android:padding="5dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.504"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/password" />
<Button
android:id="#+id/log_in"
android:layout_width="300dp"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:background="#color/colorPrimaryDark"
android:padding="5dp"
android:text="#string/login"
android:textColor="#color/White"
android:textSize="18dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/passedit" />
<TextView
android:id="#+id/textView6"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="18dp"
android:text="#string/forget_pass"
android:textColor="#color/colorPrimaryDark"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/log_in" />
<LinearLayout
android:id="#+id/sign"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="13dp"
android:gravity="center_horizontal"
android:orientation="horizontal"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/textView6">
<TextView
android:id="#+id/textView7"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/NoAccount" />
<TextView
android:id="#+id/textViewSignUp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="3dp"
android:text="#string/signup"
android:textColor="#color/colorPrimaryDark" />
</LinearLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
</ScrollView>
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
This is my first time programming in android studio and I need help in figuring out how to compare options selected by the user based on the radio buttons and query an api to pull data from a website. Below is the code of the layout.The results are supposed to be displayed on another page, thank you.
<?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="#0663ba"
tools:context=".MainActivity"
tools:layout_editor_absoluteY="81dp">
<Button
android:id="#+id/button"
android:layout_width="88dp"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:layout_marginEnd="8dp"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:background="#000000"
android:text="#string/search"
android:textColor="#FFFFFF"
android:textSize="18sp"
android:textStyle="bold"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/editText3" />
<EditText
android:id="#+id/editText"
android:layout_width="172dp"
android:layout_height="50dp"
android:layout_marginBottom="32dp"
android:layout_marginEnd="8dp"
android:layout_marginStart="8dp"
android:ems="10"
android:hint="#string/zip_code"
android:inputType="textPostalAddress"
app:layout_constraintBottom_toTopOf="#+id/textView2"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.04"
app:layout_constraintStart_toStartOf="parent"
tools:ignore="MissingConstraints" />
<TextView
android:id="#+id/textView2"
android:layout_width="175dp"
android:layout_height="44dp"
android:layout_marginBottom="48dp"
android:layout_marginStart="8dp"
android:fontFamily="sans-serif"
android:text="#string/select_date_range"
android:textAppearance="#style/TextAppearance.AppCompat"
android:textColor="#FFFFFF"
android:textSize="20sp"
android:textStyle="bold"
app:layout_constraintBottom_toTopOf="#+id/textView3"
app:layout_constraintStart_toStartOf="parent" />
<RadioGroup
android:id="#+id/radioGroup6"
android:layout_width="144dp"
android:layout_height="0dp"
android:layout_marginBottom="14dp"
android:layout_marginEnd="8dp"
android:layout_marginStart="8dp"
android:textColor="#FFFFFF"
android:textStyle="bold"
app:layout_constraintBottom_toTopOf="#+id/radioGroup7"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="#+id/textView2"
app:layout_constraintTop_toBottomOf="#+id/imageButton">
<RadioButton
android:id="#+id/radioButton8"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:checked="true"
android:text="#string/_1_week"
android:textColor="#FFFFFF"
android:textSize="18sp" />
<RadioButton
android:id="#+id/radioButton9"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:text="#string/_2_weeks"
android:textColor="#FFFFFF"
android:textSize="18sp" />
<RadioButton
android:id="#+id/radioButton7"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:text="#string/_3_months"
android:textColor="#FFFFFF"
android:textSize="18sp" />
</RadioGroup>
<TextView
android:id="#+id/textView3"
android:layout_width="wrap_content"
android:layout_height="44dp"
android:layout_marginBottom="28dp"
android:layout_marginStart="16dp"
android:text="#string/select_crime_type"
android:textAppearance="#style/TextAppearance.AppCompat"
android:textColor="#FFFFFF"
android:textSize="20sp"
android:textStyle="bold"
app:layout_constraintBottom_toTopOf="#+id/textView4"
app:layout_constraintStart_toStartOf="parent" />
<RadioGroup
android:id="#+id/radioGroup7"
android:layout_width="144dp"
android:layout_height="0dp"
android:layout_marginBottom="11dp"
android:layout_marginEnd="8dp"
android:layout_marginStart="8dp"
android:textColor="#FFFFFF"
android:textStyle="bold"
app:layout_constraintBottom_toTopOf="#+id/textView4"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="#+id/textView3"
app:layout_constraintTop_toBottomOf="#+id/radioGroup6">
<RadioButton
android:id="#+id/radioButton13"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="#string/rape"
android:textColor="#FFFFFF"
android:textSize="18sp" />
<RadioButton
android:id="#+id/radioButton15"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="#string/assault"
android:textColor="#FFFFFF"
android:textSize="18sp" />
<RadioButton
android:id="#+id/radioButton14"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:checked="true"
android:text="#string/murder"
android:textColor="#FFFFFF"
android:textSize="18sp" />
</RadioGroup>
<TextView
android:id="#+id/textView4"
android:layout_width="wrap_content"
android:layout_height="32dp"
android:layout_marginBottom="8dp"
android:layout_marginEnd="33dp"
android:text="#string/search_for_criminal_or_victim"
android:textAlignment="viewStart"
android:textAppearance="#style/TextAppearance.AppCompat"
android:textColor="#FFFFFF"
android:textSize="20sp"
android:textStyle="bold"
app:layout_constraintBottom_toTopOf="#+id/editText3"
app:layout_constraintEnd_toEndOf="#+id/radioGroup7"
app:layout_constraintTop_toBottomOf="#+id/radioGroup7" />
<EditText
android:id="#+id/editText3"
android:layout_width="195dp"
android:layout_height="45dp"
android:layout_marginBottom="66dp"
android:layout_marginEnd="8dp"
android:layout_marginStart="8dp"
android:ems="10"
android:hint="#string/enter_full_name"
android:inputType="textPersonName"
android:textColor="#FFFFFF"
android:textSize="24sp"
android:textStyle="bold"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.502"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/textView4" />
<ImageButton
android:id="#+id/imageButton"
android:layout_width="wrap_content"
android:layout_height="147dp"
android:layout_marginBottom="76dp"
android:layout_marginEnd="8dp"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:backgroundTint="#a91818"
android:scaleType="fitCenter"
android:src="#drawable/new_crime_img"
android:visibility="visible"
app:layout_constraintBottom_toTopOf="#+id/radioGroup6"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.0" />
</android.support.constraint.ConstraintLayout>