Android组件之EditText

概述

EditText 是 Android 中用于接收用户输入的 UI 组件,用户可以通过来进行输入。

基本使用

在xml布局中定义EditText

    <EditText
        android:id="@+id/my_editText"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        />

在Activity中获取EditText

// 获取EditText组件
EditText myEditText = findViewById(R.id.my_editText);

效果如图:

在这里插入图片描述

样式设置

在xml中进行设置

    <EditText
        <!-- 唯一标识 -->
        android:id="@+id/my_editText"
        <!-- 组件宽度,match_parent表示跟父组件一样宽 -->
        android:layout_width="match_parent"
        <!-- 组件高度 -->
        android:layout_height="wrap_content"
        <!-- 组件的背景,可以是颜色,也可以是某图片作为背景 -->
        android:background="#AFB1B3"
        <!-- 该组件特有的文本输入提示 -->
        android:hint="请输入内容"
        <!-- 文本输入类型,可以是普通文本、密码、数字等 -->
        android:inputType="text"
        <!-- 支持的最大行数 -->
        android:maxLines="3"
        <!-- 内边距 -->
        android:padding="12dp"
        <!-- 单行模式,开启后maxLines的设置就会失效 -->
        android:singleLine="true"
        <!-- 输入的文本颜色 -->
        android:textColor="#333333"
        <!-- 提示文本的颜色 -->
        android:textColorHint="#BC5A2B"
        <!-- 字体风格,可以是普通文本、加粗、斜体等 -->
        android:textStyle="bold"
        <!-- 外边距 -->
        android:layout_margin="8dp"
    />

效果如图:

在这里插入图片描述

在Java中实现

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        // 获取EditText组件
        EditText myEditText = findViewById(R.id.my_editText);

        // 设置背景颜色
        myEditText.setBackgroundColor(Color.parseColor("#AFB1B3"));

        // 设置提示文本
        myEditText.setHint("请输入内容");

        // 设置输入类型(普通文本)
        myEditText.setInputType(InputType.TYPE_CLASS_TEXT);
        // 其他常用输入类型:
        // myEditText.setInputType(InputType.TYPE_CLASS_TEXT | InputType.TYPE_TEXT_VARIATION_PASSWORD); // 密码
        // myEditText.setInputType(InputType.TYPE_CLASS_NUMBER); // 数字

        // 设置最大行数
        myEditText.setMaxLines(3);

        // 设置内边距(12dp)
        int padding = dpToPx(12);
        myEditText.setPadding(padding, padding, padding, padding);

        // 设置单行模式(注意:设置单行模式会使maxLines失效)
        myEditText.setSingleLine(true);

        // 设置文本颜色
        myEditText.setTextColor(Color.parseColor("#333333"));

        // 设置提示文本颜色
        myEditText.setHintTextColor(Color.parseColor("#BC5A2B"));

        // 设置字体风格(加粗)
        myEditText.setTypeface(myEditText.getTypeface(), Typeface.BOLD);
        // 其他字体风格:
        // myEditText.setTypeface(null, Typeface.NORMAL); // 普通
        // myEditText.setTypeface(null, Typeface.ITALIC); // 斜体
        // myEditText.setTypeface(null, Typeface.BOLD_ITALIC); // 加粗斜体

        // 设置外边距(8dp)
        ViewGroup.MarginLayoutParams marginParams = (ViewGroup.MarginLayoutParams) myEditText.getLayoutParams();
        int margin = dpToPx(8);
        marginParams.setMargins(margin, margin, margin, margin);
        myEditText.setLayoutParams(marginParams);
    }

    // 将 dp 转换为像素
    public int dpToPx(int dp) {
        float density = getResources().getDisplayMetrics().density;
        return (int) (dp * density + 0.5f); // 四舍五入
    }
}

不同的输入类型

通过android:inputType属性来设置不同的输入类型,尤其是密码输入框尤为有效。

    <!-- 普通文本输入框 -->
    <EditText
        android:id="@+id/my_editText"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:hint="请输入内容"
    />

    <!-- 密码输入框 -->
    <EditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:inputType="textPassword"
        android:hint="请输入密码" />

    <!-- 数字输入框 -->
    <EditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:inputType="number"
        android:hint="请输入数字" />

    <!-- 多行文本 -->
    <EditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:inputType="textMultiLine"
        android:minLines="3"
        />

    <!-- 电子邮件输入 -->
    <EditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:inputType="textEmailAddress"
        android:hint="请输入邮箱" />

效果如图:

在这里插入图片描述

在这里插入图片描述

自定义样式

首先在drawable目录下创建一个名为editText_bg.xml的文件,内容如下:

<!-- 圆角边框样式 -->
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <solid android:color="#FFFFFF" />       <!-- 背景色 -->
    <corners android:radius="12dp" />        <!-- 圆角半径 -->
    <stroke
        android:width="1dp"
        android:color="#CCCCCC" />
    <!-- 内边距 -->
    <padding
        android:bottom="5dp"
        android:left="15dp"
        android:right="5dp"
        android:top="5dp" />
</shape>

接着在布局xml文件中应用该自定义样式。

    <!-- 普通文本输入框 -->
    <EditText
        android:id="@+id/my_editText"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:hint="请输入内容"
        android:background="@drawable/edittext_bg"
    />

效果如图:

在这里插入图片描述

无下划线输入框

如果想要无下划线的输入框,可以如下设置:

先在values目录下创建一个styles.xml文件(如果已有该文件则将下面内容进行合并),内容如下:

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <style name="EditTextNoUnderline" parent="Widget.AppCompat.EditText">
        <item name="colorControlNormal">#CCCCCC</item>  <!-- 默认状态颜色 -->
        <item name="colorControlActivated">#3F51B5</item>  <!-- 激活状态颜色 -->
        <item name="colorControlHighlight">#3F51B5</item>  <!-- 高亮颜色 -->
    </style>
</resources>

接着在布局xml文件中进行引用:

    <EditText
        android:id="@+id/my_editText"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:hint="请输入内容"
        android:background="@android:color/transparent"
        android:theme="@style/EditTextNoUnderline" />

效果如图:

在这里插入图片描述

其他设置

在xml中进行设置

<!-- 禁用该组件 -->
android:enabled="false"
<!-- 禁止焦点选中,通过下面两个样式设置可以实现只读输入框 -->
android:focusable="false"
<!-- 不能被点击 -->
android:clickable="false"
<!-- 也可以设置文本内容 -->
android:text="内容"

效果如图:

在这里插入图片描述

在Java中进行设置

        // 获取EditText组件
        EditText myEditText = findViewById(R.id.my_editText);
        // 禁用该组件
        myEditText.setEnabled(false);
        // 禁止焦点选中,通过下面两个样式设置可以实现只读输入框
        myEditText.setFocusable(false);
        // 不能被点击
        myEditText.setClickable(false);
        // 也可以设置文本内容
        myEditText.setText("内容");
        // 追加文本
        myEditText.append("追加文本");
        // 请求焦点
        myEditText.requestFocus();
        // 清除焦点
        myEditText.clearFocus();
        // 设置错误提示
        myEditText.setError("输入有误");

效果如图:

在这里插入图片描述

在这里插入图片描述

事件

输入过滤器

        // 获取EditText组件
        EditText myEditText = findViewById(R.id.my_editText);
        // 限制输入长度,这是API中的过滤器
        myEditText.setFilters(new InputFilter[]{new InputFilter.LengthFilter(10)});
        // 限制输入字符,这是我们自己实现的过滤器
        InputFilter filter = new InputFilter() {
            @Override
            public CharSequence filter(CharSequence source, int start, int end, Spanned dest, int dstart, int dend) {
                // source是单个字符,表示当前新输入的字符(只有一个字符),而dest表示已经输入的字符串内容(包含多个字符)
                for (int i = start; i < end; i++) {
                    // 每个字符bug只能输入字母和数字
                    if (!Character.isLetterOrDigit(source.charAt(i))) {
                        return "";
                    }
                }
                // 如果输入"bug"字符则提示错误
                if (dest.toString().contains("bug")) {
                    myEditText.setError("不能输入bug");
                    return "";
                }
                return null;
            }
        };
        myEditText.setFilters(new InputFilter[]{filter});

效果如图:

在这里插入图片描述

焦点变化监听

监听 EditText 获取和失去焦点的事件:

        // 获取EditText组件
        EditText myEditText = findViewById(R.id.my_editText);
        // 设置焦点变化监听
        myEditText.setOnFocusChangeListener(new View.OnFocusChangeListener() {
            @Override
            public void onFocusChange(View view, boolean hasFocus) {
                if (hasFocus) {
                    // 如果获得焦点
                    Toast.makeText(MainActivity.this, "已经获得焦点", Toast.LENGTH_SHORT).show();
                } else {
                    Toast.makeText(MainActivity.this, "已经失去焦点", Toast.LENGTH_SHORT).show();
                }
            }
        });

效果如图(最好需要至少两个组件来模拟该行为):

在这里插入图片描述

输入监听

监听输入框输入的文本变化,文本多了一个字符或少了一个字符都会被监听到,适合用来做输入搜索推荐。

        // 获取EditText组件
        EditText myEditText = findViewById(R.id.my_editText);
        // 文本变化监听
        myEditText.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) {
                // 文本变化时的处理
            }

            @Override
            public void afterTextChanged(Editable s) {
                // 文本变化后
                Toast.makeText(MainActivity.this, "现在的文本内容是:" + s.toString(), Toast.LENGTH_SHORT).show();
            }
        });

效果如图:

在这里插入图片描述

按键监听

应用例如处理回车键按下事件,例如可以将焦点跳到下一个组件或者进行提交表单处理((如提交数据到数据库或进行验证查询等)。

        // 获取EditText组件
        EditText myEditText = findViewById(R.id.my_editText);
        // 按键监听
        myEditText.setOnKeyListener(new View.OnKeyListener() {
            @Override
            public boolean onKey(View v, int keyCode, KeyEvent event) {
                if (event.getAction() == KeyEvent.ACTION_DOWN && keyCode == KeyEvent.KEYCODE_ENTER) {
                    // 处理回车键按下事件,例如可以将焦点跳到下一个组件或者进行提交表单处理
                    Toast.makeText(MainActivity.this, "已经按下回车键", Toast.LENGTH_SHORT).show();
                    return true; // 表示已处理该事件
                }
                return false;
            }
        });

效果如图:

在这里插入图片描述

完整实例

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".MainActivity">

    <EditText
        android:id="@+id/my_editText"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_margin="8dp"
        android:background="#AFB1B3"
        android:hint="请输入内容"
        android:inputType="text"
        android:maxLines="3"
        android:padding="12dp"
        android:singleLine="true"
        android:textColor="#333333"
        android:textColorHint="#BC5A2B"
        android:textStyle="bold" />
</LinearLayout>
public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        // 获取EditText组件
        EditText myEditText = findViewById(R.id.my_editText);

        // 限制输入长度,这是API中的过滤器
        myEditText.setFilters(new InputFilter[]{new InputFilter.LengthFilter(10)});
        // 限制输入字符,这是我们自己实现的过滤器
        InputFilter filter = new InputFilter() {
            @Override
            public CharSequence filter(CharSequence source, int start, int end, Spanned dest, int dstart, int dend) {
                // source是单个字符,表示当前新输入的字符(只有一个字符),而dest表示已经输入的字符串内容(包含多个字符)
                for (int i = start; i < end; i++) {
                    // 每个字符bug只能输入字母和数字
                    if (!Character.isLetterOrDigit(source.charAt(i))) {
                        return "";
                    }
                }
                // 如果输入"bug"字符则提示错误
                if (dest.toString().contains("bug")) {
                    myEditText.setError("不能输入bug");
                    return "";
                }
                return null;
            }
        };
        myEditText.setFilters(new InputFilter[]{filter});

        // 文本变化监听
        myEditText.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) {
                // 文本变化时的处理
            }

            @Override
            public void afterTextChanged(Editable s) {
                // 文本变化后
                Toast.makeText(MainActivity.this, "现在的文本内容是:" + s.toString(), Toast.LENGTH_SHORT).show();
            }
        });
    }
}

效果如图:

在这里插入图片描述

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值