ImageButon在文本输入内部编辑文本而不会丢失浮动标签

时间:2018-07-05 10:44:28

标签: android android-layout android-edittext

我有一些带有浮动标签的编辑文本,例如图片中的第一个

   <android.support.design.widget.TextInputLayout
                android:id="@+id/tlIdNumber"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginTop="@dimen/signup_edittext_margin_top"
                android:hint="@string/signup_id_number">


                <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
                    xmlns:tools="http://schemas.android.com/tools"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content">


                    <com.vipera.onepay.ui.component.custom.CustomTextInputEditText
                        android:id="@+id/etIdNumber"
                        android:layout_width="match_parent"
                        android:layout_height="@dimen/edit_text_height"
                        android:inputType="text"
                        android:textColor="@color/dark_gray"
                        android:textSize="@dimen/edit_text_size" />


                    <ImageButton
                        android:id="@+id/imgClearUser"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_alignBottom="@+id/etIdNumber"
                        android:layout_alignRight="@+id/etIdNumber"
                        android:layout_alignTop="@+id/etIdNumber"
                        android:background="@android:color/transparent"
                        android:padding="5dp"
                        android:src="@drawable/ic_clear_28dp" />

                </RelativeLayout>


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

Img without ImgBtn

并且我想在编辑文本的右侧有一个ImageButton,就像第二个一样,但是我丢失了提示和浮动标签...

{{1}}

img with ImgBtn

我想同时拥有imageButton和浮动标签。谢谢您的帮助!

1 个答案:

答案 0 :(得分:1)

使用FrameLayout并将这些视图分别保留给布局的子级。像

<FrameLayout
    android:layout_marginTop="@dimen/dp20"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <android.support.design.widget.TextInputLayout
        android:id="@+id/tlIdNumber"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:hint="signup_id_number">

        <EditText
            android:id="@+id/etIdNumber"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:paddingRight="40dp"
            android:inputType="text"
            android:textColor="#FF00FF"
            android:textSize="16sp" />

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

    <ImageButton
        android:id="@+id/imgClearUser"
        android:layout_gravity="right|center_vertical"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignBottom="@+id/etIdNumber"
        android:layout_alignRight="@+id/etIdNumber"
        android:layout_alignTop="@+id/etIdNumber"
        android:background="@android:color/transparent"
        android:padding="5dp"
        android:src="@android:drawable/ic_menu_close_clear_cancel" />
</FrameLayout>

这将起作用。在这里,使用EditText android:paddingRight="40dp"进行填充将处理以下情况:在键入文本时,文本不会进入关闭按钮。您可以根据您的UI要求增加或减少此值。


根据您的问题进行适当的对齐和查看属性,答案将为

<FrameLayout
    android:layout_marginTop="@dimen/signup_edittext_margin_top"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <android.support.design.widget.TextInputLayout
        android:id="@+id/tlIdNumber"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:hint="@string/signup_id_number">

        <com.vipera.onepay.ui.component.custom.CustomTextInputEditText
            android:id="@+id/etIdNumber"
            android:layout_width="match_parent"
            android:layout_height="@dimen/edit_text_height"
            android:inputType="text"
            android:paddingRight="40dp"
            android:textColor="@color/dark_gray"
            android:textSize="@dimen/edit_text_size" />
    </android.support.design.widget.TextInputLayout>

    <ImageButton
        android:id="@+id/imgClearUser"
        android:layout_gravity="right|center_vertical"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignBottom="@+id/etIdNumber"
        android:layout_alignRight="@+id/etIdNumber"
        android:layout_alignTop="@+id/etIdNumber"
        android:background="@android:color/transparent"
        android:padding="5dp"
        android:src="@drawable/ic_clear_28dp" />
</FrameLayout>