关闭

实现EditText选中时底边框改变颜色

标签: androidEditText底边框变颜色
399人阅读 评论(0) 收藏 举报
分类:

(一)使用9Patch图片

XML布局:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context=".MainActivity" >

    <RelativeLayout
                android:id="@+id/domainLayout"
                android:layout_width="match_parent"
                android:layout_height="50dip"
                android:orientation="horizontal"
                android:layout_gravity="center"
                >
        <TextView android:layout_width="70dip"
            android:layout_height="match_parent"
            style="@style/text_s28_1c1c1c"
            android:gravity="right|center"
            android:text="用户名:"/>
        <com.ziniu.mobile.module.ui.component.ZiniuEdit
            android:id="@+id/domain"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:paddingLeft="75dip"
            android:paddingRight="5dip"
            android:layout_marginLeft="10dip"
            android:layout_marginRight="10dip"
            //文本框为空时提示文字颜色
            android:textColorHint="@color/wechat_text_gray"
            //文本框样式
            style="@style/text_s28_1c1c1c"
            //文本框为空时提示文字
            android:hint="请输入用户名"
            //文本框背景状态
            android:background="@drawable/line_et_bg"
            //加载文本框右端删除图标
            android:drawableRight="@drawable/edit_clear_48"
            //设置光标的颜色为@null,表示光标的颜色和输入框的字体颜色相同
            android:textCursorDrawable="@null"/> 

    <RelativeLayout
                android:id="@+id/domainLayout"
                android:layout_width="match_parent"
                android:layout_height="50dip"
                android:orientation="horizontal"
                android:layout_gravity="center"
                >
        <TextView android:layout_width="70dip"
            android:layout_height="match_parent"
            style="@style/text_s28_1c1c1c"
            android:gravity="right|center"
            android:text="用户名:"/>
        <com.ziniu.mobile.module.ui.component.ZiniuEdit
            android:id="@+id/domain"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:paddingLeft="75dip"
            android:paddingRight="5dip"
            android:layout_marginLeft="10dip"
            android:layout_marginRight="10dip"
            //文本框为空时提示文字颜色
            android:textColorHint="@color/wechat_text_gray"
            //文本框样式
            style="@style/text_s28_1c1c1c"
            //文本框为空时提示文字
            android:hint="请输密码"
            //文本框背景
            android:background="@drawable/line_et_bg"
            //加载文本框右端删除图标
            android:drawableRight="@drawable/edit_clear_48"
            //设置光标的颜色为@null,表示光标的颜色和输入框的字体颜色相同
            android:textCursorDrawable="@null"/>          

    </RelativeLayout>

</RelativeLayout>
/drawable/line_et_bg.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    //state_pressed:当控件被按下时触发相应的9Patch图片
    <item android:drawable="@drawable/textfield_activated_holo_dark" android:state_pressed= "true"/>  
    //state_focused:当控件获取焦点时
    <item android:drawable="@drawable/textfield_activated_holo_dark" android:state_focused= "true"/>  
    //state_selected:当控件被选择触发时
    <item android:drawable="@drawable/textfield_activated_holo_dark" android:state_selected= "true"/>  
    //没有选中时的状态
    <item android:drawable="@drawable/textfield_default_holo_light" />
</selector>

(二)使用样式

XML布局:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:paddingBottom="@dimen/activity_vertical_margin"
    tools:context="com.bignerdranch.android.edittexttest.MainActivity">

    <EditText
        android:id="@+id/login_account"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@drawable/line_et_bg"
        android:hint="请输入用户名"/>
    <EditText
        android:layout_below="@id/login_account"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@drawable/line_et_bg"
        android:hint="请输入密码"/>
</RelativeLayout>
/drawable/line_et_bg.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    //当控件被选中时触发相应的样式
    <itemandroid:state_focused="true" android:drawable="@drawable/line_et_focus"/>
    //当控件没有被选中时触发相应的样式
    <item android:drawable="@drawable/line_et_normal"/>
</selector>
样式文件line_et_focus.xml
<?xml version="1.0" encoding="utf-8"?>
<!-- layer-list:将多个图片或两种效果按照顺序层叠起来显示,一个item包含一个显示元素 -->
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <!--  shape自定义控件,android:shape="rectangle"形状为矩形 -->
        <shape android:shape="rectangle">
            <solid android:color="@android:color/transparent" />
        </shape>
    </item>
    <item
        android:left="-2dip"
        android:right="-2dip"
        android:top="-2dip">
        <shape>
            <solid android:color="@android:color/transparent" />
            <!-- stroke:描边,EditText只有底边 -->
            <stroke
                //边框宽度为1dip
                android:width="1dip"
                android:color="@color/colorAccent"
                android:dashGap="0dp"
                android:dashWidth="0dip" />
        </shape>
    </item>
</layer-list>
样式文件line_et_normal.xml
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape android:shape="rectangle">
            <solid android:color="@android:color/transparent" />
        </shape>
    </item>
    <item
        android:left="-2dip"
        android:right="-2dip"
        android:top="-2dip">
        <shape>
            <solid android:color="@android:color/transparent" />
            <stroke
                android:width="1dip"
                android:color="@color/colorPrimary"
                android:dashGap="0dp"
                android:dashWidth="0dip" />
        </shape>
    </item>
</layer-list>

参考: EditText状态变化——选中和未先中(底部变颜色的线)

0
0

查看评论
* 以上用户言论只代表其个人观点,不代表CSDN网站的观点或立场
    个人资料
    • 访问:24662次
    • 积分:742
    • 等级:
    • 排名:千里之外
    • 原创:51篇
    • 转载:6篇
    • 译文:0篇
    • 评论:2条
    博客专栏
    文章分类
    最新评论