Search code examples
androidandroid-linearlayout

Center LinearLayout on divider


I'd like to ask if there's a way to center LinearLayout on its divider, not contents?

I thought of copying the width of one cell to another, so both are equal.
Here's what I'm trying to achieve:

Here's the layout:

 <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:orientation="horizontal">

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:orientation="vertical"
                >

                <TextView
                    android:id="@+id/savings_accumulated_percentage_value_label"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="Zrealizowano:"

                    android:layout_gravity="end"
                    />


                <TextView
                    android:id="@+id/savings_accumulated_value_label"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="Zgromadzono:"

                    android:layout_gravity="end"

                    />

                <TextView
                    android:id="@+id/savings_target_value_label"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="Cel:"

                    android:layout_gravity="end"

                    />

                <TextView
                    android:id="@+id/savings_target_date_label"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="Data zakończenia:"

                    android:layout_gravity="end"
                    />

            </LinearLayout>

            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:orientation="vertical">


                <TextView
                    android:id="@+id/savings_accumulated_percentage_value"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="18%"
                    android:textColor="@color/colorAccent" />

                <TextView
                    android:id="@+id/savings_accumulated_value"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="865 zł"
                    android:textStyle="bold" />

                <TextView
                    android:id="@+id/savings_target_value"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="2 865 zł"
                    android:textColor="@color/colorPrimary"
                    android:textStyle="bold"

                    />

                <TextView
                    android:id="@+id/savings_target_date"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="03.07.2018"
                    />

            </LinearLayout>


        </LinearLayout>

enter image description here


Solution

  • You can use android:weightSum property of the parent layout and android:weight property on the child layouts to achieve this.

    The general rule is weightSum = sum of all weights of all immediate children (In the example below, its 2 = 1 + 1). Although you will not get any errors if the weights are not equal but the result might not be what you expected to look like.

    Here's a simple example.

     <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:layout_centerInParent="true"
        android:weightSum="2">  <!-- weightSum property -->
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="1">  <!-- weight property -->
            <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:gravity="center"
                android:text="hello"/>
        </LinearLayout>
    
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="1"> <!-- weight property -->
            <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:gravity="center"
                android:text="hi"/>
        </LinearLayout>
    </LinearLayout>