Custom layout for input of data in android

Question

I am trying to achieve the things shown in figure

---

rounded_edittext.xml

<?xml version="1.0" encoding="utf-8"?>
<!-- res/drawable/rounded_edittext.xml -->
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:padding="10dp"
    android:shape="rectangle" >

    <solid android:color="#FFFFFF" />

    <corners
        android:bottomLeftRadius="10dp"
        android:bottomRightRadius="10dp"
        android:topLeftRadius="10dp"
        android:topRightRadius="10dp" />

</shape>

search_page.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:background="#C0C0C0"
    android:orientation="vertical" >

    <TableRow
        android:id="@+id/row1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" >

        <TextView
            android:id="@+id/textView1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="City" />

        <EditText
            android:id="@+id/editText1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="@drawable/rounded_edittext"
            android:ems="10"
            android:padding="5dip" />
    </TableRow>

    <TableRow
        android:id="@+id/row1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" >

        <TextView
            android:id="@+id/textView1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Date" />

        <EditText
            android:id="@+id/editText2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="@drawable/rounded_edittext"
            android:ems="10"
            android:inputType="date"
            android:padding="5dip" >

            <requestFocus />
        </EditText>
    </TableRow>

    <TableRow
        android:id="@+id/row1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" >

        <TextView
            android:id="@+id/textView1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Type" />

        <Button
            android:id="@+id/button1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Breakfast" />

        <Button
            android:id="@+id/button1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Lunch" />

        <Button
            android:id="@+id/button1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Dinner" />
    </TableRow>

    <TableRow
        android:id="@+id/row1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center" >

        <Button
            android:id="@+id/button1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:text="Search" />
    </TableRow>

</LinearLayout>

I have an output like below::

---

How to modify my xml so that i could achieve like below::

I am trying to get the exact same layout as above

• I am also trying to use a edittext for date as shown in the second pic wather than i have achieved
• also i am trying to get all the things in box rows as displayed as above

Any ideas ?

Hope i am clear !

Answer 1

try this
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >

<LinearLayout 
    android:orientation="horizontal"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:weightSum="1"
    >
    <TextView 
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:text="City"
        android:layout_weight=".25"/>
    <EditText 
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginLeft="10dp"
        android:layout_weight=".75"/>
</LinearLayout>

<View 
    android:layout_width="fill_parent"
    android:layout_height="1dp"
    android:background="@android:color/black"/>

<LinearLayout 
    android:orientation="horizontal"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:weightSum="1"
    >
    <TextView 
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:text="date"
        android:layout_weight=".25"/>
    <EditText 
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginLeft="10dp"
        android:layout_weight=".25"/>

    <EditText 
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginLeft="10dp"
        android:layout_weight=".25"/>

    <EditText 
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginLeft="10dp"
        android:layout_weight=".25"/>

    <EditText 
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginLeft="10dp"
        android:layout_weight=".25"/>
</LinearLayout>

<View 
    android:layout_width="fill_parent"
    android:layout_height="1dp"
    android:background="@android:color/black"/>

 <LinearLayout 
    android:orientation="horizontal"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:weightSum="1"
    >
    <TextView 
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:text="type"
        android:layout_weight=".25"/>
    <Button 
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginLeft="10dp"
        android:text="breakfast"
        android:textSize="10sp"
        android:layout_weight=".25"/>

    <Button 
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginLeft="10dp"
        android:text="lunch"
         android:textSize="10sp"
        android:layout_weight=".25"/>

    <Button 
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginLeft="10dp"
        android:text="dinner"
         android:textSize="10sp"
        android:layout_weight=".25"/>

</LinearLayout>

<View 
    android:layout_width="fill_parent"
    android:layout_height="1dp"
    android:background="@android:color/black"/>

<Button 
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="center_horizontal"
    android:text="Search"/>