Android 給EditText添加下劃線

在安卓高版本中,默認是有下劃線的,其下劃線的顏色是由其主題顏色來控制的

 <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/colorPrimaryDark</item>**

所以,只需要修改colorAccent的顏色,其下劃線的顏色既可以修改!

在低版本中,同樣可以添加下劃線

方法一:

//此時必須要設置其背景爲空
<EditText
        android:background="@null"
        android:drawableBottom="@drawable/line"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"/>
  // drawable/line 是資源名稱 
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <solid android:color="@color/colorBlue" />
    <size
        android:height="1dp"
        android:width="1000dp" />
</shape>

方法二:通過自定義editText

public class UnderLineEditText extends EditText {
    private Paint paint;

    public UnderLineEditText(Context context, AttributeSet attrs) {
        super(context, attrs);
        //設置畫筆的屬性
        paint = new Paint();
        paint.setStyle(Paint.Style.STROKE);
        //設置畫筆顏色爲紅色
        paint.setColor(Color.RED);
    }

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        /**canvas畫直線,從左下角到右下角,this.getHeight()-2是獲得父edittext的高度,但是必須要-2這樣才能保證
         * 畫的橫線在edittext上面,和原來的下劃線的重合
         */
        canvas.drawLine(0, this.getHeight()-2, this.getWidth()-2, this.getHeight()-2, paint);
    }
}

這裏有幾點需要注意:
其一:也可以繼承android.support.v7.widget.AppCompatEditText,但是有時會出現獲取不到焦點的現狀
其二:下劃線的的位置確定

方法三:使用layer-list來顯示邊框線,drawable新建資源文件

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
 
    <!--底層使用藍色填充色-->
    <item>
        <shape>
            <solid android:color="#02a0ef"/>
        </shape>
    </item>
 
    <!--上面一層距離底層的頂部1dp,類似marginTop,填充色爲白色,這樣就形成了一個帶有藍色頂部邊線的白色背景的圖-->
    <item android:top="1dp">
        <shape>
            <solid android:color="#fff"/>
        </shape>
    </item>
</layer-li

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章