Nathiel Paulino
Nathiel Paulino

Reputation: 544

How to arrange items inside of LinearLayout to match to the parent width on android

I have some items inside of my LinearLayout and what I want to do is, arrange the items vertically in a way that it would spread evenly with default margin across the items.

This is what I have now :

enter image description here

So All the FAB's inside of the linear layout doesn't spread evenly, and even if I set a layout_marginStart it could cause some problems due to different resolutions across the android models.

<LinearLayout
        android:orientation="horizontal"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
        <FrameLayout
            android:layout_marginTop="25dp"
            android:layout_width="25dp"
            android:layout_height="wrap_content"
            android:layout_gravity="bottom|right">
            <com.google.android.material.floatingactionbutton.FloatingActionButton
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:elevation="0dp"
                app:backgroundTint="@color/gray"
                app:elevation="0dp"
                android:src="@android:color/transparent" />
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:textSize="10sp"
                android:text="S"
                android:elevation="16dp"
                android:textColor="@android:color/white"/>
        </FrameLayout>

Upvotes: 0

Views: 141

Answers (2)

Saikiran Kopparthi
Saikiran Kopparthi

Reputation: 52

You can use the layout_weight="value" property. So you can set the weight for each FAB so that they can evenly get separated in the layout.

For example if you want three FABs evenly seperate, you can set layout_weight="1" for each FAB, then it will seperate evenly. You can also use Decimal Values instead of 1.

Upvotes: 0

memres
memres

Reputation: 469

Try this instead of FrameLayout:

<RelativeLayout
    android:layout_width="0dp"
    android:layout_weight="1"
    android:layout_height="wrap_content"
    android:layout_marginTop="25dp">
    <com.google.android.material.floatingactionbutton.FloatingActionButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:elevation="0dp"
        android:src="@android:color/transparent"
        app:backgroundTint="@color/gray"
        android:layout_centerInParent="true"
        app:elevation="0dp" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:elevation="16dp"
        android:text="S"
        android:textColor="@android:color/white"
        android:textSize="10sp" />
</RelativeLayout>

The children of a LinearLayout spread evenly when they have android:layout_width="0dp" and android:layout_weight="1"

Upvotes: 1

Related Questions