How can place a imageButton inside a textfield?

Question

How can i create a text field with a button at the left side like whatsapp's smiley button and i also want my text to start after the button.

@marcellothearcane i have not tried anything yet. I try to think of something first before trying. — Opeyemi Sanusi, Jun 04 '17 at 20:55
You could check out these links i found. https://stackoverflow.com/questions/3554377/handling-click-events-on-a-drawable-within-an-edittext/7295931#7295931 https://stackoverflow.com/questions/13151366/how-to-place-button-inside-of-edit-text — Opeyemi Sanusi, Jun 04 '17 at 21:27

Rajesh Tiwari · Answer 1 · 2017-06-05T12:08:37.710

Set icon by drawableLeft of EditText and to perform click on that icon write down below code.

 editText.setOnTouchListener(new View.OnTouchListener() {
            @Override
            public boolean onTouch(View v, MotionEvent event) {
                if (event.getRawX() <= (back.getCompoundDrawables()[0].getBounds().width())) {
                    // Your Code
                    return true;
                }
                return false;
            }
        });

Robert K. · Answer 2 · 2017-06-04T20:54:21.367

0

Position them one after another in a LinearLayout and you are good to go. You don't need it to be inside. Structure is as follows:

<LinearLayout>
    <Button/>
    <EditText/>
</LinearLayout>

edited Jun 04 '17 at 20:54

answered Jun 04 '17 at 20:51

Robert K.

1,043
1
8
20

i mean a form not a text, just added an image you could check it out – Opeyemi Sanusi Jun 04 '17 at 20:53
okay? but i would not be inside the text field just beside it – Opeyemi Sanusi Jun 04 '17 at 20:59
Of course. What is the point in having them inside each other? – Robert K. Jun 04 '17 at 21:00
i don't want it to be too small cause a button would also be on the right side. if i put two buttons at the sides, they both have to be small and the form would also have to shrink – Opeyemi Sanusi Jun 04 '17 at 21:05

score 0 · Accepted Answer · answered Jun 04 '17 at 22:39

Here is the working code:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true">


    <!-- CONTENT -->

    <!-- BOTTOM INPUT SECTION -->
    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:background="@android:color/darker_gray"
        android:padding="8dp">

        <ImageButton
            android:id="@+id/button_group"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentRight="true"
            android:layout_centerVertical="true"
            android:src="@drawable/ic_group"
            android:background="@android:color/transparent"/>

        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_alignParentLeft="true"
            android:layout_toLeftOf="@id/button_group"
            android:layout_marginRight="8dp"
            android:background="@android:color/white"
            android:padding="8dp">

            <ImageButton
                android:id="@+id/button_emoji"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentLeft="true"
                android:layout_centerVertical="true"
                android:src="@drawable/ic_smile_face"
                android:background="@android:color/transparent"/>

            <ImageButton
                android:id="@+id/button_camera"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentRight="true"
                android:layout_centerVertical="true"
                android:src="@drawable/ic_camera"
                android:background="@android:color/transparent"/>

            <EditText
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_toRightOf="@id/button_emoji"
                android:layout_toLeftOf="@id/button_camera"
                android:layout_marginLeft="8dp"
                android:layout_marginRight="8dp"
                android:layout_centerVertical="true"
                android:hint="Type a message"
                android:background="@null" />

        </RelativeLayout>
    </RelativeLayout>
</RelativeLayout>

OUTPUT:

How can place a imageButton inside a textfield?

3 Answers3