Android: "duplicate attribute" error problem - android

I was making a simple calculator app design and mid-way I decided to test it. I though it was going to run without any errors however it shows an error like this:
C:\Users\mahir\AndroidStudioProjects\SimpleCalculatorappforstudents\app\src\main\res\layout\activity_main.xml:5: error: duplicate attribute.
C:\Users\mahir\AndroidStudioProjects\SimpleCalculatorappforstudents\app\src\main\res\layout\activity_main.xml: error: file failed to compile.
I have searched google to solve this problem however I am unable to arrive at a solution. This is my XML file:
<?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"
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<Button
android:id="#+id/number5"
android:layout_width="81dp"
android:layout_height="72dp"
android:text="5"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintHorizontal_bias="0.336"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.881" />
<Button
android:id="#+id/number4"
android:layout_width="81dp"
android:layout_height="72dp"
android:text="4"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintHorizontal_bias="0.027"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.881" />
<Button
android:id="#+id/number7"
android:layout_width="81dp"
android:layout_height="72dp"
android:text="7"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintHorizontal_bias="0.027"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="1.0" />
<Button
android:id="#+id/number8"
android:layout_width="81dp"
android:layout_height="72dp"
android:text="8"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintHorizontal_bias="0.336"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="1.0" />
<Button
android:id="#+id/number1"
android:layout_width="81dp"
android:layout_height="72dp"
android:text="1"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintHorizontal_bias="0.027"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.748" />
<Button
android:id="#+id/brackets"
android:layout_width="81dp"
android:layout_height="72dp"
android:text="( )"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintHorizontal_bias="0.951"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.749" />
<Button
android:id="#+id/number9"
android:layout_width="81dp"
android:layout_height="72dp"
android:text="9"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintHorizontal_bias="0.633"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="1.0" />
<Button
android:id="#+id/number6"
android:layout_width="81dp"
android:layout_height="72dp"
android:text="6"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintHorizontal_bias="0.633"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.881" />
<Button
android:id="#+id/multiply"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Multiply"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintHorizontal_bias="0.346"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.631" />
<Button
android:id="#+id/divide"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Divide"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintHorizontal_bias="0.972"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.631" />
<Button
android:id="#+id/add"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Add"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintHorizontal_bias="0.027"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.631" />
<Button
android:id="#+id/number2"
android:layout_width="81dp"
android:layout_height="72dp"
android:text="2"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintHorizontal_bias="0.336"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.749" />
<Button
android:id="#+id/number3"
android:layout_width="81dp"
android:layout_height="72dp"
android:text="3"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintHorizontal_bias="0.633"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.749" />
<Button
android:id="#+id/history"
android:layout_width="98dp"
android:layout_height="45dp"
android:background="#drawable/roundbutton"
android:text="History"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintHorizontal_bias="0.968"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.008" />
<Button
android:id="#+id/subtract"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Subtract"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintHorizontal_bias="0.661"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.631" />
I would gladly accept any help on this error. I am a beginner in Android development and I am using the latest Android Studio.

You have added the same line twice as an attribute within the ConstraintLayout.
xmlns:android="http://schemas.android.com/apk/res/android"
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android" (1st time)
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
xmlns:android="http://schemas.android.com/apk/res/android" (2nd time)
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">

Related

View overlapping on keyboard popup android in constraintlayout

Below is my xml
<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:id="#+id/parentLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#android:color/white"
tools:context="com.viewlift.views.fragments.LoginFragment">
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/nativeLoginContainer"
android:layout_width="0dp"
android:layout_height="wrap_content"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent">
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/emailFieldsContainer"
android:layout_width="0dp"
android:layout_height="wrap_content"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent">
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/emailContainer"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:background="#drawable/textfield_bg"
android:minHeight="40dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#+id/emailTitle">
<androidx.appcompat.widget.AppCompatEditText
android:id="#+id/email"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:background="#android:color/transparent"
android:hint="#string/enter_email"
android:inputType="textEmailAddress"
android:paddingStart="10dp"
android:paddingEnd="10dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
<androidx.appcompat.widget.AppCompatTextView
android:id="#+id/emailTitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="20dp"
android:background="#android:color/white"
android:gravity="center"
android:paddingStart="5dp"
android:paddingEnd="5dp"
android:text="#string/email"
android:textColor="#android:color/black"
android:textSize="14sp"
android:translationY="10dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/passwordFieldsContainer"
android:layout_width="0dp"
android:layout_height="wrap_content"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#+id/emailFieldsContainer">
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/passwordContainer"
android:layout_width="0dp"
android:layout_height="40dp"
android:background="#drawable/textfield_bg"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#+id/passwordTitle">
<com.google.android.material.textfield.TextInputLayout
android:id="#+id/passwordInputLayout"
android:layout_width="0dp"
android:layout_height="0dp"
app:boxBackgroundMode="none"
app:hintEnabled="false"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:passwordToggleEnabled="true">
<com.google.android.material.textfield.TextInputEditText
android:id="#+id/password"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#android:color/transparent"
android:hint="#string/enter_password"
android:inputType="textPassword"
android:padding="5dp"
android:textCursorDrawable="#drawable/custom_edit_text_cursor" />
</com.google.android.material.textfield.TextInputLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
<androidx.appcompat.widget.AppCompatTextView
android:id="#+id/passwordTitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="20dp"
android:background="#android:color/white"
android:gravity="center"
android:paddingStart="5dp"
android:paddingEnd="5dp"
android:text="#string/password"
android:textColor="#android:color/black"
android:textSize="14sp"
android:translationY="10dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/mobileFieldsContainer"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:visibility="gone"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#+id/passwordFieldsContainer">
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/countryCodeContainer"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:background="#drawable/textfield_bg"
android:minWidth="70dp"
app:layout_constraintBottom_toBottomOf="#+id/mobileContainer"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toTopOf="#+id/mobileContainer">
<androidx.appcompat.widget.AppCompatSpinner
android:id="#+id/countryCode"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginStart="5dp"
android:layout_marginEnd="5dp"
android:background="#null"
android:overlapAnchor="false"
android:spinnerMode="dialog"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toLeftOf="#+id/countryCodeArrow"
app:layout_constraintTop_toTopOf="parent" />
<androidx.appcompat.widget.AppCompatImageView
android:id="#+id/countryCodeArrow"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/triangle_down"
android:tint="#android:color/white"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/mobileContainer"
android:layout_width="0dp"
android:layout_height="40dp"
android:layout_marginStart="10dp"
android:background="#drawable/textfield_bg"
app:layout_constraintLeft_toRightOf="#+id/countryCodeContainer"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#+id/mobileTitle">
<androidx.appcompat.widget.AppCompatEditText
android:id="#+id/mobile"
android:layout_width="0dp"
android:layout_height="0dp"
android:background="#android:color/transparent"
android:hint="#string/enter_number"
android:inputType="number"
android:maxLength="10"
android:paddingStart="10dp"
android:paddingEnd="10dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
<androidx.appcompat.widget.AppCompatTextView
android:id="#+id/mobileTitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="20dp"
android:background="#android:color/white"
android:gravity="center"
android:paddingStart="5dp"
android:paddingEnd="5dp"
android:text="#string/mobile"
android:textColor="#android:color/black"
android:textSize="14sp"
android:translationY="10dp"
app:layout_constraintLeft_toRightOf="#+id/countryCodeContainer"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
<androidx.appcompat.widget.AppCompatTextView
android:id="#+id/forgotPassword"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:text="#string/app_cms_forgot_password_title"
android:textColor="#android:color/darker_gray"
android:textSize="12sp"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#+id/mobileFieldsContainer" />
<View
android:layout_width="0dp"
android:layout_height="1dp"
android:background="#android:color/darker_gray"
app:layout_constraintLeft_toLeftOf="#+id/forgotPassword"
app:layout_constraintRight_toRightOf="#+id/forgotPassword"
app:layout_constraintTop_toBottomOf="#+id/forgotPassword" />
<androidx.appcompat.widget.AppCompatCheckBox
android:id="#+id/terms"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:gravity="start|center_vertical"
android:text="#string/sign_up_tos_and_pp_text"
android:textColor="#android:color/black"
android:textSize="12sp"
android:visibility="gone"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#+id/forgotPassword" />
<androidx.appcompat.widget.AppCompatButton
android:id="#+id/signInButton"
android:layout_width="0dp"
android:layout_height="55dp"
android:layout_marginTop="20dp"
android:text="#string/signin_continue"
android:textColor="#android:color/white"
android:textSize="14sp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#+id/terms" />
</androidx.constraintlayout.widget.ConstraintLayout>
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/separator"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#+id/nativeLoginContainer">
<androidx.appcompat.widget.AppCompatTextView
android:id="#+id/orLabel"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/signin_other_account"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/socialLoginContainer"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginTop="20dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#+id/separator">
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/fbButtonContainer"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:background="#android:color/holo_blue_bright"
android:minHeight="55dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<androidx.appcompat.widget.AppCompatImageView
android:id="#+id/fbImg"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/login_facebook"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<androidx.appcompat.widget.AppCompatTextView
android:id="#+id/fbButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="5dp"
android:text="#string/login_facebook"
android:textColor="#color/facebookBlue"
app:layout_constraintBottom_toBottomOf="#+id/fbImg"
app:layout_constraintStart_toEndOf="#+id/fbImg"
app:layout_constraintTop_toTopOf="#+id/fbImg" />
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/googleButtonContainer"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:background="#android:color/holo_blue_bright"
android:minHeight="55dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/fbButtonContainer">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<androidx.appcompat.widget.AppCompatImageView
android:id="#+id/googleImg"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/login_google"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<androidx.appcompat.widget.AppCompatTextView
android:id="#+id/googleButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="5dp"
android:text="#string/login_google"
android:textColor="#color/googleRed"
app:layout_constraintBottom_toBottomOf="#+id/googleImg"
app:layout_constraintStart_toEndOf="#+id/googleImg"
app:layout_constraintTop_toTopOf="#+id/googleImg" />
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/mobileButtonContainer"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:background="#android:color/holo_blue_bright"
android:minHeight="55dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/googleButtonContainer">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<androidx.appcompat.widget.AppCompatImageView
android:id="#+id/mobileImg"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/login_mobile"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<androidx.appcompat.widget.AppCompatTextView
android:id="#+id/mobileButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="5dp"
android:text="#string/mobile"
android:textColor="#android:color/holo_green_dark"
app:layout_constraintBottom_toBottomOf="#+id/mobileImg"
app:layout_constraintStart_toEndOf="#+id/mobileImg"
app:layout_constraintTop_toTopOf="#+id/mobileImg" />
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
<androidx.appcompat.widget.AppCompatTextView
android:id="#+id/tveMsg"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginBottom="10dp"
android:gravity="center"
android:text="#string/tve_login_msg"
android:textColor="#android:color/white"
app:layout_constraintBottom_toTopOf="#+id/tveButtonContainer"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent" />
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/tveButtonContainer"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:background="#android:color/holo_blue_bright"
android:minHeight="55dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<androidx.appcompat.widget.AppCompatImageView
android:id="#+id/tveImg"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/login_tve"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<androidx.appcompat.widget.AppCompatTextView
android:id="#+id/tveButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="5dp"
android:text="#string/app_cms_tve_log_in"
android:textColor="#color/colorPrimary"
app:layout_constraintBottom_toBottomOf="#+id/tveImg"
app:layout_constraintStart_toEndOf="#+id/tveImg"
app:layout_constraintTop_toTopOf="#+id/tveImg" />
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
This is the output I have
Now when the keyboard is shown the bottom tv button overlaps with fb button
How can I fix this?
If you have a view with constraintBottom_toBottomOf="parent", add a parent scrolling container for your whole view. This should solve your issue.
This happens with keyboards and views having constraintBottom_toBottomOf always as the view only has remaining screen size above the keyboard and below the status bar, hence resulting in the view with constraintBottom_toBottomOf="parent" overlapping the view like you have.

rotating a constraintLayout and rotating constraints as well

I can visually show what I mean to do:
basically, something like:
app:layout_constraintBottom_toEndOf is Illegal
But, I'd like to know if there's a way to implement this sort of dynamic remapping of constraints that would in turn also rotate the views inside of the constraintLayout
I've used external library from https://github.com/rongi/rotate-layout It allows to rotate viewgroup's children.
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/root"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<LinearLayout
android:id="#+id/container"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginStart="16dp"
android:layout_marginTop="16dp"
android:layout_marginEnd="16dp"
android:layout_marginBottom="16dp"
android:background="#color/colorPrimaryDark"
android:gravity="center"
android:orientation="horizontal"
app:layout_constraintBottom_toTopOf="#+id/button2"
app:layout_constraintEnd_toStartOf="#+id/button3"
app:layout_constraintStart_toEndOf="#+id/button4"
app:layout_constraintTop_toBottomOf="#+id/button">
<TextView
android:id="#+id/text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#color/colorPrimary"
android:gravity="center"
android:text="#string/hello_string"
android:textSize="24sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</LinearLayout>
<Button
android:id="#+id/button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="8dp"
android:layout_marginBottom="8dp"
android:text="Button1"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.25"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.0" />
<Button
android:id="#+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="8dp"
android:layout_marginTop="8dp"
android:text="Button2"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.75"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.96" />
<Button
android:id="#+id/button3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="8dp"
android:layout_marginStart="8dp"
android:text="Button3"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.96"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<Button
android:id="#+id/button4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="8dp"
android:layout_marginEnd="8dp"
android:text="Button4"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.03"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/textCoord"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginTop="16dp"
android:layout_marginEnd="8dp"
android:text="TextView"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</android.support.constraint.ConstraintLayout>
Preview Child Not Rotated :
Preview Child Rotated

Android constraint layout changes it's appearance in Mobile

Layout is looking awesome but not in Mobile. How to overcome it!!!
tried to connect each view to parent separately, watched some tutorials to resolve the issue but it was not resolving the issue.I tried to connect each view with parent but it didn't resolved the issues in landscape mode.
<?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="#FF1E38C9"
tools:context=".MainActivity">
<EditText
android:id="#+id/UrlEditText"
android:layout_width="280dp"
android:layout_height="45dp"
android:background="#android:color/transparent"
android:ems="10"
android:hint="Search url"
android:inputType="textUri"
android:textAlignment="center"
android:textSize="25sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.045"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.001"
tools:text="www.google.com" />
<Button
android:id="#+id/DownloadButton"
android:layout_width="49dp"
android:layout_height="44dp"
android:background="#android:drawable/stat_sys_download_done"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.825"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.001" />
<Button
android:id="#+id/GoogleButton"
android:layout_width="92dp"
android:layout_height="41dp"
android:background="#FF09E0F8"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.843"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.371" />
<Button
android:id="#+id/FacebookButton"
android:layout_width="90dp"
android:layout_height="40dp"
android:background="#FF09E0F8"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.498"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.37" />
<Button
android:id="#+id/YoutubeButton"
android:layout_width="90dp"
android:layout_height="40dp"
android:background="#FF09E0F8"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.177"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.369" />
<Button
android:id="#+id/GmailButton"
android:layout_width="90dp"
android:layout_height="40dp"
android:layout_marginStart="8dp"
android:layout_marginLeft="8dp"
android:layout_marginTop="8dp"
android:layout_marginEnd="8dp"
android:layout_marginRight="8dp"
android:layout_marginBottom="8dp"
android:background="#FF09E0F8"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.169"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.538" />
<Button
android:id="#+id/InstagramButton"
android:layout_width="90dp"
android:layout_height="40dp"
android:background="#FF09E0F8"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.499"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.536" />
<Button
android:id="#+id/TwitterButton"
android:layout_width="90dp"
android:layout_height="40dp"
android:background="#FF09E0F8"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.843"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.536" />
</android.support.constraint.ConstraintLayout>
I was expecting same results as they were in Android studio
please notice that in both of your answer and question you are using fixed sizes on your view and that will not make your screen responsive to all screen size(you will keep seeing your problem in the future).
I agree that you can use guidelines, but don't use them with fixed size, use them like this :
<?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">
<EditText
android:id="#+id/UrlEditText"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:layout_marginEnd="8dp"
android:layout_marginBottom="8dp"
android:background="#android:color/transparent"
android:ems="10"
android:hint="Search url"
android:inputType="textUri"
android:textAlignment="center"
android:textSize="25sp"
app:layout_constraintBottom_toTopOf="#+id/guideline5"
app:layout_constraintEnd_toStartOf="#+id/guideline3"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
tools:text="www.google.com" />
<Button
android:id="#+id/DownloadButton"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:layout_marginEnd="8dp"
android:layout_marginBottom="8dp"
android:background="#android:drawable/stat_sys_download_done"
app:layout_constraintBottom_toTopOf="#+id/guideline5"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="#+id/guideline3"
app:layout_constraintTop_toTopOf="parent" />
<Button
android:id="#+id/GoogleButton"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="#+id/FacebookButton"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toEndOf="#+id/FacebookButton"
app:layout_constraintTop_toTopOf="#+id/FacebookButton" />
<Button
android:id="#+id/FacebookButton"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginTop="8dp"
android:layout_marginBottom="8dp"
app:layout_constraintBottom_toTopOf="#+id/guideline4"
app:layout_constraintEnd_toStartOf="#+id/GoogleButton"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toEndOf="#+id/YoutubeButton"
app:layout_constraintTop_toTopOf="#+id/guideline6" />
<Button
android:id="#+id/YoutubeButton"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="#+id/FacebookButton"
app:layout_constraintEnd_toStartOf="#+id/FacebookButton"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintHorizontal_chainStyle="packed"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="#+id/FacebookButton" />
<Button
android:id="#+id/GmailButton"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="#+id/InstagramButton"
app:layout_constraintEnd_toStartOf="#+id/InstagramButton"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="#+id/InstagramButton" />
<Button
android:id="#+id/InstagramButton"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginTop="8dp"
android:layout_marginBottom="8dp"
app:layout_constraintBottom_toTopOf="#+id/guideline7"
app:layout_constraintEnd_toStartOf="#+id/TwitterButton"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toEndOf="#+id/GmailButton"
app:layout_constraintTop_toTopOf="#+id/guideline4" />
<Button
android:id="#+id/TwitterButton"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="#+id/InstagramButton"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toEndOf="#+id/InstagramButton"
app:layout_constraintTop_toTopOf="#+id/InstagramButton" />
<androidx.constraintlayout.widget.Guideline
android:id="#+id/guideline3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
app:layout_constraintGuide_percent="0.8" />
<androidx.constraintlayout.widget.Guideline
android:id="#+id/guideline4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintGuide_percent="0.6" />
<androidx.constraintlayout.widget.Guideline
android:id="#+id/guideline5"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintGuide_percent="0.1" />
<androidx.constraintlayout.widget.Guideline
android:id="#+id/guideline7"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintGuide_percent="0.7" />
<androidx.constraintlayout.widget.Guideline
android:id="#+id/guideline6"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintGuide_percent="0.5" />
</androidx.constraintlayout.widget.ConstraintLayout>
It will look something like this (the top right corner view is there but with no background so in the picture you can`t notice him):
Use horizontal guidelines to limit views/buttons to a particular area and add chains by selecting each horizontal(left to right) view and then cycle chains(a button appearing at bottom of the current view) to change the gap in between.
Visit Official site for more
https://developer.android.com/training/constraint-layout#constrain-chain
And you can follow this tutorial as well. Goodluck!!!
https://www.youtube.com/watch?v=hqEfshM5Vfw
Hope it will help beginners
<?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="#drawable/backgroundhomescreen"
tools:context=".MainActivity">
<EditText
android:id="#+id/UrlEditText"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginStart="8dp"
android:layout_marginLeft="8dp"
android:layout_marginTop="8dp"
android:layout_marginBottom="8dp"
android:background="#android:color/transparent"
android:ems="10"
android:hint="Search url"
android:inputType="textUri"
android:textAlignment="center"
android:textSize="25sp"
app:layout_constraintBottom_toTopOf="#+id/guideline"
app:layout_constraintEnd_toStartOf="#+id/DownloadButton"
app:layout_constraintHorizontal_bias="1.0"
app:layout_constraintHorizontal_chainStyle="spread"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="1.0"
tools:text="www.google.com" />
<Button
android:id="#+id/DownloadButton"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginStart="8dp"
android:layout_marginLeft="8dp"
android:layout_marginTop="16dp"
android:layout_marginEnd="8dp"
android:layout_marginRight="8dp"
android:layout_marginBottom="8dp"
android:background="#android:drawable/stat_sys_download_done"
app:layout_constraintBottom_toTopOf="#+id/guideline"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="#+id/guidelinevert"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="1.0" />
<Button
android:id="#+id/GoogleButton"
android:layout_width="92dp"
android:layout_height="41dp"
android:layout_marginTop="8dp"
android:layout_marginBottom="8dp"
android:background="#drawable/google"
app:layout_constraintBottom_toTopOf="#+id/guideline4"
app:layout_constraintEnd_toStartOf="#+id/InstagramButton"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="#+id/guideline3" />
<Button
android:id="#+id/FacebookButton"
android:layout_width="90dp"
android:layout_height="40dp"
android:layout_marginTop="8dp"
android:layout_marginBottom="8dp"
android:background="#drawable/facebook"
app:layout_constraintBottom_toTopOf="#+id/guideline3"
app:layout_constraintEnd_toStartOf="#+id/YoutubeButton"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toEndOf="#+id/GmailButton"
app:layout_constraintTop_toTopOf="#+id/guideline2" />
<Button
android:id="#+id/YoutubeButton"
android:layout_width="90dp"
android:layout_height="40dp"
android:layout_marginTop="8dp"
android:layout_marginBottom="8dp"
android:background="#drawable/youtube"
app:layout_constraintBottom_toTopOf="#+id/guideline3"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toEndOf="#+id/FacebookButton"
app:layout_constraintTop_toTopOf="#+id/guideline2" />
<Button
android:id="#+id/GmailButton"
android:layout_width="90dp"
android:layout_height="40dp"
android:layout_marginTop="8dp"
android:layout_marginBottom="8dp"
android:background="#drawable/gmail"
app:layout_constraintBottom_toTopOf="#+id/guideline3"
app:layout_constraintEnd_toStartOf="#+id/FacebookButton"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintHorizontal_chainStyle="spread"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="#+id/guideline2" />
<Button
android:id="#+id/InstagramButton"
android:layout_width="90dp"
android:layout_height="40dp"
android:layout_marginTop="8dp"
android:layout_marginBottom="8dp"
android:background="#drawable/instagram"
app:layout_constraintBottom_toTopOf="#+id/guideline4"
app:layout_constraintEnd_toStartOf="#+id/TwitterButton"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toEndOf="#+id/GoogleButton"
app:layout_constraintTop_toTopOf="#+id/guideline3" />
<Button
android:id="#+id/TwitterButton"
android:layout_width="90dp"
android:layout_height="40dp"
android:layout_marginTop="8dp"
android:layout_marginBottom="8dp"
android:background="#drawable/twitter"
app:layout_constraintBottom_toTopOf="#+id/guideline4"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toEndOf="#+id/InstagramButton"
app:layout_constraintTop_toTopOf="#+id/guideline3" />
<android.support.constraint.Guideline
android:id="#+id/guidelinevert"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
app:layout_constraintGuide_percent="0.84" />
<android.support.constraint.Guideline
android:id="#+id/guideline"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintGuide_begin="61dp" />
<android.support.constraint.Guideline
android:id="#+id/guideline2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintGuide_begin="192dp" />
<android.support.constraint.Guideline
android:id="#+id/guideline3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintGuide_begin="277dp" />
<android.support.constraint.Guideline
android:id="#+id/guideline4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintGuide_begin="365dp" />
</android.support.constraint.ConstraintLayout>

Evenly spaced (full height) menu using Constraint Layout

I have searched Android site and on here, but for the life of me, I can't seem to figure out how to get a full screen menu without spaces. I've checked margins, padding, etc. I've used percentages for guidelines too, but still have spacing between my buttons. Can anyone help? All of my buttons are set to zero db as well.
<?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:layout_editor_absoluteY="25dp"
tools:layout_editor_absoluteX="0dp">
<Button
android:id="#+id/button5"
android:layout_width="0dp"
android:layout_height="0dp"
android:backgroundTint="#66bb6a"
android:elevation="0dp"
android:onClick="startFlashcardA"
android:text=" Flashcards"
android:textAlignment="viewStart"
android:textColor="#android:color/white"
android:textSize="24sp"
android:textStyle="bold"
app:layout_constraintBottom_toTopOf="#+id/guideline22"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.0"/>
<Button
android:id="#+id/button"
android:layout_width="0dp"
android:layout_height="0dp"
android:backgroundTint="#android:color/holo_purple"
android:elevation="0dp"
android:onClick="startVideoA"
android:padding="0dp"
android:text=" Videos"
android:textAlignment="viewStart"
android:textColor="#android:color/white"
android:textSize="24sp"
android:textStyle="bold"
app:layout_constraintBottom_toTopOf="#+id/guideline27"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="#id/guideline22"
app:layout_constraintVertical_bias="0.0"
/>
<Button
android:id="#+id/button6"
android:layout_width="0dp"
android:layout_height="125dp"
android:backgroundTint="#f06292"
android:onClick="startSoundsMenu"
android:text=" Letter Sounds"
android:textAlignment="viewStart"
android:textColor="#android:color/white"
android:textSize="24sp"
android:textStyle="bold"
app:layout_constraintBottom_toTopOf="#+id/guideline28"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="#+id/guideline27"
app:layout_constraintVertical_bias="0.0"/>
<Button
android:id="#+id/button2"
android:layout_width="0dp"
android:layout_height="0dp"
android:backgroundTint="#android:color/holo_blue_dark"
android:text=" About Mr. Pea"
android:textAlignment="viewStart"
android:textColor="#android:color/white"
android:textSize="24sp"
android:textStyle="bold"
app:layout_constraintBottom_toBottomOf="#+id/guideline29"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="#+id/guideline28"
app:layout_constraintVertical_bias="0.0"/>
<android.support.constraint.Guideline
android:id="#+id/guideline22"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintGuide_percent="0.2"
tools:layout_editor_absoluteY="114dp"
tools:layout_editor_absoluteX="0dp"/>
<android.support.constraint.Guideline
android:id="#+id/guideline27"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintGuide_percent="0.4"
tools:layout_editor_absoluteY="227dp"
tools:layout_editor_absoluteX="0dp"/>
<android.support.constraint.Guideline
android:id="#+id/guideline28"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintGuide_percent="0.6"
tools:layout_editor_absoluteY="340dp"
tools:layout_editor_absoluteX="0dp"/>
<android.support.constraint.Guideline
android:id="#+id/guideline29"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintGuide_percent="0.8"
tools:layout_editor_absoluteY="454dp"
tools:layout_editor_absoluteX="0dp"/>
<Button
android:id="#+id/button4"
android:layout_width="0dp"
android:layout_height="0dp"
android:backgroundTint="#887c5a"
android:text=" Contributions"
android:textAlignment="viewStart"
android:textColor="#android:color/white"
android:textSize="24sp"
android:textStyle="bold"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#+id/guideline29"
app:layout_constraintVertical_bias="0.0"/>
</android.support.constraint.ConstraintLayout>
No guidelines necessary. Just make a chain well-connected in both directions. You may want to correct the padding of button.
<?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:layout_editor_absoluteX="0dp"
tools:layout_editor_absoluteY="25dp">
<Button
android:id="#+id/button5"
android:layout_width="0dp"
android:layout_height="0dp"
android:backgroundTint="#66bb6a"
android:elevation="0dp"
android:onClick="startFlashcardA"
android:text=" Flashcards"
android:textAlignment="viewStart"
android:textColor="#android:color/white"
android:textSize="24sp"
android:textStyle="bold"
app:layout_constraintBottom_toTopOf="#+id/button"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.0" />
<Button
android:id="#+id/button"
android:layout_width="0dp"
android:layout_height="0dp"
android:backgroundTint="#android:color/holo_purple"
android:elevation="0dp"
android:onClick="startVideoA"
android:padding="0dp"
android:text=" Videos"
android:textAlignment="viewStart"
android:textColor="#android:color/white"
android:textSize="24sp"
android:textStyle="bold"
app:layout_constraintBottom_toTopOf="#+id/button6"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#id/button5"
app:layout_constraintVertical_bias="0.0" />
<Button
android:id="#+id/button6"
android:layout_width="0dp"
android:layout_height="0dp"
android:backgroundTint="#f06292"
android:onClick="startSoundsMenu"
android:text=" Letter Sounds"
android:textAlignment="viewStart"
android:textColor="#android:color/white"
android:textSize="24sp"
android:textStyle="bold"
app:layout_constraintBottom_toTopOf="#+id/button2"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#+id/button"
app:layout_constraintVertical_bias="0.0" />
<Button
android:id="#+id/button2"
android:layout_width="0dp"
android:layout_height="0dp"
android:backgroundTint="#android:color/holo_blue_dark"
android:text=" About Mr. Pea"
android:textAlignment="viewStart"
android:textColor="#android:color/white"
android:textSize="24sp"
android:textStyle="bold"
app:layout_constraintBottom_toTopOf="#+id/button4"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#+id/button6"
app:layout_constraintVertical_bias="0.0" />
<Button
android:id="#+id/button4"
android:layout_width="0dp"
android:layout_height="0dp"
android:backgroundTint="#887c5a"
android:text=" Contributions"
android:textAlignment="viewStart"
android:textColor="#android:color/white"
android:textSize="24sp"
android:textStyle="bold"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#+id/button2"
app:layout_constraintVertical_bias="0.0" />
</android.support.constraint.ConstraintLayout>

Keep view the same on all devices

How can I change my activities xml file so that the view stays the same regardless of the size of the screen. What I mean is the location in which the buttons or text is. I want it to stay relatively the same distance and everything. How would I do that? Would relative layout work for that or do is there something else that I would have to do in order for the view to be the same on all devices?
XML file:
<?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="com.example.navjeevenmann.mytycoon.MainActivity">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar2"
android:layout_width="0dp"
android:layout_height="59dp"
android:background="#2C3AAD"
android:minHeight="?attr/actionBarSize"
android:theme="?attr/actionBarTheme"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintHorizontal_bias="1.0"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="1.0" />
<TextView
android:id="#+id/textView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:text=""
android:textColor="#000"
android:textSize="25sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintHorizontal_bias="0.21"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.01999998" />
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text=""
android:textColor="#000"
android:textSize="25sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintHorizontal_bias="0.8"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.02" />
<ImageButton
android:id="#+id/button"
android:layout_width="247dp"
android:layout_height="243dp"
android:background="#0000"
android:src="#drawable/opengraph"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintHorizontal_bias="0.503"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<ImageButton
android:id="#+id/autoclick"
android:layout_width="49dp"
android:layout_height="47dp"
android:src="#drawable/cursor"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintHorizontal_bias="0.9"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.991" />
<ImageButton
android:id="#+id/imageview"
android:layout_width="62dp"
android:layout_height="58dp"
android:adjustViewBounds="true"
android:background="#2c3aad"
android:maxHeight="62dp"
android:maxWidth="5dp"
android:scaleType="fitXY"
android:src="#drawable/home"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="1.0" />
<ImageButton
android:id="#+id/singleclick"
android:layout_width="47dp"
android:layout_height="47dp"
android:background="#2C3AAD"
android:src="#drawable/singlecursor"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintHorizontal_bias="0.1"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.99" />
<ImageButton
android:id="#+id/imageButton2"
android:src="#drawable/notes"
android:layout_width="47dp"
android:layout_height="49dp"
android:adjustViewBounds="true"
android:maxHeight="62dp"
android:maxWidth="5dp"
android:scaleType="fitXY"
android:background="#null"
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.0"
app:layout_constraintHorizontal_bias="0.047" />
<TextView
android:id="#+id/textView5"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text=""
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.100000024" />
You could use layout percentage if you want it to be same in other devices. Here are links that you could use for reference Percentage layout and Percent Relative Layout

Categories

Resources