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

我的這個自帶清除、小眼睛的控件，是一個自定義控件，控件名稱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個字符后更改狀態(tài)為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; } //輸入監(jiān)聽 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密碼輸入框內容請搜索好吧啦網以前的文章或繼續(xù)瀏覽下面的相關文章希望大家以后多多支持好吧啦網！