最新消息:欢迎访问Android开发中文站!商务联系微信:loading_in

Android美化EditText

开发进阶 loading 6762浏览 0评论

目前各种app都讲究用户体验,这里介绍下对EditText控件的样式美化。

先上效果图:

          

注:第一个控件没有没有设置 background 的任何属性,第二个控件设置了 android:background=”@drawable/bg_edittext_selector”

若希望取消 EditText 背景,直接设置 android:background=”@null” 便可。

此处通过两个xml文件来设置未获得焦点和已经获得焦点的样式,通过shape实现。

edittext_focused.xml

<stroke
     android:width="1dip"
     android:color="#728ea3" />

edittext_normal.xml

<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
       <solid android:color="#FFFFFF" />
       <corners android:radius="1dip"/>
       <stroke
             android:width="1dip"
             android:color="#BDC7D8" />
</shape>

注:此处可以通过设置 corners   (角) 来设置边框的弧度。想了解shape更多属性可以自行查阅。

bg_edittext_selector.xml

<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
      <solid android:color="#FFFFFF" />
      <corners android:radius="1dip"/>
      <stroke
           android:width="1dip"
           android:color="#BDC7D8" />
</shape>

activity_main.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"
      tools:context="com.example.aa.MainActivity" >

      <EditText
            android:id="@+id/normal"
            android:layout_width="fill_parent"
            android:layout_height="36dip"
            android:layout_margin="36dip"
            android:hint="请输入用户名"
            android:padding="5dip"
            android:singleLine="true"
            android:textColorHint="#AAAAAA"
            android:textSize="15dip" />

     <EditText
            android:layout_below="@+id/normal"
            android:layout_width="fill_parent"
            android:layout_height="36dip"
            android:layout_margin="36dip"
            android:background="@drawable/bg_edittext_selector"
            android:hint="请输入用户名"
            android:padding="5dip"
            android:singleLine="true"
            android:textColorHint="#AAAAAA"
            android:textSize="15dip" />

</RelativeLayout>

转载请注明:Android开发中文站 » Android美化EditText

您必须 登录 才能发表评论!