怎么在Android中实现一个带清除按钮、密码可见的输入框

这期内容当中小编将会给大家带来有关怎么在Android中实现一个带清除按钮、密码可见的输入框，文章内容丰富且以专业的角度为大家分析和叙述，阅读完这篇文章希望大家可以有所收获。

一、自定义控件ClearEditText

我的这个自带清除、小眼睛的控件，是一个自定义控件，控件名称ClearEditText.class，继承RelativeLayout并有布局引用。在拷贝到项目里面后，使用时候只需要与普通输入框控件一样，进行相关的配置即可，部分属性需要使用自定义属性，具体见代码。

二、使用步骤

 1.拷贝ClearEditText.class

拷贝ClearEditText.class类到自己的项目里，再考拷贝它相关的布局文件、自定义属性、默认图片即可，下面贴出ClearEditText主要代码：

public class ClearEditText extends RelativeLayout {  private ImageView ivLeftIcon;  private EditText myEdie;  private ImageView ivEditClean;  private ImageView ivEditEye;  private boolean isChecked = true;  private Context mContext;  private TypedArray mTypedArray;  private boolean showClean = true;//清空图标是否显示，true:显示  private boolean showEye = false;//密码可见图标是否显示，true:显示  private int drawableLeft = -1;//是否显示输入框左侧图片  private int drawableEyeOpen = R.drawable.clear_icon_eye_open;//可以看见密码小眼睛样式  private int drawableEyeClose = R.drawable.clear_icon_eye_close;//不可见密码小眼睛样式  private int drawableClean = R.drawable.clear_icon_close;//清除按钮图片  private int cleanPadding = 0;//清除按钮padding边距  private String hintStr;  private String textStr;  private int mTextColorHint = Color.BLACK;  private int mTextColor = Color.BLACK;  private int mTextSize = -1;  private int mMaxLength = 2000;  private int mMaxLines = 1;  private int mInputType = 0;//输入类型，就做了不限制、数字、文本密码三种  private boolean isInput = false;//输入1个字符后更改状态为true,保证小眼睛移动一次  private boolean isHideClean = false;//输入字符后，清除了需要小眼睛归为，清除按钮隐藏  private int ivWidth = 45;//关闭按钮的宽度  public ClearEditText(Context context) {   super(context);   mContext = context;   initView();  }  public ClearEditText(Context context, AttributeSet attrs, int defStyle) {   super(context, attrs, defStyle);   mContext = context;   mTypedArray = mContext.obtainStyledAttributes(attrs, R.styleable.myEditText);   initView();  }  public ClearEditText(Context context, AttributeSet attrs) {   super(context, attrs);   mContext = context;   mTypedArray = mContext.obtainStyledAttributes(attrs, R.styleable.myEditText);   showClean = mTypedArray.getBoolean(R.styleable.myEditText_showClean, showClean);   drawableClean = mTypedArray.getResourceId(R.styleable.myEditText_drawableClean, drawableClean);   cleanPadding = mTypedArray.getDimensionPixelSize(R.styleable.myEditText_cleanPadding, cleanPadding);   showEye = mTypedArray.getBoolean(R.styleable.myEditText_showEye, showEye);   drawableLeft = mTypedArray.getResourceId(R.styleable.myEditText_drawableLeft, -1);   drawableEyeClose = mTypedArray.getResourceId(R.styleable.myEditText_drawableEyeClose, drawableEyeClose);   drawableEyeOpen = mTypedArray.getResourceId(R.styleable.myEditText_drawableEyeOpen, drawableEyeOpen);   hintStr = mTypedArray.getString(R.styleable.myEditText_hint);   textStr = mTypedArray.getString(R.styleable.myEditText_text);   mTextColorHint = mTypedArray.getColor(R.styleable.myEditText_textColorHint, mTextColorHint);   mTextColor = mTypedArray.getColor(R.styleable.myEditText_textColor, mTextColor);   mTextSize = mTypedArray.getDimensionPixelSize(R.styleable.myEditText_textSize, mTextSize);   mMaxLength = mTypedArray.getInteger(R.styleable.myEditText_maxLength, mMaxLength);   mMaxLines = mTypedArray.getDimensionPixelSize(R.styleable.myEditText_maxLines, mMaxLines);   mInputType = mTypedArray.getInteger(R.styleable.myEditText_inputType, mInputType);   mTypedArray.recycle();   initView();  }  // 初始化视图  private void initView() {   View view = View.inflate(getContext(), R.layout.clear_layout_view, null);   ivLeftIcon = (ImageView) view.findViewById(R.id.iv_edit_left_icon);   myEdie = (EditText) view.findViewById(R.id.view_edit_show);   ivEditClean = (ImageView) view.findViewById(R.id.iv_edit_clean);   ivEditEye = (ImageView) view.findViewById(R.id.iv_edit_eye);   myEdie.setHint(hintStr);   myEdie.setHintTextColor(mTextColorHint);   myEdie.setText(textStr);   myEdie.setTextColor(mTextColor);   myEdie.setMaxLines(mMaxLines);   myEdie.setFilters(new InputFilter[]{new InputFilter.LengthFilter(mMaxLength)});   if (mTextSize != -1) {    myEdie.setTextSize(TypedValue.COMPLEX_UNIT_PX, mTextSize);   } else {    myEdie.setTextSize(15);   }   if (mInputType == 1) {    myEdie.setInputType(InputType.TYPE_CLASS_NUMBER);   } else if (mInputType == 2) {    myEdie.setInputType(InputType.TYPE_TEXT_VARIATION_PASSWORD | InputType.TYPE_CLASS_TEXT);   } else {    myEdie.setInputType(InputType.TYPE_NUMBER_VARIATION_NORMAL | InputType.TYPE_CLASS_TEXT);   }   if (showEye) {    myEdie.setTransformationMethod(new AsteriskPasswordTransformationMethod());   }   if (showClean && showEye) {    int left = myEdie.getPaddingLeft();    int top = myEdie.getPaddingTop();    int bottom = myEdie.getPaddingBottom();    myEdie.setPadding(left, top, Utils.dp2px(mContext, 90), bottom);   } else if (!showClean && !showEye) {    int left = myEdie.getPaddingLeft();    int top = myEdie.getPaddingTop();    int right = myEdie.getPaddingRight();    int bottom = myEdie.getPaddingBottom();    myEdie.setPadding(left, top, right, bottom);   } else {    int left = myEdie.getPaddingLeft();    int top = myEdie.getPaddingTop();    int bottom = myEdie.getPaddingBottom();    myEdie.setPadding(left, top, Utils.dp2px(mContext, 45), bottom);   }      myEdie.addTextChangedListener(new TextWatcher() {    @Override    public void beforeTextChanged(CharSequence s, int start, int count, int after) {    }    @Override    public void onTextChanged(CharSequence s, int start, int before, int count) {     if (s.length() > 0) {      isHideClean = false;     }    }    @Override    public void afterTextChanged(Editable s) {     if (s.length() > 0 && !isInput) {//输入字符大于0且只有一个字符时候显示清除按钮动画，小眼睛移动出位置给清除按钮使用      showEditClean();      moveEditEye();      isInput = true;     } else if (s.length() == 0) {//无字符小眼睛归位      UndoEditEye();     }     if (s.length() == 0 & !isHideClean) {      hideEditClean();      isHideClean = true;      isInput = false;     }     if (onEditInputListener != null) {      onEditInputListener.input(getText());     }    }   });   setEditClean(showClean);   ivEditClean.setOnClickListener(new OnClickListener() {    @Override    public void onClick(View v) {     myEdie.setText("");    }   });   ivEditClean.setImageResource(drawableClean);   ivEditClean.setPadding(cleanPadding, cleanPadding, cleanPadding, cleanPadding);   setEditEye(showEye);   ivEditEye.setOnClickListener(new OnClickListener() {    @Override    public void onClick(View v) {     if (isChecked) {      // 输入一个对用户可见的密码      myEdie.setTransformationMethod(HideReturnsTransformationMethod.getInstance());      myEdie.setSelection(getText().length());      ivEditEye.setImageResource(drawableEyeOpen);      isChecked = false;     } else {      // 输入一个对用户不可见的密码      myEdie.setTransformationMethod(new AsteriskPasswordTransformationMethod());      myEdie.setSelection(getText().length());      ivEditEye.setImageResource(drawableEyeClose);      isChecked = true;     }    }   });   if (drawableLeft != -1) {    ivLeftIcon.setVisibility(View.VISIBLE);    ivLeftIcon.setImageResource(drawableLeft);   } else {    ivLeftIcon.setVisibility(View.GONE);   }   view.setLayoutParams(new LayoutParams(ViewPager.LayoutParams.MATCH_PARENT, ViewPager.LayoutParams.WRAP_CONTENT));   addView(view);  }  //密码不可见时候，使用*替换密码  public class AsteriskPasswordTransformationMethod extends PasswordTransformationMethod {   @Override   public CharSequence getTransformation(CharSequence source, View view) {    return new PasswordCharSequence(source);   }   private class PasswordCharSequence implements CharSequence {    private CharSequence mSource;    public PasswordCharSequence(CharSequence source) {     mSource = source; // Store char sequence    }    public char charAt(int index) {     return '*'; // This is the important part    }    public int length() {     return mSource.length(); // Return default    }    public CharSequence subSequence(int start, int end) {     return mSource.subSequence(start, end); // Return default    }   }  }  public String getText() {   return myEdie.getText().toString().trim();  }  public void setText(String text) {   myEdie.setText(text);  }  //代码设置是否显示清除按钮  public void setEditClean(boolean isCanClose) {   showClean = isCanClose;  }  //代码设置是否显示小眼睛  public void setEditEye(boolean isCanSee) {   showEye = isCanSee;   if (showEye == true) {    ivEditEye.setVisibility(View.VISIBLE);   } else {    ivEditEye.setVisibility(View.GONE);   }  }  private void showEditClean() {   if (showClean == true) {    AnimationUtils.showAndHiddenCenterAnimation(ivEditClean, AnimationUtils.AnimationState.STATE_SHOW, 500);   }  }  private void hideEditClean() {   if (showClean == true) {    AnimationUtils.showAndHiddenCenterAnimation(ivEditClean, AnimationUtils.AnimationState.STATE_HIDDEN, 500);   }  }  private void moveEditEye() {   if (showEye) {    ObjectAnimator.ofFloat(ivEditEye, "translationX", -Utils.dp2px(mContext, ivWidth)).setDuration(500).start();   }  }  private void UndoEditEye() {   if (showEye) {    ObjectAnimator.ofFloat(ivEditEye, "translationX", 0).setDuration(500).start();   }  }  public OnEditInputListener onEditInputListener;  public void setOnEditInputListener(OnEditInputListener listener) {   onEditInputListener = listener;  }  //输入监听  public interface OnEditInputListener {   void input(String content);  } }

2.使用示例

下面是在xml布局时候，如何使用ClearEditText的示例，部分自定义属性使用xmlns:app="http://schemas.android.com/apk/res-auto"引用调用。app:showEye属性true-显示小眼睛，false-关闭小眼睛。

 <com.huaweixia.clear.ClearEditText   android:id="@+id/et_login_password"   android:layout_width="0dp"   android:layout_height="45dp"   android:layout_marginTop="30dp"   android:background="@drawable/line_bg_white_only_bottom_d8"   android:paddingLeft="10dp"   app:hint="请输入密码"   app:layout_constraintLeft_toLeftOf="@id/et_login_number"   app:layout_constraintRight_toRightOf="@id/et_login_number"   app:layout_constraintTop_toBottomOf="@id/et_login_number"   app:showEye="true"   app:textColor="@color/tv_black_333333"   app:textColorHint="@color/tv_gray_999999"   app:textSize="15sp" />

上述就是小编为大家分享的怎么在Android中实现一个带清除按钮、密码可见的输入框了，如果刚好有类似的疑惑，不妨参照上述分析进行理解。如果想知道更多相关知识，欢迎关注亿速云行业资讯频道。