Android点击按钮后将输入框中内容清空 android输入框控件

转载

mob64ca14133dc6 2024-07-23 08:24:43

文章标签 android 验证码输入框 combox控件下拉框里赋默认值 android Text 输入框 文章分类 Android 移动开发

第一次写图文，有哪些语句或其他问题的，请谅解。

本人是是一名刚刚毕业的实习生，由于技术比较差，在家休养几个月进行自学。最近看到这样的验证码输入框，感觉创意很好，所以想着自己也模仿着写一个。

Android点击按钮后将输入框中内容清空 android输入框控件_输入框

好的，下面开始。

首先创建一个自定义的View类，命名为VerifyEditText，我们让其继承RelativeLayout

public

然后我们在values文件夹里面创建一个verifyeditattr.xml文件夹，根节点是resources

然后写入一下内容：

<declare-styleable

这个文件的内容就是我们自定义View的一些属性以及其属性值类型，稍等我会说明如何使用。

之后打开刚刚创建的VerifyEditText类，创建一个私有方法initView()，如下所示：

private

为什么会有一个AttributeSet的参数呢？是因为我们将自定义的view属性分开来写了，当然也可以直接写在构造函数里面。

首先引入自定义的view属性：

TypedArray typedArray = context.obtainStyledAttributes(attrs,R.styleable.VerifyEditText);

然后我们需要将刚刚在xml文件里的写下的属性在这里获取一下：

int textColor = typedArray.getColor(R.styleable.VerifyEditText_textColor, Color.BLACK);
 int backgroundColor = typedArray.getColor(R.styleable.VerifyEditText_backgroungColor,Color.WHITE);
 float fontSize = typedArray.getDimension(R.styleable.VerifyEditText_fontSize,10f);

typedArray.getXXX的方法解释如下：

textColor = typedArray.getColor(/*自定义的View属性*/, /*默认值*/);

当所有的自定义属性初始化完成后，我们需要将TypedArray回收，下面这个方法可以回收：

typedArray.recycle();

好的，下面我们创建一个布局文件：

<?xml version="1.0" encoding="utf-8"?>

首先，既然输入，我们肯定需要一个输入框：

<EditText
        android:id="@+id/edit_text_view"
        android:layout_width="match_parent"
        android:layout_height="48dp"
        />

高度可以根据实际情况自定义，我这里就随便写了48dp

然后，我们不希望这个输入框被用户看到，当然我们也不能直接使用visibility="gone"来隐藏输入框，因为我们还需要使用输入框来输入验证码。

我们需要注意一下事项：

输入框会被用户看到。
长按事件
光标
输入文本类型控制
输入的最大长度

我们来一个一个的解决，

第一个：我们可以将文本内容以及背景颜色均改为与父布局一致即可
第二个：根据实际需求可以使用longClickable方法取消
第三个：可以使用cursorVisible属性取消
第四个：inputType
第五个：maxLength

好的，我们最后来看一下EditText控件

<EditText
        android:id="@+id/edit_text_view"
        android:layout_width="match_parent"
        android:layout_height="48dp"
        android:background="@color/colorWhite"
        android:textColor="@color/colorWhite"
        android:longClickable="false"
        android:maxLength="4"
        android:inputType="number"
        android:cursorVisible="false"

        />

好的，下面创建一个LinearLayout布局，我们写那四个验证码文本以及验证码下面的横线，

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="48dp"
    android:gravity="center"
    android:orientation="horizontal">
   
</LinearLayout>

然后在里面写下四个TextView，还有四个View用于占空，隔开四个TextView，之后再写一个LinearLayout布局，里面写下四个View，用于充当验证码下面的横线提示。

所以总的布局文件则是下面这样：

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http:///apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <EditText
        android:id="@+id/edit_text_view"
        android:layout_width="match_parent"
        android:layout_height="48dp"
        android:background="@color/colorWhite"
        android:textColor="@color/colorWhite"
        android:longClickable="false"
        android:maxLength="4"
        android:focusableInTouchMode="true"
        android:focusable="true"
        android:inputType="number"
        android:cursorVisible="false"

        />

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="48dp"
        android:orientation="horizontal"
        >

        <TextView
            android:id="@+id/tv_0"
            android:layout_width="41dp"
            android:layout_height="48dp"
            android:background="#FFFFFF"
            android:gravity="center"
            android:textColor="#000000"
            android:textSize="30sp"
            android:textStyle="bold"
            android:layout_weight="1"

            />

        <View
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:background="@color/colorAndroidDefault"
            android:layout_weight="1" />
        <TextView
            android:id="@+id/tv_1"
            android:layout_width="41dp"
            android:layout_height="48dp"
            android:background="#FFFFFF"
            android:gravity="center"
            android:textColor="#000000"
            android:textSize="30sp"
            android:textStyle="bold"
            android:layout_weight="1"

            />

        <View
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:background="@color/colorAndroidDefault"
            android:layout_weight="1" />
        <TextView
            android:id="@+id/tv_2"
            android:layout_width="41dp"
            android:layout_height="48dp"
            android:background="#FFFFFF"
            android:gravity="center"
            android:textColor="#000000"
            android:textSize="30sp"
            android:textStyle="bold"
            android:layout_weight="1"

            />

        <View
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:background="@color/colorAndroidDefault"
            android:layout_weight="1" />

        <TextView
            android:id="@+id/tv_3"
            android:layout_width="41dp"
            android:layout_height="48dp"
            android:background="#FFFFFF"
            android:gravity="center"
            android:textColor="#000000"
            android:textSize="30sp"
            android:textStyle="bold"
            android:layout_weight="1"

            />

    </LinearLayout>
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="48dp"
        android:orientation="horizontal"
        android:gravity="center"
        >
        <View
            android:layout_width="41dp"
            android:layout_height="2dp"
            android:layout_gravity="bottom"
            android:layout_weight="1"
            android:background="#C4C4C4" />

        <View
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1" />

        <View
            android:layout_width="41dp"
            android:layout_height="2dp"
            android:layout_weight="1"
            android:layout_gravity="bottom"
            android:background="#C4C4C4" />

        <View
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1" />

        <View
            android:layout_width="41dp"
            android:layout_height="2dp"
            android:layout_weight="1"
            android:layout_gravity="bottom"
            android:background="#C4C4C4" />

        <View
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1" />

        <View
            android:layout_width="41dp"
            android:layout_height="2dp"
            android:layout_weight="1"
            android:layout_gravity="bottom"
            android:background="#C4C4C4" />

    </LinearLayout>


</RelativeLayout>

好的，我们的布局文件已经写好的，下面回到我们的自定义View类VerifyEditText

下面我们引入创建好的布局文件：

inflate(context,R.layout.view_verify_code,this);

之后在初始化TextView以及EditText控件(由于textView过多，我们使用数组)： TextView[] textViews;

TextView

然后把刚刚自定的属性值赋值给对应的控件属性

for (TextView textView:textViews){
            textView.setTextColor(textColor);
            textView.setTextSize(fontSize);
            textView.setBackgroundColor(backgroundColor);
 }

然后我们监听我们的EditText的输入事件：

editText.addTextChangedListener(new TextWatcher() {
            @Override
            public void beforeTextChanged(CharSequence charSequence, int i, int i1, int i2) {

            }

            @Override
            public void onTextChanged(CharSequence charSequence, int i, int i1, int i2) {

            }

            @Override
            public void afterTextChanged(Editable editable) {

           }

我们只需要监听最后一个输入之后的事件就行了，前两个不用管，空着就行。

我们获取输入框的文本内容然后赋值给TextView进行显示给用户：

for (int i=0;i<editable.length();i++){
    textViews[i].setText(editable.charAt(i)+"");
}

然后以及删除操作，不能只输入不能删除啊：

switch (editable.length()){
                    case 0:
                       for (int i=0;i<editable.length();i++){
                         textViews[i].setText("");
                        }
                        break;
                    case 1:
                        textViews[1].setText("");
                        textViews[2].setText("");
                        textViews[3].setText("");
                        break;
                    case 2:
                        textViews[2].setText("");
                        textViews[3].setText("");
                        break;
                    case 3:
                        textViews[3].setText("");
                        break;
                }

这里写的粗糙，暂时没想到怎么写。见谅

我们还需要一个方法用于返回用户输入的验证码文本：

public String getText(){
        return editText.getText().toString();
    }

这里必须是public类型的，不然别人怎么使用呢？哈哈。

好了，到这里我们就写完了，回过头来看看整体内容，其实也没什么难度，删除操作时也可以监听键盘事件，不过这个无法准确监听，有的键盘不会返回自己按下的按钮，我们就只好通过EditText的监听事件来执行删除操作。

好了，萌新求个关注，谢谢ヾ(≧▽≦*)o

本文章为转载内容，我们尊重原作者对文章享有的著作权。如有内容错误或侵权问题，欢迎原作者联系我们进行内容更正或删除文章。

上一篇：mac 安装mysql 详细 macbook 安装mysql

下一篇：SQL server 查询parent 下所有子集 employees sqlsugar 子查询

提问和评论都可以，用心的回复会被更多人看到评论

发布评论

相关文章

官方博客	全部文章	热门标签	班级博客
了解我们	网站地图	意见反馈

鸿蒙开发者社区	51CTO学堂
51CTO	软考资讯

Android点击按钮后将输入框中内容清空 android输入框控件

Android点击按钮后将输入框中内容清空 android输入框控件

51CTO博客