Button on top of an editText

1

I really do not know if that is the most appropriate title but I need to make a button this over an editext, in the picture below you see what I need, for now this is the code that I have in the xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    style="@style/App"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="center_horizontal"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="com.cjamcu.ligo.LoginActivity">


    <ScrollView
        android:id="@+id/login_form"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <LinearLayout
            android:id="@+id/email_login_form"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="50dp"
            android:orientation="vertical">


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

                <com.cjamcu.ligo.lib.AssetDrawableCompatEditText
                    android:id="@+id/et_email"
                    android:layout_width="0dp"
                    android:layout_height="40dp"
                    android:layout_marginRight="8dp"
                    android:layout_weight="15"
                    android:background="@drawable/rounded_edittext"
                    android:drawablePadding="8dp"
                    app:drawableLeftCompat="@drawable/ic_arrow_drop_down_black_24dp" />

                <ImageButton

                    android:id="@+id/btnLogin"
                    style="@style/AppTheme.RoundedCornerMaterialButton"

                    android:layout_weight="1"
                    android:src="@android:drawable/ic_menu_send" />
            </LinearLayout>


        </LinearLayout>

    </ScrollView>
</LinearLayout>

    
asked by cjamdeveloper 12.06.2018 в 23:38
source

2 answers

0

Here is exactly what you need.

drawables / btn.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
            <solid  android:width="1dp" android:color="@color/colorAccent"/>
            <corners android:radius="50dp"/>
            <padding android:bottom="5dp" android:left="10dp" android:right="10dp" android:top="5dp"/>
        </shape>
    </item>
</selector>

/drawables/edit.xml

<?xml version="1.0" encoding="utf-8"?>
    <selector xmlns:android="http://schemas.android.com/apk/res/android">
        <item>
            <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
                <stroke  android:width="1dp" android:color="@color/colorAccent"/>
                <corners android:radius="50dp"/>
                <padding android:bottom="0dp" android:left="5dp" android:right="5dp" android:top="0dp"/>
           </shape>
        </item>
</selector>

layout / edit_boton_ejempo.xml

<ImageView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:src="@drawable/mail"
    android:layout_alignBottom="@id/imageButton"
    android:layout_alignParentStart="true"
    android:layout_alignParentTop="true"
    android:layout_margin="5dp"/>

<EditText
    android:id="@+id/edit"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignBottom="@id/imageButton"
    android:layout_alignParentEnd="true"
    android:layout_alignParentStart="true"
    android:layout_alignParentTop="true"
    android:background="@drawable/edit"
    android:hint="[email protected]"
    android:paddingEnd="50dp"
    android:paddingStart="50dp"
    android:singleLine="false" />

<ImageButton
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentEnd="true"
    android:layout_alignParentTop="true"
    android:background="@drawable/btn"
    android:src="@drawable/send"
    android:id="@+id/imageButton" />

Accept my answer if it works for you and give it +1 if you like

Edit assignment of backgrounds was wrong

    
answered by 18.06.2018 / 21:33
source
1

Instead of a Linearlayout use a RelativeLayout this so you can position the image to the right of EditText using the property android:layout_alignRight

This is an example that I have where I define that ImageButton will be positioned to the right of EditText :

<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content">
  <EditText
      android:id="@+id/myEditText"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:hint="[email protected]"/>
    <ImageButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/ic_arrow_right"
        android:layout_alignRight="@+id/myEditText"/>
</RelativeLayout>

to get

In your code it would be this way replacing the container of the EditText and the ImageButton for a RelativeLayout :

   <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="10dp"
        android:orientation="horizontal">

        <com.cjamcu.ligo.lib.AssetDrawableCompatEditText
            android:id="@+id/et_email"
            android:layout_width="0dp"
            android:layout_height="40dp"
            android:layout_marginRight="8dp"                    
            android:background="@drawable/rounded_edittext"
            android:drawablePadding="8dp"
            app:drawableLeftCompat="@drawable/ic_arrow_drop_down_black_24dp" />

        <ImageButton

            android:id="@+id/btnLogin"
            style="@style/AppTheme.RoundedCornerMaterialButton"
            android:src="@android:drawable/ic_menu_send"
            android:layout_alignRight="@+id/et_email" />
    </RelativeLayout>
    
answered by 13.06.2018 в 20:02