设计 Android EditText 来显示 google 所描述的错误信息

我需要一个看起来像这样的 EditText在错误:

enter image description here

调用 onError 看起来是这样的:

enter image description here

注意: 该应用程序在 SDK 19(4.4.2)上运行

最小 SDK 是1

是否有类似 setError 的方法自动执行此操作, 还是要我来写代码?

谢谢你

174303 次浏览

自从 Google 将 TextInputLayout作为 design-support-library的一部分引入以来,就没有必要使用第三方库了。

下面是一个基本的例子:

布局

<android.support.design.widget.TextInputLayout
android:id="@+id/text_input_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:errorEnabled="true">


<android.support.design.widget.TextInputEditText
android:id="@+id/edit_text"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Enter your name" />


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

注意: 通过将 app:errorEnabled="true"设置为 TextInputLayout的属性,它不会在显示错误时改变它的大小-所以它基本上阻塞了空间。

密码

为了显示 EditText下面的错误,你只需要在 TextInputLayout上调用 #setError(不是在子 EditText上) :

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

结果

picture showing the edit text with the error message

要隐藏错误并重置色彩,只需调用 til.setError(null)


注意

为了使用 TextInputLayout,你必须将以下内容添加到你的 build.gradle依赖项中:

dependencies {
compile 'com.android.support:design:25.1.0'
}

设置自定义颜色

默认情况下,EditText的行将是红色的。如果需要显示不同的颜色,可以在调用 setError时立即使用以下代码。

editText.getBackground().setColorFilter(getResources().getColor(R.color.red_500_primary), PorterDuff.Mode.SRC_ATOP);

要清除它,只需调用 clearColorFilter函数,如下所示:

editText.getBackground().clearColorFilter();

你的 EditText应该用 TextInputLayout包装

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


<EditText
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:inputType="textEmailAddress"
android:ems="10"
android:id="@+id/etEmail"
android:hint="Email"
android:layout_marginTop="10dp"
/>


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

要获得所需的错误消息,请将 error 设置为 TextInputLayout

TextInputLayout tilEmail = (TextInputLayout) findViewById(R.id.tilEmail);
if (error){
tilEmail.setError("Invalid email id");
}

您应该添加设计支持库依赖项

compile 'com.android.support:design:22.2.0'
TextInputLayout til = (TextInputLayout)editText.getParent();
til.setErrorEnabled(true);
til.setError("some error..");

ReVerse 的回答很棒,但是它没有指出如何删除浮动错误工具提示之类的东西

你需要 edittext.setError(null)来移除它。
另外,正如有人指出的,你不需要 TextInputLayout.setErrorEnabled(true)

布局

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


<EditText
android:id="@+id/edittext"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Enter something" />
</android.support.design.widget.TextInputLayout>

密码

TextInputLayout til = (TextInputLayout) editText.getParent();
til.setError("Your input is not valid...");
editText.setError(null);

调用 myTextInputLayout.setError()而不是 myEditText.setError()

这些容器和容器具有设置错误的双重功能。您所需要的功能是容器的功能之一。但是你可能需要最小版本的23。

如果任何人仍然面临着错误使用谷歌的设计库中提到的答案然后,请使用@h _ k 的评论这是-

您可能正在使用 EditText 上的 setError本身,而不是调用 TextInputLayout 上的 setError

private EditText edt_firstName;
private String firstName;


edt_firstName = findViewById(R.id.edt_firstName);


private void validateData() {
firstName = edt_firstName.getText().toString().trim();
if (!firstName.isEmpty(){
//here api call for ....
}else{
if (firstName.isEmpty()) {
edt_firstName.setError("Please Enter First Name");
edt_firstName.requestFocus();
}
}
}