简体   繁体   中英

How to Constraint to Margin end?

I want to add an arrow icon to end of LinearLayout :

所需的布局

What is the best way to accomplish this?

I succeed by wrapping the LinearLayout and ImageView with ConstraintLayout , but it feels that there is a more elegant way than using app:layout_constraintHorizontal_bias="1" .

On first attempt the ImageView was part of the LinerLayout (without the ConstraintLayout ), is there is a way to get the desired layout from here?

第一次尝试

Current .xml :

<?xml version="1.0" encoding="utf-8"?>
<androidx.appcompat.widget.LinearLayoutCompat 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">

    <androidx.constraintlayout.widget.ConstraintLayout
        android:id="@+id/profile_constraint_layout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="@dimen/_16sdp">

        <androidx.appcompat.widget.LinearLayoutCompat
            android:id="@+id/profile_layout"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:gravity="start"
            android:orientation="horizontal">

            <androidx.appcompat.widget.AppCompatImageView
                android:id="@+id/imageView"
                android:layout_marginStart="@dimen/_4sdp"
                android:layout_width="48dp"
                android:layout_height="48dp"
                android:background="@drawable/ic_account_circle_black_48dp"
                android:contentDescription="@string/nav_bottom_sheet_profile_description" />

            <androidx.appcompat.widget.LinearLayoutCompat
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:orientation="vertical"
                android:layout_marginStart="@dimen/_4sdp">

                <androidx.appcompat.widget.AppCompatTextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="@string/jesta_profile_full_name_default"/>

                <androidx.appcompat.widget.AppCompatTextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="@string/jesta_profile_phone_number_default"/>
            </androidx.appcompat.widget.LinearLayoutCompat>

        </androidx.appcompat.widget.LinearLayoutCompat>

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:contentDescription="@string/jesta_profile_edit_profile_icon_description"
            android:src="@drawable/ic_keyboard_arrow_right_black_24dp"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toEndOf="@+id/profile_layout"
            app:layout_constraintTop_toTopOf="parent"
            app:layout_constraintHorizontal_bias="1"/>
    </androidx.constraintlayout.widget.ConstraintLayout>

...
</androidx.appcompat.widget.LinearLayoutCompat>

Constrain your arrow icon only for the top , bottom and end , it will automatically affix itself in the very end of your layout

so instead of this:

<ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:contentDescription="@string/jesta_profile_edit_profile_icon_description"
            android:src="@drawable/ic_keyboard_arrow_right_black_24dp"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toEndOf="@+id/profile_layout"
            app:layout_constraintTop_toTopOf="parent"
            app:layout_constraintHorizontal_bias="1"/>

have this:

    <ImageView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"    
                android:contentDescription="@string/jesta_profile_edit_profile_icon_description"
                android:src="@drawable/ic_keyboard_arrow_right_black_24dp"
                app:layout_constraintBottom_toBottomOf="parent"
                app:layout_constraintEnd_toEndOf="parent"
                app:layout_constraintTop_toTopOf="parent"
                />

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM