TextInputLayout使用方式之修改样式

版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/zjc_null/article/details/83177078

最近做的项目使用到了TextInputLayout这个控件。它是desig包下的。

material design是Android5.0之后引入的。它新增了一些控件。有需要了解的朋友请自行翻阅资料。下面是它的依赖

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

TextInputLayout控件继承LinearLayout，使用时包含且只能包含一个EditText输入框。它可以显示浮动效果。它的很多属性还是跟EditText一样。但是我在开发时，因项目需要将默认的hint颜色，下划线颜色，点击后的颜色都需要修改。它默认是这种颜色的，看下图

这种是默认样式，它产生了一种浮动效果，看起来非常炫酷。

它的代码如下

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:gravity="center_horizontal"
    android:paddingLeft="@dimen/forty_dp"
    android:paddingRight="@dimen/forty_dp"
    android:paddingTop="@dimen/one_hundred_twenty_dp"
    tools:context="com.example.administered.swiperefreshlayouttest.view.activitys.MainActivity">
    
    <android.support.design.widget.TextInputLayout
        android:id="@+id/login_textinput_id"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        >
        
        <EditText
            android:id="@+id/login_userId"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:hint="请输入账号"
            android:inputType="number"
            android:maxLines="1"
            android:singleLine="true"
             />
        
    </android.support.design.widget.TextInputLayout>

    <android.support.design.widget.TextInputLayout
        android:id="@+id/login_textinput_pwd"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@+id/login_textinput_id"
        android:layout_marginTop="@dimen/five_dp"
        >

        <EditText
            android:id="@+id/login_password"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:hint="请输入密码"
            android:inputType="textPassword"
            android:maxLines="1"
            android:singleLine="true"
             />
       
    </android.support.design.widget.TextInputLayout>
    
    <Button
        android:id="@+id/sign_in_button"
        style="?android:textAppearanceSmall"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@+id/login_textinput_pwd"
        android:layout_marginTop="@dimen/twenty_dp"
        android:background="@drawable/btn_nor_up"
        android:text="登录"
        android:textStyle="bold" />

</LinearLayout>

我因为项目需要，需要将默认下划线颜色，hint等颜色需要做改变，因为背景要变成深色。这种默认的颜色，在深色背景下有点看不清楚。

做了如下修改

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/skyblue"
    android:orientation="vertical"
    android:gravity="center_horizontal"
    android:paddingLeft="@dimen/forty_dp"
    android:paddingRight="@dimen/forty_dp"
    android:paddingTop="@dimen/one_hundred_twenty_dp"
    tools:context="com.example.administered.swiperefreshlayouttest.view.activitys.MainActivity">

    <!--改变TextInputLayout默认下划线颜色和点击时颜色，默认hint颜色
           在TextInputLayout控件设置textColorHint设置默认hint颜色
           在EditText控件中设置android:theme属性设置 style
       -->
    <android.support.design.widget.TextInputLayout
        android:id="@+id/login_textinput_id"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:textColorHint="@color/mintcream">
        <!--android:textColorHint="@color/blue" 默认hint字体颜色-->
        <EditText
            android:id="@+id/login_userId"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:hint="请输入账号"
            android:inputType="number"
            android:maxLines="1"
            android:singleLine="true"
            android:textColor="@color/darkorange"
            android:theme="@style/TextAppTheme" />
        <!--textColor设置输入时字体颜色-->
        <!--inputTypu设置输入框输入类型-->

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

    <android.support.design.widget.TextInputLayout
        android:id="@+id/login_textinput_pwd"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@+id/login_textinput_id"
        android:layout_marginTop="@dimen/five_dp"
        android:textColorHint="@color/mintcream">

        <EditText
            android:id="@+id/login_password"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:hint="请输入密码"
            android:inputType="textPassword"
            android:maxLines="1"
            android:singleLine="true"
            android:textColor="@color/darkorange"
            android:theme="@style/TextAppTheme" />

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


    <Button
        android:id="@+id/sign_in_button"
        style="?android:textAppearanceSmall"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@+id/login_textinput_pwd"
        android:layout_marginTop="@dimen/twenty_dp"
        android:background="@drawable/btn_nor_up"
        android:text="登录"
        android:textStyle="bold" />

</LinearLayout>

修改的代码我做了注释，TextAppTheme.style代码如下

<!--改变TextInputLayout 里面的EditText默认下划线和点击时下划线的颜色-->
    <style name="TextAppTheme" parent="Theme.AppCompat.Light.NoActionBar">
        <item name="colorControlNormal">@color/chartreuse</item><!--默认显示下划线的颜色-->
        <item name="colorControlActivated">@color/orangered</item><!--点击后下划线的颜色-->
        <item name="colorAccent">@color/ivory</item>
    </style>

效果如下

其实就是修改了一些样式而已，它的其他的一些属性，暂时还没发掘出来。还需要学习