EditText and ImageButton inside a textInputLayout

2

I try to place the EditText and the ImageButton inside a textInputLayout horizontally, in the Preview of android it appears fine, but when executing in the emulator nothing appears. What I want to do is a field where the user can enter their date of birth and I want to add the ImageButton so that when you click there a calendar opens, and I do not want to change the container since with the textInputLayout I can make the textHint go to the upper part remaining as a title (Date of Birth).

<android.support.design.widget.TextInputLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="20dp"
        android:weightSum="1"
        android:orientation="horizontal"
        style="@style/textInputLayoutOutlinedBoxDense">

        <android.support.design.widget.TextInputEditText
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight=".9"
            android:hint="Fecha de Nacimiento"/>

        <ImageButton
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight=".1"/>

    </android.support.design.widget.TextInputLayout>
    
asked by Leonidas 13.11.2018 в 15:09
source

1 answer

0

I included the LinearLayout between the Coordinator and the TextInputLayout , moved the ImageButton to the LinearLayout and accommodated the layout. To the button out there you should wrapearlo in a FrameLayout and give it a specific size.

<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    xmlns:app="http://schemas.android.com/apk/res-auto">
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:weightSum="100">
        <android.support.design.widget.TextInputLayout
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_marginTop="20dp"
            android:layout_weight="90"
            app:counterEnabled="true">

            <android.support.design.widget.TextInputEditText
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:hint="Fecha de Nacimiento"/>

        </android.support.design.widget.TextInputLayout>
        <ImageButton
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="10"
            android:layout_gravity="center"/>
    </LinearLayout>
</android.support.design.widget.CoordinatorLayout>

And it looks like this:

II) Another option is to use drawableRight of TextInputEditText .

<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    xmlns:app="http://schemas.android.com/apk/res-auto">
        <android.support.design.widget.TextInputLayout
            android:id="@+id/ti"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="20dp"
            app:counterEnabled="true">

            <android.support.design.widget.TextInputEditText
                android:id="@+id/tied"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:drawableRight="@drawable/calendario"
                android:drawablePadding="5dp"
                android:hint="Fecha de Nacimiento"/>

        </android.support.design.widget.TextInputLayout>
</android.support.design.widget.CoordinatorLayout>

And in onCreate() of Activity

tied = findViewById(R.id.tied);

tied.setOnTouchListener(new View.OnTouchListener() {
       @Override
       public boolean onTouch(View v, MotionEvent event) {

           final int DRAWABLE_RIGHT = 2;

           if(event.getAction() == MotionEvent.ACTION_UP || event.getAction() == MotionEvent.ACTION_POINTER_UP) {
               if(event.getRawX() >= (tied.getRight() - tied.getCompoundDrawables()[DRAWABLE_RIGHT].getBounds().width())) {

                   Log.d(TAG, "Click en imagen"); // Lo que acciona el click

                   return true;
               }
           }
           return false;
       }
});

Note: The image is 30 x 30 px. To change the size you have to change the size of the PNG.

    
answered by 13.11.2018 / 16:08
source