如何在新的android设计库中使用TextInputLayout

Question

最近谷歌推出了新的Android设计库，其中介绍了如何使用TextInputLayout字段启用EditText的浮动提示功能。

没有太多指导here。

此页面显示

  

现在可以将其包装在TextInputLayout

中

但不知道，因为智能预测（Ctrl + SPACE）不会预测TextInputLayout的任何属性。所以我的问题是：

我们如何掌握这个组件底层的EditText？

我们如何从EditText获取数据？

Answer 1

EditText扩展TextInputLayout课程。 这意味着您必须将<android.support.design.widget.TextInputLayout android:layout_width="match_parent" android:layout_height="wrap_content"> <EditText android:layout_width="match_parent" android:layout_height="wrap_content" android:hint="hint" android:id="@+id/editText1" /> </android.support.design.widget.TextInputLayout> 包裹在{{1}}。

中

{{1}}

Answer 2

这是在design support library“浮动标签下编辑文字”中定义的。

     <android.support.design.widget.TextInputLayout
            android:id="@+id/name_et_textinputlayout"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="@dimen/activity_vertical_margin">

            <EditText
                android:id="@+id/FeedBackerNameET"
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:hint="hinttext"
                android:inputType="textPersonName|textCapWords" />
     </android.support.design.widget.TextInputLayout>

Answer 3

将TextInputLayout包裹在TextInputEditText而不是EditText。

环绕EditText时，横向模式确实存在问题。参考 this article了解更多详情。

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

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

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

Answer 4

为了使其正常运行，您应该让应用主题从Theme.AppCompat（或其后代）主题延伸，例如从Theme.AppCompat.Light.NoActionBar延伸。

Answer 5

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

    <EditText
        android:id="@+id/et_message"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:hint="@string/type_message"
        android:maxLines="5"/>

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

一旦开始输入编辑文本，

提示将自动向上移动，并且在文本输入布局上显示编辑文本下方出现的错误设置错误，这样就不在编辑文本上

tilMessage.setError("Message field is empty!");

禁用错误

tilMessage.setErrorEnabled(false);

Answer 6

正确的方法......

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

            <android.support.design.widget.TextInputEditText
                android:id="@+id/card_id_edit_text"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:hint="@string/form_card_id_text"
                android:inputType="number"
                android:maxLength="10"/>
        </android.support.design.widget.TextInputLayout>

如果您像使用TextInputLayout的子项一样使用EditText，您将在Android Monitor中看到此消息：

  

I / TextInputLayout：添加的EditText不是TextInputEditText。请转而使用该课程。

Answer 7

有了Material Components Library，就有了一个新的TextInputLayout组件。

只需使用：

<com.google.android.material.textfield.TextInputLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:hint="@string/hint_text">

  <com.google.android.material.textfield.TextInputEditText
      android:layout_width="match_parent"
      android:layout_height="wrap_content"/>

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

在official doc中，您可以找到所有信息。

Answer 8

我们也可以使用AppCompactEditText来增加支持：appcompat in gradle

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

    <android.support.v7.widget.AppCompatEditText
        android:id="@+id/et_name"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:hint="@string/hint"
        android:maxLength="100"
        android:inputType="textNoSuggestions"
        android:textColor="@color/colorPrimary"
        android:textSize="@dimen/font_size_large" />

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

Answer 9

经验法则：TextInputLayout应该包装TextInputEditText而不是普通的EditText。

原因？ TextInputEditText是EditText的子类，旨在用作TextInputLayout的子代。

此外，改用EditText会向我们发出警告：添加的EditText不是TextInputEditText。请改用该类。