I'm trying to set the end margin attribute for a view as following:
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto">
<TextView
android:id="@+id/title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Title"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toStartOf="@+id/sub_title"
android:layout_marginEnd="22dp"
/>
<TextView
android:id="@+id/sub_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="subTitle"
app:layout_constraintStart_toEndOf="@+id/title"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
It has no effect (screen of the preview):
When I set the marginStart
for the id:sub_title
TextView instead the margin works fine but I need the margin to be set on the id:title
TextView for another reason
Can I achieve the desired margin by specifying it for the id:title
TextView ?
One way to look into ConstraintLayout's
constraints is like you put in constraints and they start pulling the view towards the view its constrained to.
So, the issue with your layout code is that: No pull is being applied to your sub_title
view towards the end of your screen.
The Direction you view is being pulled (Ignore the spacing in the image it's in subtitle view):
Now when you put constraint to the subtitle end, the pull becomes equal and the views get centered. Now if you put some margin to the title it will be able to push the view by x
dp and to make them align to the start you need to put in some layout_constraintHorizontal_bias
magic and set it to 0.0
:
The final code will be something like this:
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="@+id/title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="22dp"
android:text="Title"
app:layout_constraintEnd_toStartOf="@+id/sub_title"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintHorizontal_chainStyle="packed"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="@+id/sub_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="subTitle"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="@+id/title"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
Lines of magic:
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintHorizontal_chainStyle="packed"
Result: