Android界面端Android开发探索我爱编程

重拾Android之路之EditText

2018-03-30  本文已影响624人  OzanShareing

引言

EditTex是Android中比较常用的一个控件,可以说它是用户和Android应用进行数据传递的通道.通过它,用户可以把数据传给App,然后我们可以获取到用户输入的数据.

EditText是TextView的子类,它继承了TextView的所有属性.在实际开发中我们可能会根据开发需求,自定义出比较美观的EditText控件,这里我们不说自定义EditText.主要说一下EditText使用中的细节.以及使用EditText过程中遇到的坑...

正文

EditText属性(API 24)
使用细节

我们在使用EditText中有时候会限制输入框中输入的文本类型,或者当弹出软键盘时,出现的是比较合适的输入法.如:我们在QQ时,弹出的软件盘显示的就是数字,当输入密码时,右下角编辑框显示的是"完成",点击即会关闭软键盘.其实这也就是inputType和imeOptions属性来实现的, inputType属性可以指定键盘的类型,而imeOptions指定键盘右下角显示的Action.下面我们就来实现EditText使用过程中的小细节.

  1. 这个类似QQ登录输入框,第一个EditText(用户名)的inputType设置的是text,imeOptions设置的是actionNext(下一个).第二个EditText(密码)的inputType设置的是textPassword,imeOptions设置的是actionDone(完成).当输入完用户名,点击键盘action下一个,会跳到密码输入框,当输入完密码后,点击键盘action完成,软键盘就会隐藏.来看下效果图就明白来.

Xml布局:

<EditText
     android:id="@+id/et_user_name"
     android:layout_width="match_parent"
     android:layout_height="wrap_content"
     android:hint="请输入用户名..."
     android:imeOptions="actionNext"
     android:inputType="text"
     android:textColor="@color/black" />

 <EditText
     android:id="@+id/et_password"
     android:layout_width="match_parent"
     android:layout_height="wrap_content"
     android:hint="请输入密码..."
     android:imeOptions="actionDone"
     android:inputType="textPassword"
     android:textColor="@color/black" />

注意：这里需要注意的是,如果想让键盘显示Action,需要inputType和imeOptions结合使用才可以,只使用imeOptions是不会有效果的.只会显示默认的换行action.(不同手机的输入法不一样,可能显示的会有点小差别)

  1. 接下来我们看一下inputType可以接受的参数:

我们可以使用android：inputType属性指定要用于EditText对象的键盘类型.例如,如果你希望用户输入电子邮件地址，则应使用textEmailAddress输入类型.以下是输入类型常见的值:

android：inputType还允许指定某些键盘行为,例如是否大写所有新单词或使用自动完成和拼写建议等功能.以下是定义键盘行为的一些常见输入类型值:

  1. 上面演示第一个小栗子时,说了当需要指定键盘action时,需要和inputType结合使用才会有效果,下面就来看下imeOptions可以接受的参数:下面直接来张图,大家一看就明白了.上图....

在代码中我们可以响应action操作的事件.如xml布局中有一个id为search的EditText控件,并指定imeOptions="actionSearch",我们可以指定action操作的事件.

 EditText editText = (EditText) findViewById(R.id.search);
 editText.setOnEditorActionListener(new OnEditorActionListener() { 
 @Override 
 public boolean onEditorAction(TextView v, int actionId, KeyEvent event) {
     boolean handled = false;
     if (actionId == EditorInfo.IME_ACTION_SEND) {
         Toast.makeText(this, "点击actionSearch执行的操作 ", Toast.LENGTH_SHORT).show(); 
         handled = true;
     } 
     return handled;
 } 
 });

注意：再次提醒,在使用imeOptions时,如果你没有使用inputType属性,是不会有效果的.

  1. 最后一个就是使用EditText中遇到的坑了....相信大多数开发者都遇到过,那就是当你的EditText输入框在屏幕的下方时,弹出软键盘会遮挡住输入框...当然,你可以使用ScrollView嵌套EditText来解决这一问题.但我最近看到一篇文章,感觉很优雅的就解决了这个问题.下面贴出文章地址.软键盘挡住输入框问题的终极解决方案.
EditText属性大全（重新收录）

EditText继承关系：View-->TextView-->EditText

简单示例：

演示效果：

涉及到关于EditText的问题

1.怎样改变EditText样式（去下划线 圆滑矩形片框 背景颜色等）

2.EditText光标显示位置，颜色，高度等

源码展示

1.通过背景这一属性设置EditText圆滑片框，片框颜色，背景颜色

drawable下创建et.xml

<?xml version="1.0" encoding="utf-8"?>
<layer-list
    xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape
            xmlns:android="http://schemas.android.com/apk/res/android"
            android:shape="rectangle">
            <solid
                android:color="#FFFFFF"/>
            <corners
                android:bottomRightRadius="5dip"
                android:bottomLeftRadius="5dip"
                android:topLeftRadius="5dip"
                android:topRightRadius="5dip"/>
            <stroke
                android:width="0.5px"
                android:color="#505050"/>
        </shape>
    </item>
</layer-list>

属性可以根据要求改

2.activity.xml

<RelativeLayout 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:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:paddingBottom="@dimen/activity_vertical_margin" tools:context=".MainActivity">

    <TextView android:text="登录" android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true"
        android:id="@+id/textView_1" />
    <View
        android:layout_width="match_parent"
        android:layout_height="1dp"
        android:background="#C6C7C7"
        android:layout_below="@+id/textView_1"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"
        android:id="@+id/view"></View>

    <EditText
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:id="@+id/editText"
        android:paddingLeft="20dp"
        android:hint="用户名/邮箱/手机号"
        android:textCursorDrawable="@null"

        android:background="@drawable/et"
        android:layout_below="@+id/view"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="20dp" />

    <EditText
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:id="@+id/editText2"
        android:background="@drawable/et"
        android:paddingLeft="20dp"
        android:hint="请输入密码："
        android:layout_below="@+id/editText"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="20dp" />

    <EditText
        android:layout_width="wrap_content"
        android:layout_height="50dp"
        android:id="@+id/editText3"
        android:paddingLeft="20dp"
        android:hint="请输入验证码："
        android:background="@drawable/et"
        android:layout_below="@+id/editText2"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"
        android:layout_marginTop="20dp"
        android:layout_alignRight="@+id/textView_1"
        android:layout_alignEnd="@+id/textView_1" />

    <EditText
        android:layout_width="140dp"
        android:layout_height="50dp"
        android:background="@drawable/et"
        android:id="@+id/editText4"
        android:layout_alignBottom="@+id/editText3"
        android:layout_alignParentRight="true"
        android:layout_alignParentEnd="true" />

    <EditText
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:text="登录"
        android:editable="false"
        android:textColor="#FFFFFF"
        android:gravity="center"
        android:background="@drawable/et1"
        android:id="@+id/editText5"
        android:layout_below="@+id/editText3"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="30dp" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="40dp"
        android:text="免费注册"
        android:textColor="#F98498"
        android:gravity="center"
        android:id="@+id/textView"
        android:layout_below="@+id/editText5"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="40dp"
        android:text="忘记密码?"
        android:textColor="#77B1F3"
        android:gravity="center"
        android:id="@+id/textView2"
        android:layout_below="@+id/editText5"
        android:layout_alignParentRight="true"
        android:layout_alignParentEnd="true" />
</RelativeLayout>

3.关于光标设置

（1）使光标移动到制定的位置：editText.setSelection(2);（输入的参数是个整数）

（2）在请求出现光标时，也就是在获取焦点时：editText.requestFocus();
清除光标，也就是失去焦点：editText.clearFocus();

（3）让EditText不出现光标：editText.setCursorVisible(false);

也可以属性中修改android：cursorVisible及是否显示光标

（4）光标颜色：android:textCursorDrawable="@null"与字体同色

（5）自定义光标样式：

<EditText  
android:layout_width="match_parent"  
android:layout_height="wrap_content"  
android:textCursorDrawable="@drawable/color_cursor"/>  
样式文件：  
<?xml version="1.0" encoding="utf-8"?>    
<shape xmlns:android="http://schemas.android.com/apk/res/android"    
    android:shape="rectangle">    
    <size android:width="1dp" />  
    <solid android:color="#000000"  />  
</shape>

edittext 下划线颜色更改的问题：

styles里apptheme（app主题）加上
<item name="colorAccent">@color/primary_blue（其他颜色也行）</item>

或者：

在styles.xml文件中声明自定义样式

<style name="MyEditText" parent="Theme.AppCompat.Light"> 
 <item name="colorControlNormal">@color/indigo</item> 
 <item name="colorControlActivated">@color/pink</item>
</style>

通过android：theme属性将此样式应用于您的EditText

<EditText 
 android:layout_width="match_parent"
 android:layout_height="wrap_content"
 android:hint="Hint text"
 android:theme="@style/MyEditText"/>

效果如下：


监听EditText的变化

使用EditText的addTextChangedListener(TextWatcher watcher)方法对EditText实现监听，TextWatcher是一个接口类，所以必须实现TextWatcher里的抽象方法：

et.addTextChangedListener(new TextWatcher() {  

            @Override 
            public void beforeTextChanged(CharSequence s, int start, int count,  
                    int after) {  
                tv.setText("还能输入"+Rest_Length+"个字");              
            }  

            @Override 
            public void afterTextChanged(Editable s) {  
                tv.setText("还能输入"+Rest_Length+"个字");  
            }  

            @Override 
            public void onTextChanged(CharSequence s, int start, int before, int count) {  
                if(Rest_Length>0){  
                    Rest_Length = MAX_LENGTH - et.getText().length();  
                }  
            }             
        });  

        clearBtn.setOnClickListener(new Button.OnClickListener() {        
            @Override 
            public void onClick(View v) {  
                et.setText("");  
                Rest_Length = MAX_LENGTH;  
            }  
        });  
    }

现在有个小需求，需要输入11位手机号码，但是需要在第三位和第四位之间加上空格，第七位和第八位中间加上空格

效果如下：

贴上代码：

        editTextPhone.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) {
                L.i("start :" + start);
                if ((start == 3 || start == 8) && (tempLength < s.length())) {
                    s = s.subSequence(0, s.length() - 1) + " " + s.charAt(s.length() - 1);
                    editTextPhone.setText(s);
                    editTextPhone.setSelection(s.length());
                    L.i("start1 :" + start);
                } else if ((start == 4 || start == 9) && (tempLength > s.length())) {
                    s = s.subSequence(0, s.length() - 1);
                    editTextPhone.setText(s);
                    editTextPhone.setSelection(s.length());
                    L.i("start2 :" + start);
                }

                if ((start == 12) && (tempLength < s.length())) {
                    buttonNext.setEnabled(true);
                } else {
                    buttonNext.setEnabled(false);
                }
                tempLength = s.length();
            }

            @Override
            public void afterTextChanged(Editable s) {
            }
        });

注意：1.如果直接用editTextPhone.setText(s);没有editTextPhone.setSelection(s.length());这段代码的话，光标会回到初始位置0，因此，要将光标移至当前最末位。另外，(起始位置为0)在位置为3的时候，好理解，意味着第三个数字输入中状态时添加空格。后面的位置注意是8，并不是7，因为空格已经被添加进去了，因此要往后移一位。往回删的时候，删除的位置就不能再是原先的位置3和位置8了，而应该是他们的各自后一位，位置4和位置9。判断是输入还是删除状态，比较简单，判断tempLength与当前Sequence s.length()的大小即可。

还有一点，在输入位置12时，start==12，当删除当前位置12时，start还是==12，因此要多加输入/删除的判断。

上一篇 下一篇

猜你喜欢

热点阅读