在EditText下面显示Helper文本以及提示

时间:2015-11-24 10:44:14

标签: android android-layout android-edittext androiddesignsupport android-textinputlayout

我正试图在这些方面做点什么:

EditText example

我可以使用android:hint="Email Address"显示提示但无法显示帮助文字 - 这将是您的电子邮件用户名

    <android.support.design.widget.TextInputLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <EditText
            android:id="@+id/et_username"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:ems="15"
            android:hint="Username"
            app:et_helper="Username is preferably your registered email"/>

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

我所得到的只是用户名最好是您注册的电子邮件以下edittext:

输出:

output

任何指针都表示赞赏。谢谢。

7 个答案:

答案 0 :(得分:23)

最好的方法是使用TextInputLayout。谷歌在新的设计库中引入了它。要使用TextInputLayout,您必须将以下内容添加到build.gradle依赖项中:

compile 'com.android.support:design:22.2.0'

然后在xml文件中使用它:

<android.support.design.widget.TextInputLayout
android:id="@+id/textInputLayout"
android:layout_width="wrap_content"
android:layout_height="wrap_content">

<EditText
    android:id="@+id/editText"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:hint="Enter your name"/>
</android.support.design.widget.TextInputLayout>

您可以通过设置错误true来设置文本。尽管它是显示错误,但它适合您的使用。如果需要,您可以更改颜色和字体。

TextInputLayout til = (TextInputLayout)    findViewById(R.id.textInputLayout);
til.setErrorEnabled(true);
til.setError("You need to enter a name");

enter image description here

答案 1 :(得分:3)

TextInputLayout不提供帮助文本。但是,下面的文章有一个工作的例子。它使用一个从TextInputLayout扩展的类,方法是将HelperText作为另一个指示符添加到类中,与ErrorText一起使用。

https://medium.com/@elye.project/material-login-with-helper-text-232472400c15#.vm28p662v

答案 2 :(得分:3)

借助设计支持库28,在TextInputLayout中添加了内置的帮助器Text功能。

 implementation 'com.android.support:design:28.0.0'

现在使用xml或以编程方式启用错误

 textInputLayout.isHelperTextEnabled=true
 textInputLayout.error="Email can not be Empty!!!"

而且,提示和错误现在可以一起使用!

示例

et.setOnFocusChangeListener { v, b ->
            if (b) {
                textInputLayout.helperText = "yourhelperText"

            } else {
                textInputLayout.helperText = null
                if(et.text.toString()==""){    // or any other validation
                    textInputLayout.error="Email can not be Empty!!!"
                }
            }

TextInputLayout | Android Developers

编辑不要忘记通过xml或以编程方式启用错误和helperText。

答案 3 :(得分:3)

带有 TextInputLayout OutlinedBox 样式和 TextInputEditText 的完整 XML

       <com.google.android.material.textfield.TextInputLayout
            android:id="@+id/til_customer_no"
            style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginStart="5dp"
            android:layout_marginLeft="5dp"
            android:layout_marginEnd="5dp"
            android:layout_marginRight="5dp"
            android:padding="3dp"
            app:helperTextEnabled="true"
            app:helperText="* Enter customer number that will be used">

            <!--android:maxLength="13"-->
            <com.google.android.material.textfield.TextInputEditText
                android:id="@+id/et_customer_no"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:hint="Customer No"
                android:inputType="number" />

        </com.google.android.material.textfield.TextInputLayout>

答案 4 :(得分:1)

所以你想要的是这个:

Helper Text

您可以使用此库来实现此目的:

https://github.com/rengwuxian/MaterialEditText

您可以设置“帮助文本”属性以显示该行下方的文本,并设置“提示”以显示该行上方的文本。以下是附图的样本布局

<com.rengwuxian.materialedittext.MaterialEditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:hint="Password"
        android:inputType="textPassword"
        app:met_floatingLabel="normal"
        app:met_helperText="Must contain at least 8 characters"
        app:met_helperTextAlwaysShown="true"/>

答案 5 :(得分:0)

我有类似问题here。 如果你想在LinearLayout中将两个EditText视图一起垂直关闭,我认为没有办法。我认为,一种方法是你可以将顶部EditText的android:gravity设置为较低的EditText,将其设置为'bottom'和'top'。但在RelativeLayout中,这应该很容易。

如果要在用户输入时显示提示文本(在EdiText之上),可以使用TextInputLayout。通常设置提示EditText不会这样。通过触摸视图聚焦后,提示文本将消失。

答案 6 :(得分:0)

您可以通过以下方式简单地在app:helperText(带有库TextInputLayout)中使用com.google.android.material:material:1.2.1属性:

<com.google.android.material.textfield.TextInputLayout
        ...
        android:hint="Email Address"
        app:helperText="This will be your email username">

        <com.google.android.material.textfield.TextInputEditText
            ... />

</com.google.android.material.textfield.TextInputLayout>

或以编程方式(kotlin):

textInputLayout.helperText = "This will be your email username"