相信不少小伙伴在開發登錄功能時候，或多或少都會用到輸入框清除按鈕、密碼可見與隱藏小眼睛按鈕，我之前也是但寫這個功能，但是在找回密碼、忘記密碼里面還要重新寫一次很是麻煩，現在我把它只做了一個自定義控件，可以配置清除按鈕、密碼可見小眼睛是否顯示以及圖標，有漸隱漸顯和橫向移動動畫，不知道怎么上傳可以直接觀看的視頻，附上三張效果圖，可以點擊鏈接觀看視頻是否是你想要的效果。

我的這個自帶清除、小眼睛的控件，是一個自定義控件，控件名稱ClearEditText.class，繼承RelativeLayout并有布局引用。在拷貝到項目里面后，使用時候只需要與普通輸入框控件一樣，進行相關的配置即可，部分屬性需要使用自定義屬性，具體見代碼。

拷貝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: 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' />總結

一開始我之前自己用的自帶清空、密碼可見的自定義輸入框，是沒有清除按鈕顯示，密碼可見按鈕移動動效，清除按鈕顯示比較僵硬，在清除按鈕隱藏時候小眼睛按鈕后面有一定空白，顯示看著比較別扭，加了動效后視覺上感覺更加順暢，希望對部分需要的小伙伴有空，下面附上 下載demo的鏈接 地址，有需要可以下載看看。

到此這篇關于Android帶清除按鈕、密碼可見小眼睛的輸入框的文章就介紹到這了,更多相關android密碼輸入框內容請搜索好吧啦網以前的文章或繼續瀏覽下面的相關文章希望大家以后多多支持好吧啦網！