Search code examples
androidandroid-layoutandroid-linearlayout

design edit text in exact rectangular shape android linear layout without hard coding values


I want to design

this

layout i.e. width of edit text should be like this. For the following code

<LinearLayout android:layout_below="@+id/txt_buy_info"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:background="@drawable/side_nav_bar"
android:layout_marginTop="@dimen/activity_vertical_space"
xmlns:android="http://schemas.android.com/apk/res/android">
<LinearLayout
    android:layout_width="wrap_content"
    android:layout_height="match_parent"
    android:orientation="vertical">
    <android.support.v7.widget.AppCompatEditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@drawable/edittext_backgound"
        android:hint="Rate"
        android:textColor="@color/colorWhite"
        android:textColorHint="@color/colorWhite"
        android:textSize="@dimen/BTC_value_size"
        android:layout_weight="1"
        android:drawableRight="@drawable/ic_inr_24"
        android:gravity="center"/>
    <android.support.v7.widget.AppCompatEditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@drawable/edittext_backgound"
        android:hint="Amount"
        android:layout_marginTop="@dimen/view_internal_space"
        android:textColor="@color/colorWhite"
        android:textColorHint="@color/colorWhite"
        android:textSize="@dimen/BTC_value_size"
        android:layout_weight="1"
        android:drawableRight="@drawable/ic_inr_24"
        android:gravity="center"/>
    <android.support.v7.widget.AppCompatEditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@drawable/edittext_backgound"
        android:hint="Quantity"
        android:layout_marginTop="@dimen/view_internal_space"
        android:textColor="@color/colorWhite"
        android:textColorHint="@color/colorWhite"
        android:textSize="@dimen/BTC_value_size"
        android:layout_weight="1"
        android:drawableRight="@drawable/ic_bitcoin_24"
        android:gravity="center"/>
    <android.support.v7.widget.AppCompatButton
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="#ff61fffd"
        android:hint="Rate"
        android:layout_marginTop="@dimen/view_internal_space"
        android:textColor="@color/colorWhite"
        android:textColorHint="@color/colorWhite"
        android:textSize="@dimen/BTC_value_size"
        android:layout_weight="1"
        android:drawableRight="@drawable/ic_inr_24"
        android:gravity="center"/>
</LinearLayout>

it is giving output like

this

When I give match_parent to both width and height to inner linear layout, it does not look good, and when I tried to give left and right padding to inner linear layout the design becomes bad.I want to design this layout without giving the hard coded width.Please help


Solution

  • Try this :

     <LinearLayout android:layout_below="@+id/txt_buy_info"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:gravity="center"
        android:orientation="horizontal"
        xmlns:android="http://schemas.android.com/apk/res/android">
    
        <LinearLayout
            android:layout_width="0dp"
            android:layout_weight="0.4"
            android:layout_height="wrap_content"/>
    
        <LinearLayout
            android:layout_width="0dp"
            android:layout_weight="1"
            android:layout_height="match_parent"
            android:orientation="vertical">
    
            <android.support.v7.widget.AppCompatEditText
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:hint="Rate"
                android:layout_marginTop="20dp"
                android:textColor="@color/colorBlack"
                android:textColorHint="@color/colorBlack"
                android:gravity="center"/>
    
            <android.support.v7.widget.AppCompatEditText
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:hint="Amount"
                android:layout_marginTop="20dp"
                android:textColor="@color/colorBlack"
                android:textColorHint="@color/colorBlack"
                android:gravity="center"/>
    
            <android.support.v7.widget.AppCompatEditText
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:hint="Quantity"
                android:layout_marginTop="20dp"
                android:textColor="@color/colorBlack"
                android:textColorHint="@color/colorBlack"
                android:gravity="center"/>
    
            <android.support.v7.widget.AppCompatButton
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:background="#ff61fffd"
                android:hint="Rate"
                android:layout_marginTop="20dp"
                android:textColor="@color/colorBlack"
                android:textColorHint="@color/colorBlack"
                android:gravity="center"/>
    
        </LinearLayout>
    
        <LinearLayout
            android:layout_width="0dp"
            android:layout_weight="0.4"
            android:layout_height="wrap_content"/>
    
        </LinearLayout>