TextInputLayout

介紹:

首先來看一下TextInputLayout,TextInputLayout 是EditText(或者EditText子類)的一個包裝類,它主要用于在用戶輸入文本的時候顯示一個浮動標簽,也支持顯示錯誤信息和字符計數(shù)等功能。同樣它也支持密碼可見切換按鈕,通過setPasswordVisibilityToggleEnabled(boolean)API 或者 xml 中的屬性,如果設(shè)置該屬性為可用(enable),那么當EditText 顯示設(shè)置的密碼時,會顯示一個切換密碼可見和隱藏的按鈕。

TextInputLayout 重要方法和屬性:
  • app:counterEnabled 字符計數(shù)是否可用
    代碼中對應(yīng)的方法為:setCounterEnabled(boolean)
  • app:counterMaxLength 計數(shù)最大的長度
    代碼中對應(yīng)的方法為:setCounterMaxLength(int )
  • app:counterOverflowTextAppearance 計數(shù)超過最大長度時顯示的文本樣式
  • app:counterTextAppearance 顯示的計數(shù)的文本樣式。
  • app:errorEnabled 顯示錯誤信息是否可用
  • app:errorTextAppearance 顯示錯誤信息的文本樣式
  • android:hint 浮動標簽
    代碼對應(yīng)方法:setHint(CharSequence)
  • app:hintAnimationEnabled 控制是否需要浮動標簽的動畫
    代碼對應(yīng)方法:setHintAnimationEnabled(boolean)
  • app:hintEnabled 控制是否顯示浮動標簽
    代碼對應(yīng)方法:setHintEnabled(boolean)
  • app:hintTextAppearance 浮動標簽的文本樣式
    代碼對應(yīng)方法:setHintTextAppearance(int)
  • app:passwordToggleDrawable 密碼可見切換圖標
    代碼對應(yīng)方法:setPasswordVisibilityToggleDrawable(int)或者setPasswordVisibilityToggleDrawable(Drawable)
  • app:passwordToggleEnabled 控制是否顯示密碼可見切換圖標
    代碼對應(yīng)方法:setPasswordVisibilityToggleEnabled(boolean)
  • app:counterOverflowTextAppearance 設(shè)置超出字符數(shù)后提示文字的顏色,如果不設(shè)置默認為@color/colorAccent的顏色
基礎(chǔ)用法:
  <android.support.design.widget.TextInputLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:hint="賬號"
        android:paddingLeft="16dp"
        android:scrollbarAlwaysDrawHorizontalTrack="true"
        app:counterMaxLength="8"
        app:counterOverflowTextAppearance="@style/TextOverCount">

        <android.support.design.widget.TextInputEditText
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center_vertical"
            android:textColor="@color/black"
            android:textColorHint="@color/gray"
            android:textSize="14dp"/>
    </android.support.design.widget.TextInputLayout>
修改默認樣式:

改變TextInputLayout默認下劃線顏色和點擊時顏色,默認hint顏色,在TextInputLayout控件設(shè)置textColorHint設(shè)置默認hint顏色
在EditText控件中設(shè)置android:theme屬性設(shè)置 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" 默認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設(shè)置輸入時字體顏色-->
    </android.support.design.widget.TextInputLayout>
    
   <!--改變TextInputLayout 里面的EditText默認下劃線和點擊時下劃線的顏色-->
    <style name="TextAppTheme" parent="Theme.AppCompat.Light.NoActionBar">
        <item name="colorControlNormal">@color/gray</item><!--默認顯示下劃線的顏色-->
        <item name="colorControlActivated">@color/gray</item><!--點擊后下劃線的顏色-->
        <item name="colorAccent">@color/qmui_config_color_red</item>
    </style>
超出字符數(shù)后的提示樣式:
  <style name="TextOverCount" parent="Base.TextAppearance.AppCompat.Light.Widget.PopupMenu.Small">
        <item name="android:textColor">@android:color/holo_red_light</item>
    </style>
設(shè)置錯誤提示文字
<android.support.design.widget.TextInputLayout
        android:layout_width="match_parent"
        android:layout_marginTop="20dp"
        app:errorEnabled="true" //設(shè)置為true
        android:id="@+id/textinputlayout_email"
        android:layout_height="wrap_content">
        <EditText
            android:layout_width="match_parent"
            android:hint="請輸入郵箱"
            android:id="@+id/et_email"
            android:layout_height="wrap_content" />
</android.support.design.widget.TextInputLayout>


editText_email=findViewById(R.id.et_email);
        textInputLayout =findViewById(R.id.textinputlayout_email);
        editText_email.addTextChangedListener(new TextWatcher() {
            @Override
            public void beforeTextChanged(CharSequence charSequence, int i, int i1, int i2) {

            }

            @Override
            public void onTextChanged(CharSequence charSequence, int i, int i1, int i2) {
                if(!RegexUtils.isEmail(charSequence)){
                    textInputLayout.setError("郵箱格式錯誤");
                    textInputLayout.setErrorEnabled(true);
                }else {
                    textInputLayout.setErrorEnabled(false);
                }
            }

            @Override
            public void afterTextChanged(Editable editable) {

            }
        });
image
設(shè)置密碼是否可見
<android.support.design.widget.TextInputLayout
        android:layout_width="match_parent"
        android:layout_marginTop="20dp"
        app:errorEnabled="true"
        app:passwordToggleEnabled="true" //設(shè)置為true
        android:id="@+id/textinputlayout_password"
        android:layout_height="wrap_content">
        <EditText
            android:layout_width="match_parent"
            android:hint="請輸入密碼"
            android:id="@+id/et_password"
            android:inputType="textPassword"
            android:layout_height="wrap_content" />
    </android.support.design.widget.TextInputLayout>
image
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容