edittext 输入完成_EditText-用户输入正确完成

edittext 输入完成

When you want to allow the users of your application to have the ability to enter text - you use the EditText component. This seemingly simple UI element has plenty of weird behaviors associated with it that are not so easy to overcome or anticipate. This article will cover some of them and present solutions.

如果要允许应用程序的用户输入文本,请使用EditText组件 。 这个看似简单的UI元素具有许多与之相关的怪异行为,这些行为不是那么容易克服或预期的。 本文将介绍其中一些内容并提出解决方案。

We’ll start with the basics.

我们将从基础开始。

<EditText
        android:id="@+id/edit_text"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent">
    </EditText>
Image for post
Visual Representation
视觉表现

If we want to have a placeholder to make it easier for the user to understand what he/she needs to type, we use the hint attribute:

如果我们希望有一个占位符以使用户更容易理解他/她需要输入的内容,则可以使用hint属性:

<EditText
      android:id="@+id/edit_text"
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:hint="Write some text here"  // <-------------
      app:layout_constraintBottom_toBottomOf="parent"
      app:layout_constraintEnd_toEndOf="parent"
      app:layout_constraintStart_toStartOf="parent"
      app:layout_constraintTop_toTopOf="parent">
</EditText>
Image for post

We can also let the Android system know what type of keyboard to bring up by indicating the inputType.

我们还可以通过指示inputType来让Android系统知道要启动的键盘类型。

<EditText
      android:id="@+id/edit_text"
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:hint="Write some text here"
      android:inputType="textCapWords" // <------------------
      app:layout_constraintBottom_toBottomOf="parent"
      app:layout_constraintEnd_toEndOf="parent"
      app:layout_constraintStart_toStartOf="parent"
      app:layout_constraintTop_toTopOf="parent">
</EditText>
Image for post

用户输入的陷阱 (The Pitfalls Of User Input)

One of the major flaws with user input is knowing when the user has finished typing. If your application has a button telling the user to perform some action (think submit) after filling out several edit texts, then you are fine. But if you don’t want to bother the user with endless submit buttons, you need to think of a way to overcome this barrier.

用户输入的主要缺陷之一是知道用户何时完成键入。 如果您的应用程序具有一个按钮,告诉用户在填写多个编辑文本后执行某些操作(请考虑提交),那么您就可以了。 但是,如果您不想用无休止的提交按钮来打扰用户,则需要考虑一种克服此障碍的方法。

The solution is to use the TextWatcher. This interface exposes three methods you can use to understand how the user interacted with your edit text.

解决方案是使用TextWatcher 。 该界面提供了三种方法,可用于了解用户如何与您的编辑文本进行交互。

  • afterTextChanged

    afterTextChanged
  • beforeTextChanged

    beforeTextChanged
  • onTextChanged

    onTextChanged

We will be using this interface, particularly, the afterTextChanged method, in combination with a timer. This timer’s purpose is to measure a certain period of time that will pass, so we can say with assurance that the user has finished typing.

我们将结合使用此接口(尤其是afterTextChanged方法)和计时器。 此计时器的目的是测量将过去的特定时间,因此可以肯定地说用户已经完成键入。

val edittext : EditText = findViewById(R.id.edit_text)


edittext.addTextChangedListener(object: TextWatcher {
  
    var delay : Long = 1000 // 1
    var timer = Timer()


    override fun afterTextChanged(p0: Editable?) {


        timer = Timer()
        timer.schedule(object : TimerTask() {
            override fun run() {
                //2
            }
        }, delay)
    }


    override fun beforeTextChanged(p0: CharSequence?, p1: Int, p2: Int, p3: Int) {
    }


    override fun onTextChanged(p0: CharSequence?, p1: Int, p2: Int, p3: Int) {
        timer.cancel() //3
        timer.purge()
    }
})
  1. Is the time we wait when no user action has occurred to decide if the user has finished typing

    是我们等待的时间,当用户没有动作来确定用户是否完成输入时
  2. Inside the run method we can enact any logic that we want after we know the user has finished typing

    在run方法中,我们可以在知道用户完成键入后执行所需的任何逻辑
  3. If during the time we are waiting, the user has begun writing again, we remove the timer so it will not be triggered

    如果在等待期间用户再次开始写入,则我们删除了计时器,因此不会触发它

EditorActionListener (EditorActionListener)

If the above solution seems cumbersome to you and you may want a different approach, you can also listen in on when the user has pressed the Done button in the soft keyboard or presses the enter button.

如果上述解决方案对您来说很麻烦,并且您可能希望使用其他方法,那么当用户按下软键盘中的“完成”按钮或按下Enter按钮时,您也可以进行监听。

To do that, we use the EditorActionlistener and check either the actionId or the keyEvent that just occurred.

为此,我们使用EditorActionlistener并检查刚刚发生的actionId或keyEvent。

edittext.setOnEditorActionListener {view, actionId, keyEvent ->
          if (actionId == EditorInfo.IME_ACTION_SEARCH || actionId == EditorInfo.IME_ACTION_DONE ||
              keyEvent == null ||
              keyEvent.keyCode == KeyEvent.KEYCODE_ENTER) {
              //User finihsed typing
              true
          }
          false
      }

To make this work, make sure to mark the inputType of the edit text as Text.

为此,请确保将编辑文本的inputType标记为Text。

Image for post
Photo by Stefan Cosma on Unsplash
Stefan CosmaUnsplash拍摄的照片

不要失去重点 (Don’t Loose Focus)

If you place an edit text in your layout, chances are, that once the layout containing that edit text appears to the user, the edit text will have the focus. This means that the soft keyboard may pop up or the user may be distracted from other areas you may want his/her focus to be on. So, how can we avoid this behavior?

如果在布局中放置编辑文本,则一旦包含该编辑文本的布局显示给用户,该编辑文本就会成为焦点。 这意味着软键盘可能会弹出,或者用户可能会从您可能希望重点放在其他区域上分散注意力。 那么,如何避免这种行为呢?

We need to add to the parent layout where our edit text resides, two attributes with the value of true:

我们需要在编辑文本所在的父布局中添加两个值为true的属性:

  1. focusable - controls if the view should take focus

    可聚焦-控制视图是否应聚焦
  2. focusableInTouchMode - controls if a view takes control in touch mode

    focusableInTouchMode-控制视图是否在触摸模式下获得控制权
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity"
    android:focusable="true"     // <--------------------
    android:focusableInTouchMode="true">  // <-----------


    <EditText
        android:id="@+id/edit_text"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent">


    </EditText>




</androidx.constraintlayout.widget.ConstraintLayout>

You can see all the examples shown in this article in an application I created at this GitHub repository.

您可以在我在GitHub存储库中创建的应用程序中看到本文显示的所有示例。

翻译自: https://proandroiddev.com/edittext-user-input-done-right-9efebe877091

edittext 输入完成

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值