Develop Reference

How to center text in textView in this case?

I want to put the text in textView_title and textView_subtitle to the center of the screen. May I know what is a good way to do it? I tried android:layout_gravity and android:gravity and they do not work.
Below is the XML file with a constraint layout.
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="0dp"
android:layout_height="?attr/actionBarSize"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toStartOf="#id/textView_login"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent">
<TextView
android:id="#+id/textView_title"
android:lines="1"
android:ellipsize="end"
android:layout_width="0dp"
android:layout_height="wrap_content"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toTopOf="#id/textView_subtitle"
tool:text="textView"/>
<TextView
android:id="#+id/textView_subtitle"
android:lines="1"
android:ellipsize="end"
android:textColor="#color/foodDollarYellow"
android:textSize="12sp"
android:layout_width="0dp"
android:layout_height="wrap_content"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toBottomOf="#id/textView_title"
app:layout_constraintBottom_toBottomOf="parent"
tool:text="textView"/>
</androidx.constraintlayout.widget.ConstraintLayout>
<TextView
android:id="#+id/textView_login"
android:textAlignment="textEnd"
android:text="註冊/登入"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="16dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
tool:ignore="HardcodedText"/>
</androidx.constraintlayout.widget.ConstraintLayout>

Add android:textAlignment="center" to your textViews and make the parent width equal to the screen width:
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="0dp"
android:layout_height="?attr/actionBarSize"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="0dp"
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">
<TextView
android:id="#+id/textView_title"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:ellipsize="end"
android:lines="1"
android:text="text1"
android:textAlignment="center"
app:layout_constraintBottom_toTopOf="#id/textView_subtitle"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/textView_subtitle"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:ellipsize="end"
android:lines="1"
android:text="text2"
android:textAlignment="center"
android:textSize="12sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/textView_title" />
</androidx.constraintlayout.widget.ConstraintLayout>
<TextView
android:id="#+id/textView_login"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="16dp"
android:text="註冊/登入"
android:textAlignment="textEnd"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent"
tools:ignore="HardcodedText" />
</androidx.constraintlayout.widget.ConstraintLayout>
It will look like this:
If you want to avoid nesting you can achieve this using single layout:
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<TextView
android:id="#+id/textView_title"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:ellipsize="end"
android:lines="1"
android:text="text1"
android:textAlignment="center"
app:layout_constraintBottom_toTopOf="#id/textView_subtitle"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/textView_subtitle"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:ellipsize="end"
android:lines="1"
android:text="text2"
android:textAlignment="center"
android:textSize="12sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/textView_title" />
<TextView
android:id="#+id/textView_login"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="註冊/登入"
android:textAlignment="textEnd"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="#+id/textView_title"
app:layout_constraintTop_toTopOf="parent"
tools:ignore="MissingConstraints" />
</androidx.constraintlayout.widget.ConstraintLayout>
And it will look like this:
You can achieve this layout with or without nesting, but it is more recommended to avoid nesting when possible if you are using constaintLayout
Edit
This is the new layout: (I have added 1 Guildeline)
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/constraintLayout"
android:layout_width="0dp"
android:layout_height="wrap_content"
app:layout_constraintBottom_toBottomOf="#+id/textView_subtitle"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="#+id/guideline2"
app:layout_constraintTop_toTopOf="parent">
</androidx.constraintlayout.widget.ConstraintLayout>
<androidx.constraintlayout.widget.Guideline
android:id="#+id/guideline2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
app:layout_constraintGuide_percent="0.7" />
<TextView
android:id="#+id/textView_login"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="註冊/登入"
android:textAlignment="textEnd"
app:layout_constraintBottom_toBottomOf="#+id/textView_subtitle"
app:layout_constraintEnd_toEndOf="#+id/constraintLayout"
app:layout_constraintStart_toStartOf="#+id/guideline2"
app:layout_constraintTop_toTopOf="parent"
tools:ignore="MissingConstraints" />
<TextView
android:id="#+id/textView_subtitle"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:ellipsize="end"
android:lines="1"
android:text="long longggggggggggggggggggggggggggggggggggggggggg"
android:textAlignment="center"
android:textSize="12sp"
app:layout_constraintEnd_toStartOf="#+id/guideline2"
app:layout_constraintStart_toStartOf="#+id/textView_title"
app:layout_constraintTop_toBottomOf="#+id/textView_title" />
<TextView
android:id="#+id/textView_title"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:ellipsize="end"
android:lines="1"
android:text="longggggggggggggggggggggggggggggggggg"
android:textAlignment="center"
app:layout_constraintEnd_toStartOf="#+id/guideline2"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
Here is how it will look:

Solution 1:
add in your textview:
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
hence:
<TextView
android:id="#+id/textView_login"
android:textAlignment="textEnd"
android:text="註冊/登入"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="16dp"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
tools:ignore="MissingConstraints" />
Solution 2
use relative layout instead of constraint(im taking about the first constraint layout not second)
then
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/relative"
>
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toStartOf="#id/textView_login"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent">
<TextView
android:id="#+id/textView_title"
android:lines="1"
android:ellipsize="end"
android:layout_width="0dp"
android:layout_height="wrap_content"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toTopOf="#id/textView_subtitle"
/>
<TextView
android:id="#+id/textView_subtitle"
android:lines="1"
android:ellipsize="end"
android:textColor="#color/foodDollarYellow"
android:textSize="12sp"
android:layout_width="0dp"
android:layout_height="wrap_content"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toBottomOf="#id/textView_title"
app:layout_constraintBottom_toBottomOf="parent"
/>
</androidx.constraintlayout.widget.ConstraintLayout>
<TextView
android:id="#+id/textView_login"
android:textAlignment="textEnd"
android:text="註冊/登入"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="16dp"
app:layout_constraintTop_toTopOf="parent"
android:layout_centerHorizontal="true"
tools:ignore="MissingConstraints" />
</RelativeLayout>
android:layout_centerHorizontal="true" this line bring your textview in centretop
hope my answer helped...

how can I move views on the right direction in constrainlayout

I am developing a news app and I want to move views on the right
direction in constrain layout. but I could achieve what I want below
my XML file where I have implemented constraint layout any suggestion
and tips greatly appreciated.
I am developing a news app and I want to move views on the right
direction in constrain layout. but I could achieve what I want below
my XML file where I have implemented constraint layout any suggestion
and tips greatly appreciated.
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="#+id/articleImage"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_gravity="center"
android:layout_margin="8dp"
app:layout_constraintDimensionRatio="16:9"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="#+id/guideline4"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/articleAuthor"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:layout_marginEnd="8dp"
android:gravity="start"
android:text="article_author"
android:textSize="12sp"
app:layout_constraintEnd_toStartOf="#+id/articleImage"
app:layout_constraintHorizontal_bias="0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/articleTitle"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:layout_marginEnd="8dp"
android:layout_marginBottom="8dp"
android:text="article_title"
android:textSize="12sp"
app:layout_constraintEnd_toStartOf="#+id/guideline4"
app:layout_constraintHorizontal_bias="0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/articleAuthor" />
<TextView
android:id="#+id/articleTime"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginLeft="8dp"
android:layout_marginTop="8dp"
android:layout_marginBottom="8dp"
android:text="Article Time"
android:textSize="18sp"
app:layout_constraintEnd_toStartOf="#+id/articleFavorite"
app:layout_constraintHorizontal_bias="0"
app:layout_constraintHorizontal_chainStyle="packed"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/articleTitle" />
<ImageButton
android:id="#+id/articleFavorite"
android:layout_width="32dp"
android:layout_height="32dp"
android:background="#color/colorWhite"
android:src="#drawable/ic_bookmark"
app:layout_constraintBottom_toBottomOf="#+id/articleTime"
app:layout_constraintEnd_toStartOf="#+id/articleShare"
app:layout_constraintStart_toEndOf="#+id/articleTime"
app:layout_constraintTop_toTopOf="#+id/articleTime" />
<ImageButton
android:id="#+id/articleShare"
android:layout_width="32dp"
android:layout_height="32dp"
android:layout_marginEnd="8dp"
android:layout_marginRight="8dp"
android:background="#color/colorWhite"
android:contentDescription="TODO"
android:src="#drawable/ic_share"
app:layout_constraintBottom_toBottomOf="#+id/articleTime"
app:layout_constraintEnd_toStartOf="#+id/guideline4"
app:layout_constraintStart_toEndOf="#+id/articleFavorite"
app:layout_constraintTop_toTopOf="#+id/articleTime" />
<android.support.constraint.Guideline
android:id="#+id/guideline4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
app:layout_constraintGuide_percent="0.6" />
</android.support.constraint.ConstraintLayout>
below current screenshot of the app
below screenshot which I want to achieve

Wrap the views with another Viewgroup (say ConstraintLayout again) and set app:layout_constraintStart_toStartOf="parent" and app:layout_constraintEnd_toEndOf="parent" as constraints to this viewgroup. Said view will then be centered horizontally.
Edit: The code
<android.support.constraint.ConstraintLayout android:layout_height="wrap_content" android:layout_width="match_parent"
xmlns:android="http://schemas.android.com/apk/res/android">
<android.support.constraint.ConstraintLayout
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintBottom_toBottomOf="parent">
<ImageView
android:id="#+id/articleImage"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_gravity="center"
android:layout_margin="8dp"
app:layout_constraintDimensionRatio="16:9"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="#+id/guideline4"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/articleAuthor"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:layout_marginEnd="8dp"
android:gravity="start"
android:text="article_author"
android:textSize="12sp"
app:layout_constraintEnd_toStartOf="#+id/articleImage"
app:layout_constraintHorizontal_bias="0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/articleTitle"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:layout_marginEnd="8dp"
android:layout_marginBottom="8dp"
android:text="article_title"
android:textSize="12sp"
app:layout_constraintEnd_toStartOf="#+id/guideline4"
app:layout_constraintHorizontal_bias="0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/articleAuthor" />
<TextView
android:id="#+id/articleTime"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginLeft="8dp"
android:layout_marginTop="8dp"
android:layout_marginBottom="8dp"
android:text="Article Time"
android:textSize="18sp"
app:layout_constraintEnd_toStartOf="#+id/articleFavorite"
app:layout_constraintHorizontal_bias="0"
app:layout_constraintHorizontal_chainStyle="packed"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/articleTitle" />
<ImageButton
android:id="#+id/articleFavorite"
android:layout_width="32dp"
android:layout_height="32dp"
android:background="#color/"
android:src="#drawable/"
app:layout_constraintBottom_toBottomOf="#+id/articleTime"
app:layout_constraintEnd_toStartOf="#+id/articleShare"
app:layout_constraintStart_toEndOf="#+id/articleTime"
app:layout_constraintTop_toTopOf="#+id/articleTime" />
<ImageButton
android:id="#+id/articleShare"
android:layout_width="32dp"
android:layout_height="32dp"
android:layout_marginEnd="8dp"
android:layout_marginRight="8dp"
android:background="#color/"
android:contentDescription="TODO"
android:src="#drawable/"
app:layout_constraintBottom_toBottomOf="#+id/articleTime"
app:layout_constraintEnd_toStartOf="#+id/guideline4"
app:layout_constraintStart_toEndOf="#+id/articleFavorite"
app:layout_constraintTop_toTopOf="#+id/articleTime" />
<android.support.constraint.Guideline
android:id="#+id/guideline4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
app:layout_constraintGuide_percent="0.6" />
</android.support.constraint.ConstraintLayout>
I messed up the ImageButtons a little, please fix the drawables and the color.
Edit 2: for some reason, another closing tag won't show in the code section here. make sure to add another ConstraintLayout closing tag right at the end.
<android.support.constraint.ConstraintLayout android:layout_height="wrap_content"
android:layout_width="match_parent"
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<android.support.constraint.Guideline
android:layout_width="0dp"
android:layout_height="0dp"
android:orientation="vertical"
app:layout_constraintGuide_percent="0.55"
android:id="#+id/guideline"/>
<ImageView
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toEndOf="#id/guideline"
app:layout_constraintDimensionRatio="16:9"
android:layout_margin="16dp"
android:id="#+id/imageView"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintStart_toStartOf="parent"
android:id="#+id/mainTextView"
android:layout_marginStart="25dp"
android:layout_marginTop="10dp"
android:text="Placeholder"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintTop_toBottomOf="#id/mainTextView"
app:layout_constraintStart_toStartOf="#id/mainTextView"
android:layout_marginTop="5dp"
android:text="Secondary"
android:id="#+id/secondaryTextView"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintTop_toBottomOf="#id/secondaryTextView"
app:layout_constraintStart_toStartOf="#id/mainTextView"
app:layout_constraintBottom_toBottomOf="parent"
android:layout_marginBottom="10dp"
android:layout_marginTop="5dp"
android:text="Tertiary"
android:id="#+id/tertiaryTextView"/>
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintTop_toTopOf="#id/tertiaryTextView"
app:layout_constraintBottom_toBottomOf="#id/tertiaryTextView"
app:layout_constraintStart_toEndOf="#id/tertiaryTextView"
android:layout_marginStart="15dp"
android:id="#+id/firstButton"/>
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintTop_toTopOf="#id/firstButton"
app:layout_constraintBottom_toBottomOf="#id/firstButton"
app:layout_constraintStart_toEndOf="#id/firstButton"
android:layout_marginStart="15dp"
android:id="#+id/secondButton"/>
Edit 3: Here's a clean take to it.This one should do what you want. Though you have to tweak the margins the way you want them! Again the closing tag ... I don't know why it won't appear here!

If you want to move your views that are on the left side of the screen to the right part of the screen simply change your constraints like this:
Replace your constraints, your views will get constraint to your guideline from the left and to the right side on the screen as the right constraint.
Do it like this:
<android.support.constraint.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="#+id/articleImage"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_gravity="center"
android:layout_margin="8dp"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:layout_marginEnd="8dp"
app:layout_constraintDimensionRatio="16:9"
app:layout_constraintEnd_toStartOf="#+id/guideline4"
app:layout_constraintHorizontal_bias="1.0"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/articleAuthor"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:layout_marginEnd="8dp"
android:gravity="start"
android:text="article_author"
android:textSize="12sp"
app:layout_constraintEnd_toStartOf="#+id/articleImage"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="#+id/guideline4"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/articleTitle"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:layout_marginEnd="8dp"
android:text="article_title"
android:textSize="12sp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="#+id/guideline4"
app:layout_constraintTop_toBottomOf="#+id/articleAuthor" />
<TextView
android:id="#+id/articleTime"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:text="Article Time"
android:textSize="18sp"
app:layout_constraintEnd_toStartOf="#+id/articleFavorite"
app:layout_constraintHorizontal_bias="0"
app:layout_constraintHorizontal_chainStyle="packed"
app:layout_constraintStart_toStartOf="#+id/guideline4"
app:layout_constraintTop_toBottomOf="#+id/articleTitle" />
<ImageButton
android:id="#+id/articleFavorite"
android:layout_width="0dp"
android:layout_height="0dp"
android:background="#color/colorWhite"
android:src="#drawable/ic_bookmark"
app:layout_constraintBottom_toBottomOf="#+id/articleTime"
app:layout_constraintEnd_toStartOf="#+id/articleShare"
app:layout_constraintStart_toEndOf="#+id/articleTime"
app:layout_constraintTop_toTopOf="#+id/articleTime" />
<ImageButton
android:id="#+id/articleShare"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginEnd="8dp"
android:background="#color/colorWhite"
android:contentDescription="TODO"
android:src="#drawable/ic_share"
app:layout_constraintBottom_toBottomOf="#+id/articleTime"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="#+id/articleFavorite"
app:layout_constraintTop_toTopOf="#+id/articleTime"
app:layout_constraintVertical_bias="0.0" />
<android.support.constraint.Guideline
android:id="#+id/guideline4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
app:layout_constraintGuide_percent="0.6" />
</android.support.constraint.ConstraintLayout>
And it will look like this:

ConstraintLayout not wrapping content nor matching parent

Below you can see my XML code where I have a ConstraintLayout in a ScrollView. The ConstraintLayout does not wrapping content and i cant find the problem. It actually "hides" some of my views - in this case a button.
When I try to change the height attribute in the ConstraintLayout nothing happens so i feel its something else that i cant find.
Thank you
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#546E7A"
tools:context="com.example.android.business_card.MainActivity">
<android.support.constraint.ConstraintLayout
android:id="#+id/mainConst"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/imageView"
android:layout_width="0dp"
android:layout_height="wrap_content"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="#drawable/logotop" />
<ImageView
android:id="#+id/imageView2"
android:layout_width="0dp"
android:layout_height="match_parent"
android:adjustViewBounds="true"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#+id/imageView"
app:srcCompat="#drawable/logo5" />
<TextView
android:id="#+id/textView"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_margin="#dimen/spacing2"
android:drawableLeft="#drawable/map2"
android:drawablePadding="#dimen/spacing"
android:text="#string/map"
android:textColor="#android:color/white"
app:layout_constraintEnd_toEndOf="#+id/textView2"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/textView2" />
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="#dimen/spacing2"
android:drawableLeft="#drawable/phone3"
android:drawablePadding="#dimen/spacing"
android:text="#string/phone"
android:textColor="#android:color/white"
app:layout_constraintEnd_toEndOf="#+id/textView3"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/textView3" />
<TextView
android:id="#+id/textView3"
android:layout_width="wrap_content"
android:layout_height="19dp"
android:layout_margin="#dimen/spacing2"
android:drawableLeft="#drawable/web2"
android:drawablePadding="#dimen/spacing"
android:text="#string/site"
android:textColor="#android:color/white"
app:layout_constraintEnd_toEndOf="#+id/textView4"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/textView4" />
<TextView
android:id="#+id/textView4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="16dp"
android:layout_marginStart="8dp"
android:drawablePadding="#dimen/spacing"
android:paddingBottom="#dimen/spacing2"
android:paddingTop="#dimen/spacing2"
android:text="#string/name"
android:textColor="#android:color/white"
android:textSize="25sp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/imageView2" />
<Button
android:id="#+id/button"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_margin="#dimen/spacing"
android:background="#color/butCol"
android:text="#string/sign"
android:textAllCaps="false"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#+id/textView" />
</android.support.constraint.ConstraintLayout>

Solved - i had to use android:fillViewport="true" in the scrollview attributes.

ConstraintLayout shows height but is actually 0

I have a ConstraintLayout within a layout file and when I set the height of the ConstraintLayout to be 0dp and set additional constraints, I can see that the layout is at the size of what I want (here), however, when I put another View within the layout (in this case a MapView), it does not resize to its parent's height (here)! This is my whole 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:mapbox="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/dialogContainer"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageButton
android:id="#+id/closeDialogButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="16dp"
android:layout_marginTop="8dp"
android:background="#drawable/ic_close_workorder"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/dialogInfo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="24dp"
android:layout_marginStart="24dp"
android:layout_marginTop="8dp"
android:fontFamily="#font/open_sans_semibold"
android:text="TextView"
android:textColor="#color/textTint"
android:textSize="15sp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/dialogTitle"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginEnd="16dp"
android:layout_marginStart="24dp"
android:layout_marginTop="8dp"
android:fontFamily="#font/gotham_medium"
android:text="TextView"
android:textColor="#color/primaryDark"
android:textSize="20sp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toBottomOf="#+id/dialogInfo" />
<android.support.constraint.ConstraintLayout
android:id="#+id/constraintLayout6"
android:layout_width="0dp"
android:layout_height="wrap_content"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#+id/dialogTitle">
<ImageView
android:id="#+id/imageView6"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="24dp"
android:layout_marginLeft="16dp"
android:layout_marginStart="16dp"
android:layout_marginTop="24dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="#drawable/ic_description" />
<TextView
android:id="#+id/descriptionText"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:layout_marginEnd="16dp"
android:layout_marginStart="16dp"
android:layout_marginTop="8dp"
android:fontFamily="#font/open_sans_light"
android:text="TextView"
android:textColor="#color/primaryDark"
android:textSize="14dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintLeft_toRightOf="#+id/imageView6"
app:layout_constraintTop_toTopOf="parent" />
</android.support.constraint.ConstraintLayout>
<android.support.constraint.ConstraintLayout
android:id="#+id/divider1"
android:layout_width="0dp"
android:layout_height="1dp"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:layout_marginTop="4dp"
android:background="#color/dividerColor"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#+id/constraintLayout6">
</android.support.constraint.ConstraintLayout>
<android.support.constraint.ConstraintLayout
android:id="#+id/constraintLayout7"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="4dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#+id/divider1">
<ImageView
android:id="#+id/imageView7"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="24dp"
android:layout_marginLeft="16dp"
android:layout_marginStart="16dp"
android:layout_marginTop="24dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="#drawable/ic_materials" />
<TextView
android:id="#+id/materialsText"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:layout_marginEnd="16dp"
android:layout_marginStart="16dp"
android:layout_marginTop="8dp"
android:fontFamily="#font/open_sans_light"
android:text="TextView"
android:textColor="#color/primaryDark"
android:textSize="14dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintLeft_toRightOf="#+id/imageView7"
app:layout_constraintTop_toTopOf="parent" />
</android.support.constraint.ConstraintLayout>
<android.support.constraint.ConstraintLayout
android:id="#+id/divider2"
android:layout_width="0dp"
android:layout_height="1dp"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:layout_marginTop="4dp"
android:background="#color/dividerColor"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#+id/constraintLayout7">
</android.support.constraint.ConstraintLayout>
<android.support.constraint.ConstraintLayout
android:id="#+id/constraintLayout9"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="4dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#+id/divider2">
<ImageView
android:id="#+id/imageView8"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="24dp"
android:layout_marginLeft="16dp"
android:layout_marginStart="16dp"
android:layout_marginTop="24dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="#drawable/ic_contact" />
<TextView
android:id="#+id/contactText"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:layout_marginEnd="16dp"
android:layout_marginStart="16dp"
android:layout_marginTop="8dp"
android:fontFamily="#font/open_sans_light"
android:text="TextView"
android:textColor="#color/primaryDark"
android:textSize="14dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintLeft_toRightOf="#+id/imageView8"
app:layout_constraintTop_toTopOf="parent" />
</android.support.constraint.ConstraintLayout>
<TextView
android:id="#+id/noMapInstruction"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Geen kaart beschikbaar"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#+id/constraintLayout9" />
<android.support.constraint.ConstraintLayout
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#+id/constraintLayout9">
<com.mapbox.mapboxsdk.maps.MapView
android:id="#+id/locationMap"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
mapbox:mapbox_cameraZoom="11"
mapbox:mapbox_renderTextureMode="true"
mapbox:mapbox_styleUrl="mapbox://styles/mapbox/streets-v10" />
</android.support.constraint.ConstraintLayout>
<android.support.constraint.ConstraintLayout
android:id="#+id/constraintLayout10"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:background="#color/fadedWhite"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#+id/constraintLayout9">
<TextView
android:id="#+id/locationText"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginBottom="24dp"
android:layout_marginEnd="16dp"
android:layout_marginStart="16dp"
android:layout_marginTop="24dp"
android:fontFamily="#font/open_sans_light"
android:text="TextView"
android:textColor="#color/primaryDark"
android:textSize="14dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintLeft_toRightOf="#+id/imageView10"
app:layout_constraintTop_toTopOf="parent" />
<ImageView
android:id="#+id/imageView10"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="24dp"
android:layout_marginLeft="16dp"
android:layout_marginTop="24dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="#drawable/ic_location" />
</android.support.constraint.ConstraintLayout>
<ImageView
android:id="#+id/openWorkOrder"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:cropToPadding="false"
android:src="#drawable/button_open_workorder"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent" />
</android.support.constraint.ConstraintLayout>
Can anyone explain this behaviour to me and help me get the full ConstraintLayout's height? This is what I'm trying to achieve, but without the info of the middle view (the contact icon). So basically, the MapView should be displayed behind the location text.

Those constraints:
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
Ignores the width set in layout_width and join the left of this view with the left of the parent, and the right to the right, the result will be a match_parent width.
Similar, you can do Top_topTopOf="parent" and Bottom_toBottomOf="parent" but since you have more views on screen if you want to place then linearly you can use the Top_toBottomOf="#id/other"

Change 0dp with wrap_content for both the MapView and its container. And possibly for other layouts as well.
Also, I see you're using a lot of ConstraintLayouts. For instance the dividers (divider1 and divider2) are ConstraintLayout but could simply be Views, which would improve performance.

How to apply divider or view in Constraint layout

I want to apply a divider at some places in Constraint layout but when I do it by simple view, the whole layout get shifted to the top and everything gets merged. I want to use only constraints layout for the whole design.
<TextView
android:id="#+id/textView16"
android:layout_width="0dp"
android:layout_height="18dp"
android:text="TextView"
app:layout_constraintLeft_toRightOf="#+id/imageView11"
android:layout_marginLeft="8dp"
android:layout_marginRight="8dp"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintHorizontal_bias="1.0"
android:layout_marginTop="13dp"
app:layout_constraintTop_toBottomOf="#+id/textView14"
app:layout_constraintBottom_toBottomOf="parent"
android:layout_marginBottom="8dp"
app:layout_constraintVertical_bias="0.0"
android:layout_marginStart="8dp"
android:layout_marginEnd="8dp" />
<TextView
android:id="#+id/textView20"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:text="TextView"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintRight_toRightOf="parent"
android:layout_marginTop="8dp"
app:layout_constraintTop_toBottomOf="#+id/textView16"
app:layout_constraintLeft_toRightOf="#+id/imageView11"
android:layout_marginLeft="8dp"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintVertical_bias="0.0"
android:layout_marginRight="8dp"
android:layout_marginStart="8dp"
android:layout_marginEnd="8dp" />
<View
android:layout_width="0dp"
android:layout_height="2dp"
android:background="#android:color/background_dark"
tools:layout_editor_absoluteY="98dp"
android:id="#+id/view"
tools:layout_editor_absoluteX="0dp" />
<TextView
android:id="#+id/textView21"
android:layout_width="wrap_content"
android:layout_height="17dp"
android:layout_marginBottom="8dp"
android:layout_marginRight="8dp"
android:text="Nivedita Parmar"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintHorizontal_bias="0.025"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#+id/view"
app:layout_constraintVertical_bias="0.035"
android:layout_marginEnd="8dp" />
Please give some idea regarding this.
Thanks in advance..

See my answer below. I am putting view between text view. May help you.
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.example.shweta.firebasedemo.Main2Activity">
<TextView
android:id="#+id/txt_1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:text="TextView1"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintLeft_toRightOf="#+id/imageView2"
app:layout_constraintTop_toTopOf="#+id/imageView2"
app:layout_constraintBottom_toTopOf="#+id/txt_2"
/>
<TextView
android:id="#+id/txt_2"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:text="TextView2"
android:layout_marginTop="8dp"
app:layout_constraintRight_toRightOf="#+id/txt_1"
app:layout_constraintLeft_toLeftOf="#+id/txt_1"
app:layout_constraintTop_toBottomOf="#+id/txt_1"
app:layout_constraintBottom_toTopOf="#+id/txt_3"
/>
<TextView
android:id="#+id/txt_3"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:text="TextView3"
android:layout_marginTop="8dp"
app:layout_constraintRight_toRightOf="#+id/txt_2"
app:layout_constraintLeft_toLeftOf="#+id/txt_2"
app:layout_constraintTop_toBottomOf="#+id/txt_2"
app:layout_constraintBottom_toBottomOf="#+id/imageView2"
/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#mipmap/ic_launcher"
app:layout_constraintLeft_toLeftOf="parent"
android:id="#+id/imageView2"
app:layout_constraintTop_toTopOf="parent"
android:layout_marginTop="20dp"
android:layout_marginLeft="16dp" />
<View
android:layout_width="0dp"
android:layout_height="2dp"
android:background="#android:color/background_dark"
android:id="#+id/view"
android:layout_marginTop="25dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#+id/imageView2"
/>
<TextView
android:id="#+id/textView21"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:text="Nivedita Parmar"
android:layout_marginLeft="16dp"
android:layout_marginRight="8dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toLeftOf="#+id/imageView"
app:layout_constraintTop_toTopOf="#+id/imageView"
app:layout_constraintHorizontal_bias="0.502" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#mipmap/ic_launcher"
android:id="#+id/imageView"
android:layout_marginRight="16dp"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="#+id/view"
android:layout_marginTop="20dp" />
<TextView
android:id="#+id/txt_home"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:text="home"
android:layout_marginTop="8dp"
app:layout_constraintRight_toRightOf="#+id/textView21"
app:layout_constraintTop_toBottomOf="#+id/textView21"
app:layout_constraintLeft_toLeftOf="#+id/textView21"
app:layout_constraintBottom_toTopOf="#+id/txt_height"/>
<TextView
android:id="#+id/txt_height"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:text="home"
android:layout_marginTop="8dp"
app:layout_constraintRight_toRightOf="#+id/txt_home"
app:layout_constraintTop_toBottomOf="#+id/txt_home"
app:layout_constraintLeft_toLeftOf="#+id/txt_home"
app:layout_constraintBottom_toBottomOf="#+id/imageView"/>
</android.support.constraint.ConstraintLayout>

Check out Guideline. I've found it to be useful when working with Constraint Views.
<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">
<androidx.constraintlayout.widget.Guideline
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/guideline"
app:layout_constraintGuide_begin="100dp"
android:orientation="vertical"/>
<Button
android:text="Button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/button"
app:layout_constraintLeft_toLeftOf="#+id/guideline"
android:layout_marginTop="16dp"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>