1.TextInputLayout（2017/2/21）

TextInputLayout是MD中的一种登录界面，它有一个特点类似ScrollView就是它的内部只能有一个控件，而这个控件只能是EditText。接下来说下它的用法：

首先添加依赖

compile 'com.android.support:appcompat-v7:25.0.1'  //兼容低版本的浮动动画
compile 'com.android.support:design:25.0.1'              //引入design库

xml中布局代码

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/activity_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:focusable="false"
    android:padding="10dp"
    android:focusableInTouchMode="true">

    <android.support.design.widget.TextInputLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:hint="用户名"
        android:textColorHint="#5D4037">
        <EditText
            android:textColor="#5D4037"
            android:theme="@style/CustomEditText"
            android:id="@+id/editone"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"/>
    </android.support.design.widget.TextInputLayout>

    <android.support.design.widget.TextInputLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="5dp"
        android:hint="密码"
        android:inputType="textPassword"
        android:textColorHint="#5D4037">
        <EditText
            android:theme="@style/CustomEditText"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"/>
    </android.support.design.widget.TextInputLayout>

    <Button
        android:layout_gravity="center_horizontal"
        android:layout_marginTop="10dp"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:padding="8dp"
        android:text="登录"/>
</LinearLayout>

Paste_Image.png
几点注意事项

• 取消EditText的默认获取焦点
  EditText默认是获取焦点的，这导致刚进入此页面，用户名就会上浮，并且键盘也默认被拉出。怎样改变这种默认设置，当我们点击时才出现上述的状态呢？就是在EditText的父控件加两行代码。

android:focusable="false"      //不能获取焦点
android:focusableInTouchMode="true"     //当触摸时才获取焦点

• 更改EditText的hint默认颜色
  在TextInputLayout中通过下面这个属性

android:textColorHint="#5D4037"

• 更改EditText的下滑线颜色
  EditText下滑线有默认的颜色，当获取焦点后又会有另一种默认的颜色，怎样自定义两种状态下的颜色，需要我们自己写一个style，然后通过EditText的theme属性引用这个style。

    <style name="CustomEditText" parent="Theme.AppCompat.Light">
        <item name="colorControlNormal">#5D4037</item>      //正常情况下线的颜色
        <item name="colorControlActivated">#00BCD4</item>  //获取焦点后的颜色
    </style>

• 怎样更改hint浮上去后的颜色？

    <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
        <!-- Customize your theme here. -->
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>   //更改这里的颜色
    </style>

Paste_Image.png

• 如果账户是手机号，可以加入字符计数，在TextInputLayout中加入

app:counterEnabled="true"    //是否计数
app:counterMaxLength="11"   //最大长度

• 密码时加入眼睛的图标，在TextInputLayout中加入

app:passwordToggleEnabled="true"

如果想自定义图标

app:passwordToggleDrawable="@drawable/bg"

Paste_Image.png