TextInputLayout

最新推荐文章于 2020-02-08 16:08:54 发布

原创最新推荐文章于 2020-02-08 16:08:54 发布 · 964 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#android

android 专栏收录该内容

11 篇文章

订阅专栏

本文详细介绍了Android设计支持库中的TextInputLayout组件，包括其如何改进提示和错误文本处理，以及如何在布局中使用该组件。同时，文章还提供了解决在使用过程中可能出现的错误的解决方案。

TextInputLayout是Android 设计支持库（designer support library）中的组建，与标准的EditText相比，多了一些很亮的功能，改进了提示和错误文本的处理。

尽管TextView (EditText的子类)已经支持提示和错误文本，但是这有点过时了，而且并不符合材料设计的风格。TextInputLayout改进了这点，它本身包装一个标准的EditText，实现功能的材料化。

首先，需要导入设计支持库。在build.gradle文件中添加依赖：

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

当然除了像这样手动添加外，也可以在Android Studio中打开Project Structure 菜单，一样也可以添加依赖。

库导入成功后，我们来创建一个布局，把一个EditText内嵌到TextInputLayout中：

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
  xmlns:tools="http://schemas.android.com/tools"
  xmlns:app="http://schemas.android.com/apk/res-auto"
  android:layout_width="match_parent"
  android:layout_height="match_parent"
  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=".MainActivity">
 
  <View
    android:layout_width="match_parent"
    android:layout_height="1dp"
    android:focusable="true"
    android:focusableInTouchMode="true" />
 
  <android.support.design.widget.TextInputLayout
    android:id="@+id/text_input_layout"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentTop="true"
    app:errorEnabled="true">
 
    <EditText
      android:id="@+id/edit_text"
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:imeOptions="actionGo"
      android:inputType="text"
      android:singleLine="true" />
 
  </android.support.design.widget.TextInputLayout>
 
</RelativeLayout>

TextInputLayout上面的那个View，放在这里是为了初次加载布局文件的时候获得焦点用的。因为提示文本的位置、颜色、大小会随着EditText获得焦点而发生改变，所以放置这个拥有焦点的View 可以让我们看到这个变化。

仅仅只需要在定义app:errorEnabled="true"

接着在Activity中编写显示错误文本和提示文本的代码:

public class MainActivity extends Activity {

    private static final int MIN_TEXT_LENGTH = 4;
    private static final String EMPTY_STRING = "";

    private TextInputLayout textInputLayout;
    private EditText editText;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        textInputLayout = (TextInputLayout) findViewById(R.id.text_input_layout);
        editText = (EditText) findViewById(R.id.edit_text);

        textInputLayout.setHint(getString(R.string.hint));
        editText.setOnEditorActionListener(ActionListener.newInstance(this));
    }

    private boolean shouldShowError() {
        int textLength = editText.getText().length();
        return textLength > 0 && textLength < MIN_TEXT_LENGTH;
    }

    private void showError() {
        textInputLayout.setError("字数不够");
    }

    private void hideError() {
        textInputLayout.setError(EMPTY_STRING);
    }

    private static final class ActionListener implements TextView.OnEditorActionListener {
        private final WeakReference<MainActivity> mainActivityWeakReference;

        public static ActionListener newInstance(MainActivity mainActivity) {
            WeakReference<MainActivity> mainActivityWeakReference = new WeakReference<>(mainActivity);
            return new ActionListener(mainActivityWeakReference);
        }

        private ActionListener(WeakReference<MainActivity> mainActivityWeakReference) {
            this.mainActivityWeakReference = mainActivityWeakReference;
        }

        @Override
        public boolean onEditorAction(TextView v, int actionId, KeyEvent event) {
            MainActivity mainActivity = mainActivityWeakReference.get();
            if (mainActivity != null) {
                if (actionId == EditorInfo.IME_ACTION_GO && mainActivity.shouldShowError()) {
                    mainActivity.showError();
                } else {
                    mainActivity.hideError();
                }
            }
            return true;
        }
    }
}

在调试上述代码的过程中，可能会出现“Error inflating class android.support.design.widget.TextInputLayout”的错误，把style.xml中设置的主题改成“Theme.AppCompat ”下的主题就可以了。