Optimizing a Google card layout

Question

I'm developing an Android app in which I would build a card layout with a custom library. I think that my layout has not been optimized, but I don't know how I can this. It's not a very simple layout for me, but I'm new to this and I can't make better.

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="horizontal"
    android:layout_width="match_parent"
    android:layout_height="110dp">

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="8dp"
        android:layout_marginStart="8dp"
        android:orientation="vertical">

            <RelativeLayout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content">

                <TextView
                    android:id="@+id/LVdate"
                    android:layout_marginTop="10dp"
                    android:layout_alignParentLeft="true"
                    android:layout_alignParentStart="true"
                    android:textStyle="bold"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"/>

                <TextView
                    android:id="@+id/LVtask"
                    android:layout_alignParentLeft="true"
                    android:layout_alignParentStart="true"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_below="@+id/LVdate"
                    android:textStyle="italic"/>

            </RelativeLayout>

            <RelativeLayout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginTop="8dp">

                <TextView
                    android:id="@+id/LVtxtWorkingH"
                    android:layout_alignParentLeft="true"
                    android:layout_alignParentStart="true"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="@string/TotalHours"/>

                <TextView
                    android:id="@+id/LVWorkingh"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_alignBottom="@+id/LVtxtWorkingH"
                    android:layout_toRightOf="@+id/LVtxtWorkingH"
                    android:layout_toEndOf="@+id/LVtxtWorkingH"/>

            </RelativeLayout>

            <RelativeLayout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content">

                <TextView
                    android:id="@+id/LVtxtOvertime"
                    android:layout_alignParentLeft="true"
                    android:layout_alignParentStart="true"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="@string/OverTime"/>

                <TextView
                    android:id="@+id/LVovertime"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_alignBottom="@+id/LVtxtOvertime"
                    android:layout_toRightOf="@+id/LVtxtOvertime"
                    android:layout_toEndOf="@+id/LVtxtOvertime"/>

            </RelativeLayout>

            <RelativeLayout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginBottom="8dp">

                <TextView
                    android:id="@+id/LVtxtTotalPayDay"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="@string/PayToday"/>

                <TextView
                    android:id="@+id/LVTotalPayDay"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_alignBottom="@+id/LVtxtTotalPayDay"
                    android:layout_toRightOf="@+id/LVtxtTotalPayDay"
                    android:layout_toEndOf="@+id/LVtxtTotalPayDay"/>

            </RelativeLayout>

    </LinearLayout>

    <RelativeLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center_vertical"
        android:layout_marginRight="8dp"
        android:layout_marginEnd="8dp">

        <ImageButton
            android:id="@+id/btnDeleteWD"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentRight="true"
            android:layout_alignParentEnd="true"
            android:src="@drawable/ic_action_discard"
            android:layout_marginBottom="18dp"
            android:background="@color/white"/>

        <ImageButton
            android:id="@+id/btnEditWD"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentRight="true"
            android:layout_alignParentEnd="true"
            android:background="@color/white"
            android:src="@drawable/ic_action_edit"
            android:layout_marginTop="18dp"
            android:layout_below="@+id/btnDeleteWD"/>

    </RelativeLayout>

</LinearLayout>

Answer 1

Aah! You're using way too many layouts than you need.

You're using leftOf and rightOf attribute of RelativeLayout but you are ignoring power top and below attributes.

You can use them and get rid of all middle layer RelativeLayouts and eventually once you fix that, you can also get rid of first LinearLayout as it's just wrapping the RelativeLayout

So your final layout hierarchy may look like this --> LinearLayout with two RelativeLayouts

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
          xmlns:tools="http://schemas.android.com/tools"
          android:orientation="horizontal"
          android:layout_width="match_parent"
          android:layout_height="110dp">

<RelativeLayout
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginLeft="8dp"
    android:layout_marginStart="8dp">

    <TextView
        android:id="@+id/LVdate"
        android:layout_marginTop="10dp"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"
        android:textStyle="bold"
        tools:text="LVDate"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"/>

    <TextView
        android:id="@+id/LVtask"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"
        android:layout_width="wrap_content"
        tools:text="LVtask"
        android:layout_height="wrap_content"
        android:layout_below="@+id/LVdate"
        android:textStyle="italic"/>

    <TextView
        android:layout_below="@id/LVtask"
        android:id="@+id/LVtxtWorkingH"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"
        android:layout_width="wrap_content"
        android:layout_marginTop="8dp"
        android:layout_height="wrap_content"
        android:text="TotalHours"/>

    <TextView
        android:id="@+id/LVWorkingh"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        tools:text="LVWorkingh"
        android:layout_alignBottom="@+id/LVtxtWorkingH"
        android:layout_toRightOf="@+id/LVtxtWorkingH"
        android:layout_toEndOf="@+id/LVtxtWorkingH"/>

    <TextView
        android:layout_below="@id/LVtxtWorkingH"
        android:id="@+id/LVtxtOvertime"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="OverTime"/>

    <TextView
        android:id="@+id/LVovertime"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        tools:text="LVovertime"
        android:layout_alignBottom="@+id/LVtxtOvertime"
        android:layout_toRightOf="@+id/LVtxtOvertime"
        android:layout_toEndOf="@+id/LVtxtOvertime"/>

    <TextView
        android:layout_below="@id/LVtxtOvertime"
        android:id="@+id/LVtxtTotalPayDay"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="PayToday"
        android:layout_marginBottom="8dp"/>

    <TextView
        android:id="@+id/LVTotalPayDay"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        tools:text="LVTotalPayDay"
        android:layout_alignBottom="@+id/LVtxtTotalPayDay"
        android:layout_toRightOf="@+id/LVtxtTotalPayDay"
        android:layout_toEndOf="@+id/LVtxtTotalPayDay"/>

</RelativeLayout>

<RelativeLayout
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="center_vertical"
    android:layout_marginRight="8dp"
    android:layout_marginEnd="8dp">

    <ImageButton
        android:id="@+id/btnDeleteWD"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_alignParentEnd="true"
        android:src="@android:drawable/ic_menu_delete"
        android:layout_marginBottom="18dp"
        android:background="#FFF"/>

    <ImageButton
        android:id="@+id/btnEditWD"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_alignParentEnd="true"
        android:background="#FFF"
        android:src="@android:drawable/ic_menu_delete"
        android:layout_marginTop="18dp"
        android:layout_below="@+id/btnDeleteWD"/>

</RelativeLayout>

</LinearLayout>

I hope this helps! :)

RelativeLayout is very powerful. You can also get rid of another RelativeLayout for buttons and use relative measurement to layout everything in just on RelativeLayout, but that might look little bit messy.