Android自定义密码输入框(可显示或隐藏)

先上效果图

1.首先在layout下新建xml文件 view_pas_edittext

主要控件为EditText和Button,其中Button存放闭眼的图片,其他样式自定(闭眼和眼睛两张图片可在阿里图标下载)

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="match_parent"
    android:layout_height="match_parent">
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="horizontal"
        android:background="@color/white">
        <EditText
            android:id="@+id/et_view"
            android:layout_width="0dp"
            android:layout_height="fill_parent"
            android:layout_marginLeft="10dp"
            android:layout_weight="4"
            android:background="@null"
            android:gravity="center_vertical"
            android:singleLine="true"
            android:textColor="#0e0e0e"
            android:textColorHint="#b0c6ce"
            android:textSize="14sp" />

        <Button
            android:id="@id/bt_show"
            android:layout_width="20dp"
            android:layout_height="20dp"
            android:layout_gravity="right|center_vertical"
            android:layout_margin="10dp"
            android:padding="5dp"
            android:background="@drawable/hide_pas" />
    </LinearLayout>

</LinearLayout>

2.新建CustomizePasEditText继承LinearLayout,实现View.onClickListener接口

public class CustomizePasEditText extends LinearLayout implements View.OnClickListener {
    private EditText editText;
    private Button showButton;
    //true为隐藏,false为显示
    private boolean mode = true;

//设置提示文字
    public void setEditTextHint(String hint){
        if(editText!=null){
            editText.setHint(hint);
        }
    }
//获得输入框文字
    public String getText(){
        return editText.getText().toString();
    }

    public CustomizePasEditText(Context context, AttributeSet attrs) {
        super(context, attrs);
        LayoutInflater.from(context).inflate(R.layout.view_edittext,this,true);
        editText = findViewById(R.id.et_view);
        
       //一开始密码是隐藏的,因此一开始使用闭眼图片,并且将EditText的输入类型设置为密码(不可见)
        showButton= findViewById(R.id.bt_show);
        showButton.setBackgroundResource(R.drawable.hide_pas);
        editText.setInputType(InputType.TYPE_CLASS_TEXT | InputType.TYPE_TEXT_VARIATION_PASSWORD);
        showButton.setOnClickListener(this);
    }

    @Override
    public void onClick(View v) {
        //当点击了显示/隐藏按钮,则改变editText的文字显示方式
        switch (v.getId()){
            case R.id.bt_show:
                //从隐藏变显示
                if(mode){
                                  editText.setInputType(InputType.TYPE_TEXT_VARIATION_VISIBLE_PASSWORD);
                    //为了点击之后输入框光标不变
                    editText.setSelection(editText.getText().length());
                    showButton.setBackgroundResource(R.drawable.show_pas);
                    mode = !mode;
                }else {
                    editText.setInputType(InputType.TYPE_CLASS_TEXT | InputType.TYPE_TEXT_VARIATION_PASSWORD);
                      //为了点击之后输入框光标不变
                    editText.setSelection(editText.getText().length());
                    showButton.setBackgroundResource(R.drawable.hide_pas);
                    mode = !mode;
                }
                break;
        }
    }

//获得输入框内容
    public EditText getEditText(){
        return editText;
    }
}

3.在activity中使用

首先在activity的xml中调用该控件

<com.xx.xx.customUI.CustomizePasEditText
                android:id="@+id/ed_pas"
                android:layout_width="match_parent"
                android:layout_height="@dimen/control_big_margin"
                android:textColorHint="@color/light_gray"
                android:hint="@string/ed_hint_pas"
                android:background="@null"
                android:padding="10dp"
                android:textColor="@color/black"
                android:inputType="textPassword"
                android:lines="1"
                android:maxLength="16"/>

然后在代码中使用

//注册绑定
CustomizePasEditText pasEditText; 

pasEditText = findViewById(R.id.ed_pas);
pasEditText.setEditTextHint(getResources().getString(R.string.ed_hint_pas));

//获得输入内容
String pas = pasEditText.getText();

注意,如果要动态改变输入框样式,需在CustomizePasEditText中编写

  • 2
    点赞
  • 9
    收藏
    觉得还不错? 一键收藏
  • 3
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值