I am developing an Android app for a tablet, and the app will be in Hebrew language which Right to Left, when i create a layout for ldrtl it creates it well, and when I create a xlarge layout it also creates it will ( I can see it in the design mode big), but when I try to create a ldrtl-xlarge layout, it just makes it ldrtl, but not really xlarge( it still the regular size view)!
anyone have any ideas?
<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.raghdak.wardm.smartcourierclient.newShipmentActivity">
<Button
android:id="#+id/btnBack"
android:layout_width="114dp"
android:layout_height="wrap_content"
android:layout_marginBottom="40dp"
android:layout_marginEnd="16dp"
android:text="#string/btnBack"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent" />
<CheckBox
android:id="#+id/urgentCheckBox"
android:layout_width="97dp"
android:layout_height="32dp"
android:layout_marginStart="36dp"
android:layout_marginTop="28dp"
android:text="#string/urgent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/dueDateText"
android:layout_width="94dp"
android:layout_height="35dp"
android:layout_marginStart="36dp"
android:layout_marginTop="16dp"
android:text="#string/dueDate"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/urgentCheckBox" />
<TextView
android:id="#+id/claimantText"
android:layout_width="92dp"
android:layout_height="39dp"
android:layout_marginStart="40dp"
android:layout_marginTop="20dp"
android:text="#string/claimant"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/dueDateText" />
<EditText
android:id="#+id/claimantEditText"
android:layout_width="217dp"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:layout_marginEnd="8dp"
android:layout_marginStart="8dp"
android:layout_marginTop="124dp"
android:ems="10"
android:inputType="textPersonName"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.887"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.021" />
<EditText
android:id="#+id/dueDateEditText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:layout_marginEnd="8dp"
android:layout_marginStart="8dp"
android:layout_marginTop="76dp"
android:ems="10"
android:inputType="date"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.888"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.0" />
<TextView
android:id="#+id/addressText"
android:layout_width="88dp"
android:layout_height="38dp"
android:layout_marginStart="44dp"
android:layout_marginTop="24dp"
android:text="#string/address"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/claimantText" />
<EditText
android:id="#+id/addressEditText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:layout_marginEnd="8dp"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:ems="10"
android:inputType="textPersonName"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.888"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/claimantEditText"
app:layout_constraintVertical_bias="0.033" />
<TextView
android:id="#+id/nameText"
android:layout_width="84dp"
android:layout_height="34dp"
android:layout_marginStart="48dp"
android:layout_marginTop="20dp"
android:text="#string/receiverName"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/addressText" />
<EditText
android:id="#+id/nameEditText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:layout_marginEnd="8dp"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:ems="10"
android:inputType="textPersonName"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.888"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/addressEditText"
app:layout_constraintVertical_bias="0.019" />
<TextView
android:id="#+id/phoneText"
android:layout_width="83dp"
android:layout_height="27dp"
android:layout_marginStart="48dp"
android:layout_marginTop="24dp"
android:text="#string/phone"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/nameText" />
<EditText
android:id="#+id/phoneEditText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:layout_marginEnd="8dp"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:ems="10"
android:inputType="textPersonName"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.888"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/nameEditText"
app:layout_constraintVertical_bias="0.0" />
<TextView
android:id="#+id/poboxText"
android:layout_width="80dp"
android:layout_height="29dp"
android:layout_marginStart="52dp"
android:layout_marginTop="20dp"
android:text="#string/pobox"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/phoneText" />
<EditText
android:id="#+id/poboxEditText"
android:layout_width="215dp"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:layout_marginEnd="8dp"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:ems="10"
android:inputType="textPersonName"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.888"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/phoneEditText"
app:layout_constraintVertical_bias="0.071" />
<Button
android:id="#+id/btnSave"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="40dp"
android:layout_marginStart="44dp"
android:text="#string/save"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent" />
images:
ldrtl
xlarge
ldrtl-xlarge
After searching I found that this is an Android Studio issue, the best solution is to create the layout regular as ldtrl, and then simply in the android studio Design mode catch the right bottom edge of the screen and then too many resize options will appear choose which one you want buy dragging the screen to the relevant place, this thing will create a custom ldrtl layout (in my case custom ldrtl-xlarge layout), and you can still work with it as a really big screen with right to left language direction.
Related
I'm using constraintlayout and I have an activity that is a user profile. and it includes a picture of user. when I code xml layout. I can see the picture in preview window inside android studio the image is a png image. I have tried changing the image to one of the android studio avatar. still doesn't work. however, when I run the app the picture is not displaying. does anyone know why this happen?
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/profileBackground">
<android.support.constraint.ConstraintLayout
android:id="#+id/constraintLayout"
android:layout_width="match_parent"
android:layout_height="200dp"
android:layout_marginBottom="8dp"
android:background="#drawable/bacround_gradient"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.001">
<TextView
android:id="#+id/name_textview"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginTop="72dp"
android:layout_marginEnd="8dp"
android:fontFamily="sans-serif-condensed-medium"
android:text="Amanda Bozquet"
android:textAlignment="center"
android:textColor="#color/headerTextColor"
android:textSize="25sp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.497"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</android.support.constraint.ConstraintLayout>
<ImageView
android:id="#+id/user_imageview"
android:layout_width="126dp"
android:layout_height="109dp"
android:layout_marginStart="8dp"
android:layout_marginTop="144dp"
android:layout_marginEnd="8dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.498"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
tools:src="#drawable/prifile_pic" />
<android.support.constraint.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="20dp"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:layout_marginEnd="8dp"
android:layout_marginBottom="8dp"
android:paddingBottom="20dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="1.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/user_imageview"
app:layout_constraintVertical_bias="0.275">
<TextView
android:id="#+id/occupation_textview"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginEnd="8dp"
android:text="Marine Biologist"
android:textSize="20sp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/workplace_textview"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginEnd="8dp"
android:text="Key Biscaine National Park"
android:textSize="18sp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.497"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/occupation_textview" />
<TextView
android:id="#+id/state_textview"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginEnd="8dp"
android:text="FL, USA"
android:textSize="18sp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.497"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/workplace_textview" />
<LinearLayout
android:id="#+id/linearLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginTop="24dp"
android:layout_marginEnd="8dp"
android:orientation="horizontal"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="#+id/state_textview">
<ImageView
android:id="#+id/email_imageview"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginTop="40dp"
android:layout_marginEnd="8dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.126"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/state_textview"
app:srcCompat="#drawable/ic_mail_black_24dp" />
<TextView
android:id="#+id/email_textview"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginTop="40dp"
android:layout_marginEnd="8dp"
android:text="abozquet#biscainepark.org"
android:textSize="18sp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.031"
app:layout_constraintStart_toEndOf="#+id/email_imageview"
app:layout_constraintTop_toBottomOf="#+id/state_textview" />
</LinearLayout>
<LinearLayout
android:id="#+id/linearLayout2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:layout_marginEnd="8dp"
android:orientation="horizontal"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/linearLayout">
<ImageView
android:id="#+id/phone_imageview"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginTop="20dp"
android:layout_marginEnd="8dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.126"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/email_imageview"
app:srcCompat="#drawable/ic_local_phone_black_24dp" />
<TextView
android:id="#+id/phone_textview"
android:layout_width="239dp"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginTop="20dp"
android:layout_marginEnd="184dp"
android:text="1 (786) 352-2254"
android:textSize="18sp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.031"
app:layout_constraintStart_toEndOf="#+id/phone_imageview"
app:layout_constraintTop_toBottomOf="#+id/email_textview" />
</LinearLayout>
<LinearLayout
android:id="#+id/linearLayout3"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:layout_marginEnd="8dp"
android:orientation="horizontal"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/linearLayout2">
<ImageView
android:id="#+id/video_imageview"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginTop="20dp"
android:layout_marginEnd="8dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.126"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/phone_imageview"
app:srcCompat="#drawable/ic_videocam_white_24dp" />
<TextView
android:id="#+id/video_textview"
android:layout_width="242dp"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginTop="20dp"
android:layout_marginEnd="184dp"
android:text="1 (786) 352-2254"
android:textSize="18sp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.031"
app:layout_constraintStart_toEndOf="#+id/video_imageview"
app:layout_constraintTop_toBottomOf="#+id/phone_textview" />
</LinearLayout>
<LinearLayout
android:id="#+id/linearLayout4"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:layout_marginEnd="8dp"
android:orientation="horizontal"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/linearLayout3">
<ImageView
android:id="#+id/facebook_imageview"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginTop="20dp"
android:layout_marginEnd="8dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.126"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/video_textview"
app:srcCompat="#drawable/ic_icon_facebook" />
<TextView
android:id="#+id/facebook_textview"
android:layout_width="336dp"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginTop="20dp"
android:layout_marginEnd="184dp"
android:text="http://facebook.com/amandab"
android:textSize="18sp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.031"
app:layout_constraintStart_toEndOf="#+id/facebook_imageview"
app:layout_constraintTop_toBottomOf="#+id/video_textview" />
</LinearLayout>
<LinearLayout
android:id="#+id/linearLayout5"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:layout_marginEnd="8dp"
android:orientation="horizontal"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/linearLayout4">
<ImageView
android:id="#+id/twitter_imageview"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginTop="20dp"
android:layout_marginEnd="8dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.126"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/facebook_textview"
app:srcCompat="#drawable/ic_twitter_white" />
<TextView
android:id="#+id/twitter_textview"
android:layout_width="336dp"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginTop="20dp"
android:layout_marginEnd="184dp"
android:text="\#mandabuz48"
android:textSize="18sp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.031"
app:layout_constraintStart_toEndOf="#+id/twitter_imageview"
app:layout_constraintTop_toBottomOf="#+id/facebook_textview" />
</LinearLayout>
</android.support.constraint.ConstraintLayout>
</android.support.constraint.ConstraintLayout>
From: https://developer.android.com/studio/write/tool-attributes
Android Studio supports a variety of XML attributes in the tools
namespace that enable design-time features (such as which layout to
show in a fragment) or compile-time behaviors (such as which shrinking
mode to apply to your XML resources). When you build your app, the
build tools remove these attributes so there is no effect on your APK
size or runtime behavior.
So the attribute:
tools:src="#drawable/prifile_pic"
is valid only for design-time.
It is not compiled in the APK and you will not see the image when you run the app.
Change it to:
app:srcCompat="#drawable/prifile_pic"
Do any of your ImageViews display the intended images? Your profile pic ImageView is using tools:src while others are using app:srcCompat
I just noticed a potential typo too -
tools:src="#drawable/prifile_pic" <<--- supposed to be profile_pic?
Are you getting any exception in your android studio log-cat, like image not found? As Stitches wrote in above comment --> typo error for prifile_pic, please check you drawable name is same in your xml layout and image name in drawable folder.
hello! I need my layouts to be responsive. I choose ConstraintLayout for this case but imageviews in my ConstraintLayout in small size and large size became irregular.
in tablet, my imageviews became too small and in small size is too large. my XML is here I think I cant set all true attributes in this layout. If someone guides me, helped me a lot*
<Button
android:id="#+id/shopbtn"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:layout_marginEnd="8dp"
android:layout_marginBottom="8dp"
android:background="#drawable/shop"
android:fontFamily="casual"
android:lineSpacingExtra="18sp"
android:textColor="#android:color/background_light"
android:textSize="30sp"
android:textStyle="normal|bold"
android:typeface="serif"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.35000002" />
<Button
android:id="#+id/exitbtn"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:layout_marginEnd="8dp"
android:layout_marginBottom="8dp"
android:background="#drawable/prew"
android:fontFamily="casual"
android:lineSpacingExtra="18sp"
android:textColor="#android:color/background_light"
android:textSize="30sp"
android:textStyle="normal|bold"
android:typeface="serif"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toStartOf="#+id/shopbtn"
app:layout_constraintHorizontal_bias="0.785"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.351" />
<Button
android:id="#+id/startbtn"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:layout_marginEnd="8dp"
android:layout_marginBottom="8dp"
android:background="#drawable/play"
android:fontFamily="casual"
android:lineSpacingExtra="18sp"
android:textColor="#android:color/background_light"
android:textSize="30sp"
android:textStyle="normal|bold"
android:typeface="serif"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.275"
app:layout_constraintStart_toEndOf="#+id/shopbtn"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.35000002" />
<ImageView
android:id="#+id/adamkhar"
android:layout_width="94dp"
android:layout_height="117dp"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:layout_marginEnd="8dp"
android:layout_marginBottom="8dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.073"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.625"
app:srcCompat="#drawable/pico" />
Different phones got different screen size, in your layout you are using fixed size on your view (fixed size is 50dp for example) and the result is that what may look good on one screen (your android studio preview screen) will not look good on another screen (your actual phone).
You can ise ConstraintLayout with guidelines and Chains to support different screen sizes.
Here is an example using ConstraintLayout:
*<?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:orientation="vertical"
tools:context=".MainActivity">
<Button
android:id="#+id/shopbtn"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginTop="8dp"
android:layout_marginEnd="8dp"
android:background="#drawable/rose"
android:fontFamily="casual"
android:lineSpacingExtra="18sp"
android:textColor="#android:color/background_light"
android:textSize="30sp"
android:textStyle="normal|bold"
android:typeface="serif"
app:layout_constraintEnd_toStartOf="#+id/startbtn"
app:layout_constraintHeight_percent="0.3"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toEndOf="#+id/exitbtn"
app:layout_constraintTop_toTopOf="parent" />
<Button
android:id="#+id/exitbtn"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginEnd="8dp"
android:background="#drawable/rose"
android:fontFamily="casual"
android:lineSpacingExtra="18sp"
android:textColor="#android:color/background_light"
android:textSize="30sp"
android:textStyle="normal|bold"
android:typeface="serif"
app:layout_constraintBottom_toBottomOf="#+id/shopbtn"
app:layout_constraintEnd_toStartOf="#+id/shopbtn"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="#+id/shopbtn" />
<Button
android:id="#+id/startbtn"
android:layout_width="0dp"
android:layout_height="0dp"
android:background="#drawable/rose"
android:fontFamily="casual"
android:lineSpacingExtra="18sp"
android:textColor="#android:color/background_light"
android:textSize="30sp"
android:textStyle="normal|bold"
android:typeface="serif"
app:layout_constraintBottom_toBottomOf="#+id/shopbtn"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toEndOf="#+id/shopbtn"
app:layout_constraintTop_toTopOf="#+id/shopbtn" />
<ImageView
android:id="#+id/adamkhar"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:layout_marginEnd="8dp"
android:layout_marginBottom="8dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHeight_percent="0.6"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/shopbtn"
app:srcCompat="#drawable/ic_launcher_background" />
</android.support.constraint.ConstraintLayout>*
And it will look like this:
Please notice that this is just an example and if you want to change the size of your views just change the value of app:layout_constraintHeight_percent and app:layout_constraintHeight_percent.
I have built a layout using ConstraintLayout for my android application. The application will be only available on mobile (no TV or Tablets). But honestly I don't how to make the layout perfectly fit the phone size.
Here's one of my activity
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/colorPrimary"
tools:context=".MainActivity">
<TextView
android:id="#+id/textView"
android:layout_width="match_parent"
android:layout_height="75dp"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:layout_marginEnd="8dp"
android:layout_marginBottom="8dp"
android:fontFamily="#font/billabong"
android:gravity="center"
android:text="Applikáció"
android:textColor="#color/white"
android:textSize="65sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.054" />
<android.support.design.widget.TextInputLayout
android:id="#+id/inputLayoutEmail"
android:layout_width="300dp"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:layout_marginEnd="8dp"
android:layout_marginBottom="8dp"
android:textColorHint="#color/inputText"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.505"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/textView"
app:layout_constraintVertical_bias="0.255">
<android.support.design.widget.TextInputEditText
android:id="#+id/login_email"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:backgroundTint="#color/inputText"
android:hint="E-mail cim"
android:inputType="text"
android:textColor="#color/colorAccent"
android:textColorHint="#color/colorPrimaryLight"
tools:layout_editor_absoluteX="16dp"
tools:layout_editor_absoluteY="214dp" />
</android.support.design.widget.TextInputLayout>
<android.support.design.widget.TextInputLayout
android:id="#+id/inputLayoutPassword"
android:layout_width="300dp"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginTop="16dp"
android:layout_marginEnd="8dp"
android:layout_marginBottom="8dp"
android:textColorHint="#color/inputText"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/inputLayoutEmail"
app:layout_constraintVertical_bias="0.0">
<android.support.design.widget.TextInputEditText
android:id="#+id/login_password"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:backgroundTint="#color/inputText"
android:textColor="#color/colorAccent"
android:hint="Jelszó"
android:inputType="textPassword"
android:textColorHint="#color/colorPrimaryLight" />
</android.support.design.widget.TextInputLayout>
<CheckBox
android:id="#+id/checkBox"
android:layout_width="300dp"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginTop="21dp"
android:layout_marginEnd="8dp"
android:layout_marginBottom="8dp"
android:buttonTint="#color/colorAccent"
android:hint="Maradjak bejelentkezve"
android:textColorHint="#color/inputText"
android:textSize="14sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/inputLayoutPassword"
app:layout_constraintVertical_bias="0.0" />
<Button
android:id="#+id/login_button"
android:layout_width="300dp"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginTop="28dp"
android:layout_marginEnd="8dp"
android:layout_marginBottom="8dp"
android:background="#drawable/button_style_1"
android:onClick="onClickButtonMain"
android:text="Bejelentkezés"
android:textColor="#color/white"
android:textStyle="bold"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/checkBox"
app:layout_constraintVertical_bias="0.0" />
<Button
android:id="#+id/registration_button"
android:layout_width="300dp"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginTop="18dp"
android:layout_marginEnd="8dp"
android:layout_marginBottom="8dp"
android:background="#drawable/button_style_blue"
android:onClick="onClickButtonMain"
android:text="Regisztráció"
android:textColor="#color/white"
android:textStyle="bold"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.494"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/login_button"
app:layout_constraintVertical_bias="0.0" />
<Button
android:id="#+id/information_button"
android:layout_width="300dp"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:layout_marginEnd="8dp"
android:layout_marginBottom="8dp"
android:background="#drawable/button_style_2"
android:onClick="onClickButtonMain"
android:text="Lépések"
android:textColor="#color/colorAccent"
android:textStyle="bold"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.505"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/registration_button"
app:layout_constraintVertical_bias="0.612" />
</android.support.constraint.ConstraintLayout>
This layout looks great on Pixel but for example on Nexus S the buttons and margins like they don't actually care about how I defined them. I really would like to know what am I doing wrong. I would like to be able to build responsive layouts.
In Android, you need to consider the number of different screen sizes when developing an android application.
Different phones got different screen size, in your layout you are using fixed size on your view (fixed size is android:layout_width="300dp" for example) and the result is that what may look good on one screen (your android studio preview screen)but will not look good on another screen (your actual phone).
For your case, I recommend using Chains and Guildelines, this will make your layout responsive.
Here is an example of the layout that you want to achieve using ConstraintLayout:
<?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">
<TextView
android:id="#+id/textView"
android:layout_width="match_parent"
android:layout_height="75dp"
android:layout_marginTop="8dp"
android:layout_marginBottom="8dp"
android:gravity="center"
android:text="Applikáció"
android:textSize="65sp"
app:layout_constraintBottom_toTopOf="#+id/guideline6"
app:layout_constraintTop_toTopOf="parent"
tools:layout_editor_absoluteX="0dp" />
<android.support.design.widget.TextInputLayout
android:id="#+id/inputLayoutEmail"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:textColorHint="#color/inputText"
app:layout_constraintBottom_toTopOf="#+id/inputLayoutPassword"
app:layout_constraintEnd_toStartOf="#+id/guideline7"
app:layout_constraintStart_toStartOf="#+id/guideline8"
app:layout_constraintTop_toTopOf="#+id/guideline6">
<android.support.design.widget.TextInputEditText
android:id="#+id/login_email"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:backgroundTint="#color/inputText"
android:hint="E-mail cim"
android:inputType="text"
android:textColor="#color/colorAccent"
android:textColorHint="#color/colorPrimaryLight" />
</android.support.design.widget.TextInputLayout>
<android.support.design.widget.TextInputLayout
android:id="#+id/inputLayoutPassword"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:textColorHint="#color/inputText"
app:layout_constraintBottom_toTopOf="#+id/checkBox"
app:layout_constraintEnd_toEndOf="#+id/inputLayoutEmail"
app:layout_constraintStart_toStartOf="#+id/inputLayoutEmail"
app:layout_constraintTop_toBottomOf="#+id/inputLayoutEmail">
<android.support.design.widget.TextInputEditText
android:id="#+id/login_password"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:backgroundTint="#color/inputText"
android:hint="Jelszó"
android:inputType="textPassword"
android:textColor="#color/colorAccent"
android:textColorHint="#color/colorPrimaryLight" />
</android.support.design.widget.TextInputLayout>
<CheckBox
android:id="#+id/checkBox"
android:layout_width="300dp"
android:layout_height="wrap_content"
android:buttonTint="#color/colorAccent"
android:hint="Maradjak bejelentkezve"
android:textSize="14sp"
app:layout_constraintBottom_toTopOf="#+id/login_button"
app:layout_constraintEnd_toEndOf="#+id/inputLayoutEmail"
app:layout_constraintStart_toStartOf="#+id/inputLayoutEmail"
app:layout_constraintTop_toBottomOf="#+id/inputLayoutPassword" />
<Button
android:id="#+id/login_button"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:onClick="onClickButtonMain"
android:text="Bejelentkezés"
android:textStyle="bold"
app:layout_constraintBottom_toTopOf="#+id/registration_button"
app:layout_constraintEnd_toStartOf="#+id/guideline7"
app:layout_constraintStart_toStartOf="#+id/inputLayoutEmail"
app:layout_constraintTop_toBottomOf="#+id/checkBox" />
<Button
android:id="#+id/registration_button"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:onClick="onClickButtonMain"
android:text="Regisztráció"
android:textStyle="bold"
app:layout_constraintBottom_toTopOf="#+id/information_button"
app:layout_constraintEnd_toStartOf="#+id/guideline7"
app:layout_constraintStart_toStartOf="#+id/inputLayoutEmail"
app:layout_constraintTop_toBottomOf="#+id/login_button" />
<Button
android:id="#+id/information_button"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:onClick="onClickButtonMain"
android:text="Lépések"
android:textColor="#color/colorAccent"
android:textStyle="bold"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="#+id/inputLayoutEmail"
app:layout_constraintStart_toStartOf="#+id/inputLayoutEmail"
app:layout_constraintTop_toBottomOf="#+id/registration_button" />
<android.support.constraint.Guideline
android:id="#+id/guideline6"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintGuide_begin="20dp"
app:layout_constraintGuide_percent="0.25" />
<android.support.constraint.Guideline
android:id="#+id/guideline7"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
app:layout_constraintGuide_percent=".9" />
<android.support.constraint.Guideline
android:id="#+id/guideline8"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
app:layout_constraintGuide_percent=".1" />
</android.support.constraint.ConstraintLayout>
It will look like this (I am adding a picture from the layout editor so you can see the guidelines):
Now all that left to do is to style your views and you have your layout ready.
I am new to android and working on a simple app. I have a forms page and would like the user to fill out when signing up for the app. My editext for the age and the dollarValue jumps up even though I have constrained it. I will post the xml down below.
provider_signup.xml
<?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">
<RadioButton
android:id="#+id/radioButton4"
android:layout_width="78dp"
android:layout_height="22dp"
android:layout_marginBottom="8dp"
android:layout_marginEnd="36dp"
android:layout_marginTop="8dp"
android:text="Fixed"
android:textAlignment="center"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toStartOf="#+id/radioButton3"
app:layout_constraintTop_toBottomOf="#+id/my_spinner"
app:layout_constraintVertical_bias="0.076" />
<ImageView
android:id="#+id/faceImage"
android:layout_width="91dp"
android:layout_height="66dp"
android:layout_marginBottom="8dp"
android:layout_marginEnd="8dp"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.501"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.038"
app:srcCompat="#drawable/common_google_signin_btn_icon_dark" />
<Spinner
android:id="#+id/my_spinner"
android:layout_width="368dp"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:layout_marginEnd="8dp"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.577" />
<TextView
android:id="#+id/insured"
android:layout_width="wrap_content"
android:layout_height="32dp"
android:layout_marginBottom="64dp"
android:layout_marginStart="76dp"
android:text="Insured"
android:textAlignment="center"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent" />
<Button
android:background="#color/colorAccent"
android:id="#+id/saveButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:layout_marginEnd="8dp"
android:layout_marginStart="8dp"
android:text="SAVE"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent" />
<TextView
android:id="#+id/ageTextView"
android:layout_width="37dp"
android:layout_height="24dp"
android:layout_marginBottom="116dp"
android:layout_marginEnd="8dp"
android:layout_marginStart="24dp"
android:layout_marginTop="8dp"
android:text="Age"
android:textAlignment="center"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.047"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.98" />
<TextView
android:id="#+id/dollarTextView"
android:layout_width="wrap_content"
android:layout_height="21dp"
android:layout_marginBottom="124dp"
android:layout_marginEnd="104dp"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:text="Dollar Value"
android:textAlignment="center"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="1.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/radioButton3"
app:layout_constraintVertical_bias="1.0" />
<TextView
android:id="#+id/textView7"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:layout_marginEnd="8dp"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:text="Rate"
android:textAlignment="center"
android:textSize="18sp"
app:layout_constraintBottom_toTopOf="#+id/insured"
app:layout_constraintEnd_toStartOf="#+id/radioButton4"
app:layout_constraintHorizontal_bias="0.621"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/my_spinner"
app:layout_constraintVertical_bias="0.189" />
<RadioButton
android:id="#+id/radioButton3"
android:layout_width="81dp"
android:layout_height="19dp"
android:layout_marginBottom="8dp"
android:layout_marginEnd="52dp"
android:layout_marginTop="8dp"
android:text="Hourly"
android:textAlignment="center"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toBottomOf="#+id/my_spinner"
app:layout_constraintVertical_bias="0.07999998" />
<EditText
android:id="#+id/firstName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="16dp"
android:layout_marginEnd="8dp"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:ems="10"
android:inputType="textPersonName"
android:text="First Name"
app:layout_constraintBottom_toTopOf="#+id/lastName"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/faceImage" />
<EditText
android:id="#+id/lastName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="16dp"
android:layout_marginEnd="8dp"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:ems="10"
android:inputType="textPersonName"
android:text="Last Name"
app:layout_constraintBottom_toTopOf="#+id/Address"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.503"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.948" />
<EditText
android:id="#+id/Address"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="16dp"
android:layout_marginEnd="8dp"
android:layout_marginStart="8dp"
android:ems="10"
android:inputType="textPersonName"
android:text="Address"
app:layout_constraintBottom_toTopOf="#+id/my_spinner"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.503"
app:layout_constraintStart_toStartOf="parent" />
<RadioButton
android:id="#+id/yesRadioButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:layout_marginEnd="8dp"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:text="YES"
app:layout_constraintBottom_toTopOf="#+id/saveButton"
app:layout_constraintEnd_toStartOf="#+id/noRadioButton"
app:layout_constraintHorizontal_bias="0.513"
app:layout_constraintStart_toEndOf="#+id/insured"
app:layout_constraintTop_toBottomOf="#+id/dollarTextView"
app:layout_constraintVertical_bias="0.894" />
<RadioButton
android:id="#+id/noRadioButton"
android:layout_width="wrap_content"
android:layout_height="29dp"
android:layout_marginBottom="68dp"
android:layout_marginEnd="8dp"
android:layout_marginStart="8dp"
android:text="NO"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.516"
app:layout_constraintStart_toEndOf="#+id/insured" />
<EditText
android:id="#+id/ageEditText"
android:layout_width="94dp"
android:layout_height="25dp"
android:layout_marginBottom="8dp"
android:layout_marginEnd="8dp"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:ems="10"
android:inputType="textPersonName"
android:text="Name"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toStartOf="#+id/dollarTextView"
app:layout_constraintHorizontal_bias="0.81"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/radioButton4"
app:layout_constraintVertical_bias="0.088" />
<EditText
android:id="#+id/dollarEditText"
android:layout_width="64dp"
android:layout_height="25dp"
android:layout_marginBottom="8dp"
android:layout_marginEnd="8dp"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:ems="10"
android:inputType="textPersonName"
android:text="Name"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.666"
app:layout_constraintStart_toEndOf="#+id/dollarTextView"
app:layout_constraintTop_toBottomOf="#+id/radioButton3"
app:layout_constraintVertical_bias="0.088" />
</android.support.constraint.ConstraintLayout>
First of all, you don't need to constraint all 4 constraints on every single view. You can connect views with only 2 constraints.
Onto your problem, constraint your editTexts to the TextViews that they should be right to.
I will paste the fixed code for your #+id/ageEditText and #+id/dollarEditText
<EditText
android:id="#+id/ageEditText"
android:layout_width="94dp"
android:layout_height="25dp"
android:layout_marginStart="8dp"
android:ems="10"
android:inputType="textPersonName"
android:text="Name"
app:layout_constraintStart_toEndOf="#+id/ageTextView"
app:layout_constraintTop_toTopOf="#+id/ageTextView" />
<EditText
android:id="#+id/dollarEditText"
android:layout_width="64dp"
android:layout_height="25dp"
android:layout_marginStart="8dp"
android:ems="10"
android:inputType="textPersonName"
android:text="Name"
app:layout_constraintStart_toEndOf="#+id/dollarTextView"
app:layout_constraintTop_toTopOf="#+id/dollarTextView" />
I copied your layout to android studio just to see what you were getting. You're having this issue because your views aren't aligned to one another yet you try to constrain them as using different references, so they end up moving independently. My advice to you is to organise the views that belong in the same line in layouts of their own and then constraint those layouts instead. You'll end up with the parent constraint layout that includes many embedded child layouts.
For example, add your 4 views for age and dollar value in one constraint layout like so:
<android.support.constraint.ConstraintLayout
android:id="#+id/your_layout_one"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="8dp">
<TextView
android:id="#+id/ageTextView"
android:layout_width="37dp"
android:layout_height="24dp"
android:text="Age"
android:textAlignment="center"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toStartOf="#id/ageEditText"
/>
<TextView
android:id="#+id/dollarTextView"
android:layout_width="wrap_content"
android:layout_height="21dp"
android:text="Dollar Value"
android:textAlignment="center"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toEndOf="#id/ageEditText"
app:layout_constraintEnd_toStartOf="#id/dollarEditText"
/>
<EditText
android:id="#+id/dollarEditText"
android:layout_width="64dp"
android:layout_height="25dp"
android:ems="10"
android:inputType="textPersonName"
android:text="Name"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toEndOf="#id/dollarTextView"
app:layout_constraintEnd_toEndOf="parent"
/>
<EditText
android:id="#+id/ageEditText"
android:layout_width="94dp"
android:layout_height="25dp"
android:ems="10"
android:inputType="textPersonName"
android:text="Name"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toEndOf="#id/ageTextView"
app:layout_constraintEnd_toStartOf="#id/dollarTextView"
/>
</android.support.constraint.ConstraintLayout>
You see how I added the padding to the parent and not the individual views. Since the parent is set to wrap around the children, and the children are set to expand to fit the parent, you end up with a clear layout where 4 views are perfectly aligned horizontally. Now do the same for every line in your screen that includes multiple views and add the constraints between those layouts instead of doing it for every view independently. You'll end up with a file that has the following structure:
<android.support.constraint.ConstraintLayout>
<android.support.constraint.ConstraintLayout>
<!--layout1 constraint start, end and top to parent-->
<!--constraint bottom to top of layout 2 below-->
<!--views to align horizontally-->
</android.support.constraint.ConstraintLayout>
<android.support.constraint.ConstraintLayout>
<!--layout2 constraint start and end to parent-->
<!--constraint top to bottom of layout 1 and bottom to top of layout 3 below-->
<!--views to align horizontally-->
</android.support.constraint.ConstraintLayout>
<android.support.constraint.ConstraintLayout>
<!--layout3 constraint start and end to parent-->
<!--constraint top to bottom of layout 2 and bottom to top of layout 4 below-->
<!--views to align horizontally-->
</android.support.constraint.ConstraintLayout>
<android.support.constraint.ConstraintLayout>
<!--layout3 constraint start, end and bottom to parent-->
<!--constraint top to bottom of layout 3 above-->
<!--views to align horizontally-->
</android.support.constraint.ConstraintLayout>
</android.support.constraint.ConstraintLayout>
I'm using Android Oreo AutoTextSize capability in my project.
Every thing works fine except that at first when RecyclerView being loaded, some of textView that uses AutoTextSize has a margin bottom on some RecyclerView items but when I scroll down and then come back to that items, problem solves.
and Although in some items, length of TextView is same with another item, but text sizes are different.
You can see my problem in below image :
When I scroll down and then come back, it is ok
here is items layout :
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="8dp"
android:background="#android:color/white"
app:cardCornerRadius="10dp"
app:cardElevation="3dp">
<android.support.constraint.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.constraint.ConstraintLayout
android:id="#+id/fessMetaCL"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginBottom="2dp"
android:layout_marginEnd="2dp"
android:layout_marginStart="2dp"
android:layout_marginTop="24dp"
android:background="#drawable/fees_item_background"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/fee_currency_icon"
app:layout_constraintVertical_bias="1.0">
<android.support.v7.widget.AppCompatTextView
android:id="#+id/fees_update_label"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:layout_marginEnd="8dp"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:text="#string/lastupdate"
android:textColor="#color/fees_text_color"
android:textSize="12sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toStartOf="#+id/fee_currency_date"
app:layout_constraintHorizontal_bias="1.0"
app:layout_constraintStart_toEndOf="#+id/fee_currency_stock"
app:layout_constraintTop_toTopOf="parent" />
<android.support.v7.widget.AppCompatTextView
android:id="#+id/fee_currency_date"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:layout_marginEnd="8dp"
android:maxLines="1"
android:textColor="#color/fees_text_color"
app:autoSizeMaxTextSize="#dimen/order_result_text_max_size"
app:autoSizeMinTextSize="#dimen/order_result_text_min_size"
app:autoSizeStepGranularity="#dimen/order_result_text_rise_step_size"
app:autoSizeTextType="uniform"
app:layout_constraintBaseline_toBaselineOf="#+id/fees_update_label"
app:layout_constraintEnd_toEndOf="parent" />
<android.support.v7.widget.AppCompatTextView
android:id="#+id/fees_stock_label"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:text="#string/stock"
android:textColor="#color/fees_text_color"
android:textSize="12sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<android.support.v7.widget.AppCompatTextView
android:id="#+id/fee_currency_stock"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:maxLines="1"
android:textColor="#color/fees_text_color"
app:autoSizeMaxTextSize="#dimen/order_result_text_max_size"
app:autoSizeMinTextSize="#dimen/order_result_text_min_size"
app:autoSizeStepGranularity="#dimen/order_result_text_rise_step_size"
app:autoSizeTextType="uniform"
app:layout_constraintBaseline_toBaselineOf="#+id/fees_stock_label"
app:layout_constraintStart_toEndOf="#+id/fees_stock_label" />
</android.support.constraint.ConstraintLayout>
<ImageView
android:id="#+id/fee_currency_icon"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_marginStart="16dp"
android:layout_marginTop="16dp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="#drawable/others" />
<android.support.v7.widget.AppCompatTextView
android:id="#+id/fee_currency_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:textColor="#color/fees_text_color"
android:textSize="#dimen/dashboard_fees_small_font_size"
app:layout_constraintStart_toEndOf="#+id/fee_currency_icon"
app:layout_constraintTop_toTopOf="#+id/fee_currency_icon" />
<android.support.v7.widget.AppCompatTextView
android:id="#+id/fee_currency_price"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#color/fees_text_color"
android:textSize="#dimen/dashboard_fees_small_font_size"
app:layout_constraintBottom_toBottomOf="#+id/fee_currency_icon"
app:layout_constraintStart_toStartOf="#+id/fee_currency_name"
app:layout_constraintTop_toBottomOf="#+id/fee_currency_name" />
<android.support.v7.widget.AppCompatTextView
android:id="#+id/fee_currency_change"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="24dp"
android:textColor="#color/fees_text_color"
android:textSize="#dimen/dashboard_fees_big_font_size"
app:layout_constraintBottom_toBottomOf="#+id/fee_currency_icon"
app:layout_constraintStart_toStartOf="#+id/guideline4"
app:layout_constraintTop_toTopOf="#+id/fee_currency_icon" />
<android.support.v7.widget.AppCompatTextView
android:id="#+id/fees_change_tip"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="8dp"
android:layout_marginStart="8dp"
android:text="#string/change"
android:textColor="#color/fees_text_color"
android:textSize="#dimen/dashboard_fees_small_font_size"
app:layout_constraintBottom_toBottomOf="#+id/fee_currency_change"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toEndOf="#+id/fee_currency_change" />
<android.support.constraint.Guideline
android:id="#+id/guideline4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
app:layout_constraintGuide_begin="187dp" />
</android.support.constraint.ConstraintLayout>
</android.support.v7.widget.CardView>