简书App 是我很喜欢的一款软件。今天就模仿了一下他的登录框。先上图:

好了下面上代码,自定义ImgEditText 继承与EditText。重写一些方法。

package lyf.myimgedittextdemo;import android.content.Context;
import android.graphics.Rect;
import android.graphics.drawable.Drawable;
import android.text.Editable;
import android.text.TextWatcher;
import android.util.AttributeSet;
import android.view.MotionEvent;
import android.widget.EditText;/*** lyf on 2016/12/6.* 自定义的EditText右边带图片,可以设置点击事件*/
public class ImgEditText extends EditText implements TextWatcher {//控件左边的图片private Drawable leftDrawable = null;//控件右边的图片private Drawable rightDrawable = null;// 控件是否有焦点private boolean hasFoucs;private IMyRightDrawableClick mightDrawableClick;public ImgEditText(Context context) {this(context, null);}public ImgEditText(Context context, AttributeSet attrs) {//这里构造方法也很重要,不加这个很多属性不能再XML里面定义this(context, attrs, android.R.attr.editTextStyle);}public ImgEditText(Context context, AttributeSet attrs, int defStyleAttr) {super(context, attrs, defStyleAttr);init();}//初始化基本图片private void init() {//获取RadioButton的图片集合Drawable[] drawables = getCompoundDrawables();leftDrawable = drawables[0];rightDrawable = drawables[2];setCompoundDrawablesWithIntrinsicBounds(leftDrawable, null, null, null);//设置输入框里面内容发生改变的监听addTextChangedListener(this);}//设置显示图片的大小public void setCompoundDrawablesWithIntrinsicBounds(Drawable left, Drawable top, Drawable right, Drawable bottom) {super.setCompoundDrawablesWithIntrinsicBounds(left, top, right, bottom);//这里只要改后面两个参数就好了,一个宽一个是高,如果想知道为什么可以查找源码if (left != null) {left.setBounds(0, 0, 50, 50);}if (right != null) {right.setBounds(0, 0, 50, 50);}if (top != null) {top.setBounds(0, 0, 100, 100);}if (bottom != null) {bottom.setBounds(0, 0, 100, 100);}setCompoundDrawables(left, top, right, bottom);}//光标选中时判断@Overrideprotected void onFocusChanged(boolean focused, int direction, Rect previouslyFocusedRect) {super.onFocusChanged(focused, direction, previouslyFocusedRect);this.hasFoucs = focused;if (focused) {setImageVisible(getText().length() > 0);} else {setImageVisible(false);}}//设置清除图标的显示与隐藏,调用setCompoundDrawables为EditText绘制上去protected void setImageVisible(boolean flag) {//如果当前右侧有图片则覆盖右侧的图片,如果没有还是显示原来的图片if (getCompoundDrawables()[2] != null) {rightDrawable = getCompoundDrawables()[2];}if (flag) {setCompoundDrawables(getCompoundDrawables()[0], null, rightDrawable, null);} else {setCompoundDrawables(getCompoundDrawables()[0], null, null, null);}}//文本框监听事件@Overridepublic void onTextChanged(CharSequence text, int start, int lengthBefore, int lengthAfter) {if (hasFoucs) {if (text.length() > 0) {setImageVisible(true);} else {setImageVisible(false);}}}public void beforeTextChanged(CharSequence s, int start, int count, int after) {}public void afterTextChanged(Editable s) {}/*** 因为我们不能直接给EditText设置点击事件,所以我们用记住我们按下的位置来模拟点击事件* 当我们按下的位置 在  EditText的宽度 - 图标到控件右边的间距 - 图标的宽度  和* EditText的宽度 - 图标到控件右边的间距之间我们就算点击了图标,竖直方向就没有考虑* (参考 http://blog.csdn.net/xiaanming/article/details/11066685/)*/@Overridepublic boolean onTouchEvent(MotionEvent event) {if (event.getAction() == MotionEvent.ACTION_UP) {if (getCompoundDrawables()[2] != null) {boolean touchable = event.getX() > (getWidth() - getTotalPaddingRight())&& (event.getX() < ((getWidth() - getPaddingRight())));if (touchable) {//调用点击事件(外部实现)mightDrawableClick.rightDrawableClick();}}}return super.onTouchEvent(event);}//设置右侧按钮的点击事件,外部调用的时候实现该方法public void setDrawableClick( IMyRightDrawableClick myMightDrawableClick){this.mightDrawableClick = myMightDrawableClick;}//自定义接口(实现右边图片点击事件)public interface IMyRightDrawableClick {void rightDrawableClick();}//允许外部修改右侧显示的图片public void setRightDrawable(Drawable drawable){rightDrawable = drawable;setCompoundDrawablesWithIntrinsicBounds(leftDrawable, null, rightDrawable, null);}}

以上就是自定义类的主要代码了,注释比较清楚。

布局布局文件里直接引用就好。

<lyf.myimgedittextdemo.ImgEditTextandroid:id="@+id/pwdIet"android:layout_width="0dp"android:layout_height="wrap_content"android:layout_weight="1"android:background="@null"android:drawableLeft="@mipmap/mm_image"android:drawableRight="@mipmap/eye_normal"android:paddingLeft="15dp"android:paddingRight="15dp"android:paddingTop="5dp"android:drawablePadding="15dp"android:layout_marginTop="10dp"android:layout_marginBottom="10dp"android:hint="密码"android:inputType="numberPassword" />

下面看代码中的设置

pwdIet = (ImgEditText) this.findViewById(R.id.pwdIet);pwdIet.setDrawableClick(new ImgEditText.IMyRightDrawableClick() {@Overridepublic void rightDrawableClick() {if (isHidden) {//设置EditText文本为可见的pwdIet.setTransformationMethod(HideReturnsTransformationMethod.getInstance());pwdIet.setRightDrawable(getResources().getDrawable(R.mipmap.eye_selected));} else {//设置EditText文本为隐藏的pwdIet.setTransformationMethod(PasswordTransformationMethod.getInstance());pwdIet.setRightDrawable(getResources().getDrawable(R.mipmap.eye_normal));}isHidden = !isHidden;pwdIet.postInvalidate();//切换后将EditText光标置于末尾CharSequence charSequence = pwdIet.getText();if (charSequence instanceof Spannable) {Spannable spanText = (Spannable) charSequence;Selection.setSelection(spanText, charSequence.length());}}});

这样我们的例子就完成了。

不懂的可以下载看源码,很简单。

源码下载

仿简书登录框,可删除内容或显示密码框的内容相关推荐

  1. android 仿简书评论,Android 开发仿简书登录框可删除内容或显示密码框的内容

    简书App 是我很喜欢的一款软件.今天就模仿了一下他的登录框.先上图: 好了下面上代码,自定义ImgEditText 继承与EditText.重写一些方法. package lyf.myimgedit ...

  2. Android点击按钮显示密码,Android 开发仿简书登录框可删除内容或显示密码框的内容...

    简书App 是我很喜欢的一款软件.今天就模仿了一下他的登录框.先上图: 好了下面上代码,自定义ImgEditText 继承与EditText.重写一些方法. package lyf.myimgedit ...

  3. 使用SwipeRefreshLayout和RecyclerView实现仿“简书”下拉刷新和上拉加载更多

    原文地址: http://blog.csdn.net/leoleohan/article/details/50989549/ 一.概述 我们公司目前开发的所有Android APP都是遵循iOS风格设 ...

  4. 仿造小红书页面代码html,jQuery仿小红书登录页,背景图垂直循环滚动登录页,向上循环滚动的动画,实现一张背景图片的无缝向上循环js滚动...

    jQuery仿小红书登录页,背景图垂直循环滚动登录页,向上循环滚动的动画,实现一张背景图片的无缝向上循环js滚动 先看效果图: 图片是gif看着有点卡顿,网页里面其实很流畅的 此代码使用CSS3动画实 ...

  5. 高仿简书Android,高仿简书个人中心页面

    高仿简书个人中心页面 Demo下载地址: 先贴上效果图 1. 步骤 1.1 把APP的主题改为NoAction 1.2 引入Material Design 包 implementation 'com. ...

  6. 高仿简书个人中心页面

    高仿简书个人中心页面 Demo下载地址: 先贴上效果图 1. 步骤 1.1 把APP的主题改为NoAction <!-- Base application theme. --><st ...

  7. shell 密码输入不显示,Shell输出内容不显示密码,Shell实现有密码自动登录sshpass 应用实践...

    在很多实践项目中,我们经常会通过SSH来进行认证,如通过SSH拷贝文件,虽然我们可以使用公钥与私钥实现ssh 无密码登录,在不同的服务器上又需要配对相应的密钥,切换用户麻烦等问题,在一些需要交互但会涉 ...

  8. android 仿简书评论,Android仿简书搜索框效果的示例代码

    前言 之前用简书的时候一直是在web端,后来下载了客户端,看到了搜索的那个动画,就尝试的去写了,没写之前感觉挺容易的,写了之后,就感觉里面还是有些要注意的东西的.话不多说,直接上图. Activity ...

  9. 实现仿简书选取内容生成分享图片效果

    前几天脑子里忽然闪过简书的图片分享效果,感觉很简洁也很漂亮,想着能不能用自己方式实现一下呢,于是今天就有了这篇文章.好了,先看下效果图吧: 项目地址: https://github.com/zhang ...

最新文章

  1. iOS单独集成QQ分享功能
  2. 基于SAP的中国式数据分析浅谈
  3. java青蛙青蛙跳井_公务员行测技巧:青蛙跳井问题
  4. 微信小程序富文本解析点击图片放大_微信小程序解析富文本过程详解
  5. CentOS中提示rz命令找不到安装lrzsz来解决
  6. linux离线安装redmine_Linux 下一款非常好用的翻译软件
  7. GEO2R/GEOquery的结果可能是错的!!!
  8. python接口测试面试_面试秘籍 | 一文搞定面试中接口测试问题
  9. C++11新特性(4)
  10. nasa和linux的关系,跟美国NASA毅力号登陆火星的Linux是一个无图形的纯命令行系统...
  11. 腾讯智慧金融白皮书:区块链将是未来数字经济基础设施
  12. 计算机关闭远程桌面 共享功能,win7旗舰版系统优化禁止用远程桌面共享的解决方法...
  13. 【转】用C#获取浏览文件夹对话框
  14. sklearn做文本聚类分析
  15. 如何用matlab解决数学建模中的报童问题
  16. 可调稳压电源lm317实验报告_LM317可调稳压电源电路图
  17. 四级语法2——主谓一致+时态语态
  18. mysql表的基础操作: Create,,Retrieve,Update,Delete(大量示例)
  19. BUUctf刷题第三天
  20. 面试中可以谎报薪资嘛?

热门文章

  1. 宝洁网测管道题技巧_宝洁笔试网测小技巧分享
  2. 软件测试工程师面试题总结
  3. Android Studio GIT 仓库地址 变更 方法
  4. 计算机非全日制硕士 选校,非全日制研究生如何来选择学校呢?
  5. 阿里大文娱让中国传统文化融入年轻人的生活
  6. 因对某产品的一丝质疑而到被洗脑式怼,引起对于社交电商的一丝看法
  7. 数据库开发转行大数据开发工程师怎么样?
  8. 剑桥的桥与诗都很美:柔波里的水草
  9. DES和RSA加密解密实例
  10. 2021年安全员-C证(上海市)考试APP及安全员-C证(上海市)新版试题