CODEWITHSUNDEEP
androidandroid-layoutuser-interface
AngryOliver
AngryOliver

Reputation: 397

EditText and Button side by side

I want to present in my layout an EditText and a Button side by side with a small space (margin) between them. I don't want to set a fixed size (I think that's a bad habit).

How to do that?

My Try:

<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content" >

<EditText
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_gravity="left"
    android:layout_alignParentLeft="true" />

<Button
    android:id="@+id/btn_search"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentRight="true"
    android:layout_gravity="right" 
    android:text="Search" />
 </RelativeLayout>

Upvotes: 0

Views: 3949

Answers (3)

Abhishek Dhiman
Abhishek Dhiman

Reputation: 1651

You can use Linear layout with horizontal orientation and add an EditText and Button in the following way

<LinearLayout
orientation="horizontal"
layoutwidth="match_parent"
layoutheight="wrap_content">

<EditText
layoutwidth="0dp"
layoutheight="wrap"
layout_weight=".8"/>

<Button
layoutwidth="0dp"
layoutheight="wrap"
layout_weight=".2"/>

</LinearLayout>

Hope this will solve your problem. Make sure to change the weights according to your needs.

Thanks

Upvotes: 2

someone
someone

Reputation: 427

Use Linear layout to show both side by side and use 'match_parent' and 'wrap_content' appropriately.

Here's a piece of xml code

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"

    android:orientation="vertical" >

    <EditText
        android:id="@+id/et"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:ems="10" >

        <requestFocus />
    </EditText>

    <Button
        android:id="@+id/go"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Go!!" />

</LinearLayout>

Upvotes: 1

Evan Bashir
Evan Bashir

Reputation: 5551

You're using a RelativeLayout; however, you cannot created a flexible design within that type of ViewGroup. You must use a LinearLayout.

We use android:layout_weight="1" along with the android:layout_width="0dp" to create a flexible control. Adjust the weight number for different size ratios.

Afterwards, we use android:layout_margin on both controls so the resulting weighted size of each is equal.

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

    <EditText
        android:layout_width="0dp"
        android:layout_weight="1"
        android:layout_height="wrap_content"
        android:layout_marginRight="8dp" />

    <Button
        android:id="@+id/btn_search"
        android:layout_width="0dp"
        android:layout_weight="1"
        android:layout_height="wrap_content"
        android:text="Search"
        android:layout_marginLeft="8dp" />
</LinearLayout>

Upvotes: 4

Related Questions