DustinChu Blog

Textinputlayout使用及自訂義顏色

Posted on | In | 0 comments   |   字數統計 799 個字   |   預計閱讀時間 4 分鐘 |

版權聲明：轉載請保留原文連結及作者
http://blog.csdn.net/android_freshman/article/details/51136657

Textinputlayout

gradle 配置

1
2
compile ‘com.Android.support:design:22.2.0’
compile ‘com.android.support:appcompat-v7:22.2.0’

xml

1
2
3
4
private android.widget.LinearLayout.LayoutParams    setEditText(EditText editText,  LayoutParams lp) {
        if(this.mEditText != null) {
            throw new IllegalArgumentException("We already have an EditText, can only    have one");
        } else {

注意點：部分源代碼中的內容，TextInputLayout 繼承LinearLayout 且裡面只能有一個editEditText，和scrollView 很像。下面是佈局文件：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
<android.support.design.widget.TextInputLayout
                android:id="@+id/titleTextInput"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginTop="10dp"
                android:layout_marginLeft="40dp"
                android:layout_marginRight="15dp"
                app:errorTextAppearance="@style/TextInput_Error_style">
            <EditText
                    android:id="@+id/title"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:textSize="20sp"
                    android:textColor="@color/white"
                    android:singleLine="true"
                    android:hint="Title"/>
        </android.support.design.widget.TextInputLayout>
        <android.support.design.widget.TextInputLayout
                android:id="@+id/descriptionsTextInput"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginLeft="40dp"
                android:layout_marginRight="15dp">
            <EditText
                    android:id="@+id/descriptions"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:textSize="16sp"
                    android:textColor="@color/white"
                    android:hint="Descriptions"/>
        </android.support.design.widget.TextInputLayout>

java

注意：不能重寫TextInputLayout的OnFocusChangeListener的監聽事件，因為在源代碼中定義了動畫效果和editText注入，重寫了會導致動畫失效。
設置浮動標籤動畫效果
titleTextInput.setHint(“Title”);

1
2
3
4
5
6
if(titleEditText.getText().toString().length()<6){
   titleTextInput.setErrorEnabled(true);
   titleTextInput.setError("title length must >= 6");
}else {
   titleTextInput.setErrorEnabled(false);
}

這一部分是動態錯誤提示的相關代碼

完成上面的，基本就可以出現TextInputLayout 的動畫效果了，但是默認的顏色不是很好看，所以我們需要自定義相關的顏色，比如hint 字的顏色，下劃線的顏色，錯誤字體的顏色大小等，下面就是自定義顏色的部分：

google把Design Support Library寫的很好。每一個控件的顏色都是直接通過主題顏色繪製的，在style.xml 中指定。打開它添加colorAccent 到主題以改變表單的顏色。在style.xml 中修改相關的屬性

1
2
3
4
5
6
7
8
9
10
11
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
        <item name="colorPrimary">@color/primary</item>
        <item name="colorPrimaryDark">@color/primary_dark</item>
        <!--<item name="colorAccent">#3498db</item>-->
        <item name="android:textColorHint">@color/alpha_white</item>
        <item name="colorControlNormal">@color/alpha_white</item>
        <item name="colorControlActivated">@color/white</item>
        <item name="colorControlHighlight">@color/white</item>
        <item name="android:windowTranslucentStatus">true</item>
    </style>

colorAccent 是什麼意思，哪裡的顏色

這張圖片基本說明了colorAccent代表的顏色，而在google的官網上：
https://www.google.com/design/spec/style/color.html#color-color-schemes 也有相關的說明

其他相關顏色的說明

android:textColorHint代表hint的顏色
colorControlNormal代表下劃線沒有獲取焦點的顏色
colorControlActivated，colorControlHighlight代表了獲取焦點或者點擊的時候下劃線的顏色

錯誤提示的顏色說明：

默認的錯誤提示的顏色是紅色：在這種背景色下面，紅色不是很好看，所以需要自定義顏色

在設置佈局的時候errorTextAppearance這個屬性，自定義style 寫顏色和大小就可以了，至於另一個屬性hintTextAppearance 這個屬性修改顏色，好像沒有什麼效果，不起作用。

修改之後的效果，如下圖：有的機器上面可能沒有效果，下面提供一種解決方案：

1
2
3
4
5
6
7
8
9
10
11
12
public static void setErrorTextColor(TextInputLayout textInputLayout, int color) {
        try {
            Field fErrorView = TextInputLayout.class.getDeclaredField("mErrorView");
            fErrorView.setAccessible(true);
            TextView mErrorView = (TextView) fErrorView.get(textInputLayout);
            Field fCurTextColor = TextView.class.getDeclaredField("mCurTextColor");
            fCurTextColor.setAccessible(true);
            fCurTextColor.set(mErrorView, color);
        } catch (Exception e) {
            e.printStackTrace();
        }
    }

相關文章：