add guidelines under a button and to its right side

Question

I have an image view on the whole screen with a button on its right-bottom side.

Now, I don't succeed to place guildelines under the button and on its right side.

I want the button to be 4.1% "margined" from the right and 4.1% "margined" from the bottom, using guidelines.

Here's my attempt.

How to fix it?

    <?xml version="1.0" encoding="utf-8"?>
    <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"
        android:orientation="vertical">

        <ImageView
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:id="@+id/imageView" />


        <Button
            android:layout_width="wrap_content"
            android:layout_height="30dp"
            android:id="@+id/button_try"
            app:layout_constraintRight_toLeftOf="@+id/guideline_for_try_from_bottom"
            app:layout_constraintBottom_toTopOf="@+id/guideline_for_try_from_bottom"/>

        <androidx.constraintlayout.widget.Guideline
            android:id="@+id/guideline_for_try_from_bottom"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:orientation="vertical"
            app:layout_constraintWidth_max="26dp"
            app:layout_constraintWidth_min="15dp"
            app:layout_constraintRight_toRightOf="parent"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintGuide_percent="0.041" />

</androidx.constraintlayout.widget.ConstraintLayout>

it will look like:

                         |
            button  4.1% | END_OF_SCREEN
             4.1%        |
             ____________
       BOTTOM_OF_SCREEN

you have to specify guideline direction, for right -- start/end , for bottom: orientation will be horizontal and direction will be bottom , segregate two guideline one will not be suffice to align both right and Botton — Neha Rathore, Jun 29 '21 at 12:38

score 1 · Accepted Answer · answered Jun 29 '21 at 12:38

ConstraintLayout guideline percentage placements are measured from the top and left of the screen, so for a "4.1%" placement from the end or bottom, you will need to specify 1.0 - .041 or 0.956 as the percentage.

<androidx.constraintlayout.widget.Guideline
    android:id="@+id/guideline1"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:orientation="vertical"
    app:layout_constraintGuide_percent="0.956"/>

<androidx.constraintlayout.widget.Guideline
    android:id="@+id/guideline2"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:orientation="horizontal"
    app:layout_constraintGuide_percent="0.956"/>

score 1 · Answer 2 · answered Jun 29 '21 at 13:10

Another option without using guidelines is to use app:layout_constraintHorizontal_bias="0.956" and app:layout_constraintVertical_bias="0.956" to the button like below:

<Button
        android:id="@+id/button_try"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:insetLeft="0dp"
        android:insetTop="0dp"
        android:insetRight="0dp"
        android:insetBottom="0dp"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.956"
        app:layout_constraintVertical_bias="0.956"/>

add guidelines under a button and to its right side

2 Answers2