Android EditText前面添加图标

关于Android EditText使用中,如果我要在EditText前面加上一些标识符,就好比下图:

   

看到这个图,你一定有很多想法来实现这样子的效果。

我第一直觉就是用LinearLayout来实现,在一个LinearLayout中放一个TextView在左边,然后在右边放一个没有边边框的EditText,实现起来比较简单,顺便把我自己的代码也贴在这儿,记录一下,以后查看起来也比较的方便:

   

方法一: 

首先在你自己的布局文件中写下当前布局的内容,我写在activity_main.xml文件中,(PSAndroid中的xml文件名只能用小写字母)

代码如下:

<LinearLayout

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:background="@drawable/edittext_background"

android:orientation="horizontal" >

   

<TextView

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_gravity="center_vertical"

android:text="@string/dollar" />

   

<EditText

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:background="@drawable/none_border_background"

android:text="@string/hello_world"/>

</LinearLayout>

  

   

在上面的代码中,使用了两个background文件,他们分别是图示效果中的外边框和没有边框的背景文件,他们放在Drawable文件夹下面:edittext_background.xml none_border_background.xml

代码如下:

edittext_background.xml

<?xml version="1.0" encoding="utf-8"?>

<shape xmlns:android="http://schemas.android.com/apk/res/android" >

<corners android:radius="5dp" />

<padding

android:bottom="5dp"

android:left="5dp"

android:right="5dp"

android:top="5dp" />

<stroke

android:width="1dp"

android:color="#ff6600" />

<solid android:color="@android:color/white" />

</shape>

   

none_border_background.xml

<?xml version="1.0" encoding="utf-8"?>

<shape xmlns:android="http://schemas.android.com/apk/res/android" >

<stroke android:width="0dp" />

<solid android:color="@android:color/white" />

</shape>

   

运行效果和上图中的一致,可是在写好了的时候,我发现了一个问题,如果我们的要在EditText选中的时候(即获取到焦点的时候),要改变边框的颜色,这个时候就有点麻烦了,但是也是可以实现的,就是在监听EditText的焦点事件。

为了体现出他的效果,我们还得建立一个选中过后的EditText的背景,暂时就叫它edittext_focus_background.xml

代码如下 所示:

<?xml version="1.0" encoding="utf-8"?>

<shape xmlns:android="http://schemas.android.com/apk/res/android" >

<corners android:radius="5dp" />

<padding

android:bottom="5dp"

android:left="5dp"

android:right="5dp"

android:top="5dp" />

<stroke

android:width="1dp"

android:color="#000000" />

<solid android:color="@android:color/white" />

</shape>

   

他与edittext_background.xml差不了好多,只是将他的外边框的颜色改了一下(PS:如果你觉得他丑,你可以把他设计得好看一点)。

还有,我们需要给EditText加一个ID,就命名为liner_et

android:id="@+id/liner_et"

还要给我们的LinearLayout添加一个ID,叫做liner

在代码中添加它的事件监听,就这样就可以搞定。

java代码如下:

EditText linearEt = (EditText) this.findViewById(R.id.liner_et);

final LinearLayout linearLayout = (LinearLayout) this

.findViewById(R.id.linear);

linearEt.setOnFocusChangeListener(new OnFocusChangeListener() {

@Override

public void onFocusChange(View v, boolean hasFocus) {

if (hasFocus) {

Log.v(TAG, "hasFocus:" + hasFocus);

linearLayout.setBackgroundResource(R.drawable.edittext_focus_background);

} else {

Log.v(TAG, "hasFoucs:" + hasFocus);

linearLayout.setBackgroundResource(R.drawable.edittext_background);

}

}

});

   

这样实现起来可以,但是感觉有点略显臃肿。View和Controller没有那么分得开,下面我们看第二种实现方法

   

方法二:

   

这个方法是用的FrameLayout来实现的,但在这儿之前,我们要先写一个selector,将EditText的没有获取焦点和获取焦点的背景用一个xml来控制。

edittext_selector.xml

<?xml version="1.0" encoding="utf-8"?>

<selector xmlns:android="http://schemas.android.com/apk/res/android" >

<item android:state_focused="true" android:drawable="@drawable/edittext_focus_background"></item>

<item android:drawable="@drawable/edittext_background"></item>

</selector>

   

紧接着我们就可以写我们的布局了

<FrameLayout

android:layout_width="match_parent"

android:layout_height="wrap_content" >

 

<EditText

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:background="@drawable/edittext_selector"

android:paddingLeft="15dp"

android:text="@string/hello_world"/>

<TextView

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_gravity="center_vertical"

android:layout_marginLeft="5dp"

android:layout_marginRight="5dp"

android:text="@string/dollar"/>

</FrameLayout>

   

就这样很简单的就实现了。

   

未完待续,如果您有什么更好的方法,不另赐教。谢谢。本人邮箱:lovecluo@nightweaver.org

转载于:https://www.cnblogs.com/knero/p/3543630.html

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值