Dayerman
Dayerman

Reputation: 4003

Align Button and EditText on Relative Layout

I have this code as the footer of my listview. Its just an EditText and a Button to send messages.

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent" android:orientation="vertical"
    android:layout_height="fill_parent" android:id="@+id/relativelayout_messages" android:gravity="right" 
    android:background="@drawable/fondomain" android:paddingTop="4dp">   

<ListView android:id="@+id/android:list" android:listSelector="@android:color/transparent"
    android:layout_width="fill_parent" android:layout_height="fill_parent"
    android:divider="@layout/linedivider" android:dividerHeight="8dp"
    android:cacheColorHint="#0000" android:paddingTop="5dp"  
    android:layout_alignParentTop="true" android:footerDividersEnabled="true" 
    android:paddingLeft="10dp" android:paddingRight="10dp"
    android:layout_above="@+id/InnerRelativeLayout"     
    android:fastScrollEnabled="true"
 />

<!-- footer -->
<RelativeLayout  xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/InnerRelativeLayout"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true"
    android:layout_marginTop="10dp"
    android:background="@color/greytable"
    android:paddingTop="5dp"
    android:paddingRight="3dp"
    android:paddingLeft="3dp">

    <EditText
        android:id="@+id/et_sent_msg"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"           
        android:layout_toLeftOf="@+id/bt_sent_msg" >
    </EditText>

    <Button
        android:text="Enviar"
        android:id="@+id/bt_sent_msg"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@layout/selector_button_msg"
        android:textSize="15dp"
        android:textStyle="bold"
        android:gravity="center"
        android:textColor="@color/black"           
        android:layout_alignParentRight="true" />
</RelativeLayout>

Ant this is the shape for the button background

<selector
xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true" >
    <shape>
        <gradient
            android:startColor="#757202"
            android:endColor="#757202"
            android:angle="270" />    
        <corners
            android:radius="3dp" />
        <padding
            android:left="10dp"
            android:top="10dp"
            android:right="10dp"
            android:bottom="10dp" />
        <stroke android:width="1dp" android:color="#919790"/>   
    </shape>
</item>

<item>        
    <shape>
        <gradient
            android:startColor="#FFF038"
            android:endColor="#FFFF6C"
            android:angle="270" />    
        <corners
            android:radius="3dp" />
        <padding
            android:left="10dp"
            android:top="10dp"
            android:right="10dp"
            android:bottom="10dp" />   
        <stroke android:width="1dp" android:color="#919790"/>                   
    </shape>
</item>

It's not easy to see at first glance but my EdiTextis not completely align with my Button. As you can see

enter image description here

Upvotes: 1

Views: 9644

Answers (2)

Vineet Shukla
Vineet Shukla

Reputation: 24021

You need to do:

  1. Set android:layout_alignParentBottom="true" to both your edittext and button.
  2. Set android:layout_alignParentLeft="true" to edittext.
  3. Set android:layout_toRightOf="@+id/edittextid" to button.

Adding your modified code for footer:

<RelativeLayout  xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/InnerRelativeLayout"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true"
    android:layout_marginTop="10dp"
    android:paddingTop="5dp"
    android:paddingRight="3dp"
    android:paddingLeft="3dp">

    <EditText
        android:id="@+id/et_sent_msg"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_toLeftOf="@+id/bt_sent_msg" >
    </EditText>

    <Button
        android:text="Enviar"
        android:id="@+id/bt_sent_msg"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="15dp"
        android:textStyle="bold"
        android:gravity="center"
        android:textColor="@color/black"
        android:layout_alignParentBottom="true"
        android:layout_alignParentRight="true" />
</RelativeLayout>

Upvotes: 4

Dmitry Ryadnenko
Dmitry Ryadnenko

Reputation: 22512

Allign edit text to bottom left corner of the parent. Then allign you button to the right of edit text and allign button top to edit text top and button bottom to edit text bottom

Upvotes: 0

Related Questions