Styling Linear Layout with multi edit text

Question

I am trying to make a LinearLayout with several EditText for inputting fields like this:

I checked several answers here to make a custom drawable for the EditText but how can I make it for the whole linear layout?

Answer 1

You can't do this with a single LinearLayout. You need minimum 2 LinearLayouts with horizontal orientation, and one LinearLayout with vertial orientation, that contains those two.

And you can set the borders for your EditTexts with shape Drawables. See examples here: How to draw rounded rectangle in Android UI?

Answer 2

Try below code ,You can also inclue textview inside it,

<?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:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal" >

            <EditText
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="0.55" 
                android:background="@drawable/selector"/>

            <EditText
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="0.15" 
                android:background="@drawable/selector"/>


            <EditText
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="0.30" 
                android:background="@drawable/selector"/>
        </LinearLayout>

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

            <EditText
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="0.20" 
                android:background="@drawable/selector"/>

            <EditText
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="0.20" 
                android:background="@drawable/selector"/>

            <EditText
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="0.60"
                android:background="@drawable/selector" />
        </LinearLayout>

    </LinearLayout>


where selector drawable is xml file inside xml folder

selector.xml

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

       <solid android:color="@android:color/white" />


      <stroke 
        android:width="1dp"
        android:color="@android:color/black"
       />


      <padding
        android:left="5dp"
        android:right="5dp"
        android:top="5dp"
        android:bottom="5dp" />
    </shape>