前言

Material Design 系列第二篇 TextInputLayout

引用

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

一：TextInputLayout如何使用

Untitled.gif

1. xml


    <android.support.design.widget.TextInputLayout
        android:id="@+id/usernameWrapper"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:hint="请输入账号"
        app:counterEnabled="true"
        app:counterMaxLength="6"
        app:counterOverflowTextAppearance="@style/MyStyle2"
        app:errorEnabled="true"
        app:errorTextAppearance="@style/MyStyle3"
        app:hintAnimationEnabled="true"
        app:hintEnabled="true"
        app:hintTextAppearance="@style/MyStyle">

        <EditText
            android:id="@+id/username"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:inputType="textEmailAddress" />

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

2. activity代码

public class TextInputLayoutAct extends AppCompatActivity {
    @Override
    protected void onCreate(@Nullable Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_textinput);
        final TextInputLayout mUserName = findViewById(R.id.usernameWrapper);

        findViewById(R.id.btn_login).setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                String name = mUserName.getEditText().getText().toString();
                mUserName.setErrorEnabled(true);
                if (TextUtils.isEmpty(name)) {
                    mUserName.setError("请输入账号");
                    return;
                }
                mUserName.setErrorEnabled(false);
                Toast.makeText(TextInputLayoutAct.this, "登录成功", Toast.LENGTH_SHORT).show();
            }
        });
    }
}

3. style


    <style name="MyStyle">
        <item name="android:textColor">#00FFFF</item>
        <item name="android:textSize">12sp</item>
    </style>

    <style name="MyStyle2">
        <item name="android:textColor">#e7080b</item>
        <item name="android:textSize">12sp</item>
    </style>

    <style name="MyStyle3">
        <item name="android:textColor">#f7dd1a</item>
        <item name="android:textSize">12sp</item>
    </style>

二：属性说明

属性名称	说明
android:hint	设置提示信息
app:hintAnimationEnabled="true"	设置是否可以使用动画，默认是true
app:hintEnabled="true"	设置是否可以使用hint属性，默认是true
app:hintTextAppearance="@style/MyStyle"	设置hint的文本属性，改变hint文字的大小颜色等属性
app:counterEnabled="true"	设置是否可以开启计数器，默认是false
app:counterOverflowTextAppearance="@style/MyStyle2"	设置计算器越位后的文字颜色和大小
app:counterTextAppearance="@style/MyStyle"	设置正常情况下的计数器文字颜色和大小
app:counterMaxLength="11"	设置计算器的最大字数限制
app:errorEnabled="true"	是否允许错误提示
app:errorTextAppearance="@style/MyStyle3"	错误提示的文字大小和颜色