Search layout with 2 edittext and 2 buttons

Question

I'm building an Android app and I'm new on building the UI on an .xml file. I've built a simple layout but I think that is not optimize very well.

This component is a search layout with 2 edittext and 2 buttons.

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/layout_search"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <RelativeLayout
        android:id="@+id/LayoutSetSearch_From"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content">

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="10dp"
            android:layout_alignParentLeft="true"
            android:text="from:"
            android:gravity="start"
            android:maxLines="1"
            android:layout_alignBottom="@+id/txtsetSearch_From"/>

        <EditText
            android:id="@+id/txtsetSearch_From"
            android:layout_width="120dip"
            android:layout_height="wrap_content"
            android:layout_centerVertical="true"
            android:layout_alignParentRight="true"
            android:layout_gravity="center_vertical"
            android:layout_marginRight="10dp"
            android:singleLine="true"
            android:gravity="center"
            android:clickable="false"
            android:cursorVisible="false"
            android:focusable="false"
            android:focusableInTouchMode="false"
            android:inputType="text"/>

    </RelativeLayout>

    <RelativeLayout
        android:id="@+id/LayoutSetSearch_To"
        android:layout_below="@+id/LayoutSetSearch_From"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="5dip">

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="10dp"
            android:layout_alignParentLeft="true"
            android:text="to:"
            android:gravity="start"
            android:maxLines="1"
            android:layout_alignBottom="@+id/txtsetSearch_To"/>

        <EditText
            android:id="@+id/txtsetSearch_To"
            android:layout_width="120dip"
            android:layout_height="wrap_content"
            android:layout_centerVertical="true"
            android:layout_alignParentRight="true"
            android:layout_gravity="center_vertical"
            android:layout_marginRight="10dp"
            android:singleLine="true"
            android:gravity="center"
            android:clickable="false"
            android:cursorVisible="false"
            android:focusable="false"
            android:focusableInTouchMode="false"
            android:inputType="text"/>

    </RelativeLayout>

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="48dp"
        android:layout_below="@+id/LayoutSetSearch_To"
        android:layout_marginTop="15dp">

        <View
            android:layout_width="match_parent"
            android:layout_height="1dip"
            android:layout_marginLeft="4dip"
            android:layout_marginRight="4dip"
            android:background="?android:attr/dividerVertical"
            android:layout_alignParentTop="true"/>

        <View
            android:layout_width="match_parent"
            android:layout_height="1dip"
            android:layout_marginLeft="4dip"
            android:layout_marginRight="4dip"
            android:background="?android:attr/dividerVertical"
            android:layout_alignParentBottom="true"/>
        <View
            android:id="@+id/ViewColorPickerHelper"
            android:layout_width="1dip"
            android:layout_height="wrap_content"
            android:layout_alignParentTop="true"
            android:layout_alignParentBottom="true"
            android:layout_marginBottom="4dip"
            android:layout_marginTop="4dip"
            android:background="?android:attr/dividerVertical"
            android:layout_centerHorizontal="true"/>

        <Button
            android:id="@+id/btn_search_summary"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="start"
            android:layout_alignParentLeft="true"
            android:layout_toLeftOf="@id/ViewColorPickerHelper"
            android:background="?android:attr/selectableItemBackground"
            android:layout_alignParentBottom="true" />

        <Button
            android:id="@+id/btn_reset_search_summary"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:layout_alignParentRight="true"
            android:background="?android:attr/selectableItemBackground"
            android:text="reset"
            android:layout_alignParentBottom="true"
            android:layout_toRightOf="@id/ViewColorPickerHelper"/>

    </RelativeLayout>

</RelativeLayout>

Answer 1

If you don't need them get rid of them, if you need them, then you need them. this is a binary thing, it's either 1 or 0.

You either have the object on the layout or you don't. there is not optimizing a layout unless you can remove something from it completely but that is going to depend on your logic and other code files, of which you aren't showing us.

---

You can limit your Attributes by

• not coding the attributes that you are going to set to defaults
• not coding the attributes that are inherited

Another way that you can reduce clutter in the layout is to define some styles by creating an xml file in the res/values/ folder of your project and do this

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <style name="MyStyle1">
        <item name="android:layout_width">wrap_content</item>
        <item name="android:layout_height">wrap_content</item>
        <!-- etc. -->
    </style>
</resources>

and then in your Layout XML you add the style to the layout element like this

<TextView
    style="@style/MyStyle1"
    android:text="to:"
    android:layout_alignBottom="@+id/txtsetSearch_To" />

note that I am not a professional, but I found Styles and Themes from doing a quick search for styles.xml android example

Don't forget about Developer.Android.com it can be very helpful.

---

Your naming is not so good, it could be better.

btn_reset_search_summary I know it's a button from the word "reset" and search_summary should be one word like this searchSummary so I would have it look like this reset_searchSummary so it's like action_objectActedUpon