問題描述

我已經(jīng)研究過使用 TextWatcher 和 InputFilter，但我不太確定如何解決這個(gè)問題.

I've looked into using a TextWatcher and an InputFilter, but I'm not too sure how to approach this problem.

這個(gè)想法是有一個(gè) EditText 從右到左插入文本.隨著使用輸入的變化，我希望發(fā)生以下情況.

The idea is to have an EditText that inserts text from right to left. As the use input changes, I would like the following to occur.

- User enters "1" -> Text formats as 00:01
- User enters "2" -> Text formats as 00:12
- User enters "8" -> Text formats as 01:28

我該如何處理?Inputfilter 似乎用于排除文本并在 TextWatcher 內(nèi)使用 setText 似乎在無限循環(huán)中運(yùn)行.

How could I approach this? Inputfilter seems to be for excluding text and using setText inside the TextWatcher appears to run in an endless loop.

推薦答案

所以我昨天想出了一個(gè)相當(dāng)不錯(cuò)的解決方案.

So I came up with a pretty decent solution yesterday.

我使用了兩個(gè)編輯文本和一個(gè)文本視圖.我在約束布局中對(duì)齊它們

I used two edit texts and a text view. I Aligned them within a constraint layout

        <TextView
            android:id="@+id/colon"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:gravity="center"
            android:text=":"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent" />


        <EditText
            android:id="@+id/hoursInput"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:gravity="end"
            android:inputType="number"
            android:maxLength="3"
            android:text="00"
            app:layout_constraintBottom_toBottomOf="@id/colon"
            app:layout_constraintEnd_toStartOf="@id/colon"
            app:layout_constraintTop_toTopOf="@id/colon"
            app:layout_constraintVertical_bias="0.0" />

        <EditText
            android:id="@+id/minutesInput"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:gravity="end"
            android:inputType="number"
            android:maxLength="3"
            android:text="00"
            app:layout_constraintBottom_toBottomOf="@id/colon"
            app:layout_constraintStart_toEndOf="@id/colon"
            app:layout_constraintTop_toTopOf="@id/colon" />

因?yàn)槲抑幌胧褂脭?shù)字，所以我不得不使用文本視圖來表示冒號(hào).修改了每個(gè)輸入的文本觀察器.我利用字符串大小來確定何時(shí)完全更新文本，并使用 onTextChanged 強(qiáng)制字符串始終為最小大小 2 - 小時(shí)和分鐘看起來完全相同，除了枚舉/光標(biāo)位置.字段本身將允許在光標(biāo)位置輸入第三個(gè)數(shù)字.因此，帶有12"的字段將變?yōu)?23"，然后觸發(fā)更新時(shí)間，這會(huì)確定我們是否需要在其他位置設(shè)置文本，或者拒絕數(shù)字，或者需要任何自定義邏輯.

Since I only wanted to use numbers so I had to use a text view to represent the colon. modified the Text watcher for each input. I leveraged the string size in determining when to update the text entirely, and used onTextChanged to force the string to always be at minimum size 2 - Both the hours and minutes look exactly the same, with the exception of the enum/cursor position. The fields themselves would allow for a third digit to be enterd at the cursor position. So a fiel with "12" would turn into "123" and then trigger update time, which figures out if we need to set text else where, or reject the number, or whatever custom logic is required.

addTextChangedListener(object : TextWatcher {
            override fun afterTextChanged(s: Editable?) {  
                if (s != null && s.toString().length > 2)
                    //I used an ENUM to tell my update time function which view I was in. More to come.  Cusor position is set in the keylistener
                    updateTime(s.toString, hoursInput.text, cursorPosition, Field.MINUTES) 
            }

            override fun beforeTextChanged(s: CharSequence?, start: Int, count: Int, after: Int) {

            }

            override fun onTextChanged(s: CharSequence?, start: Int, before: Int, count: Int) {
                if (s != null && s.length < 2)
                    StringBuilder(s).apply { this.insert(0, "0") }.toString().also {
                        minutesInput.setText(it)
                    }
            }
        })

我還添加了一個(gè) onKeyListener 來監(jiān)視刪除鍵，專門用于實(shí)現(xiàn)自定義邏輯.但在它返回按下鍵的結(jié)果之前，我會(huì)跟蹤每個(gè)事件的 keydown 上的光標(biāo)位置.分鐘和小時(shí)輸入看起來相同/相似.

I also added an onKeyListener to watch the delete key specifically to implement custom logic. But before it would return the result of the key pressed, i'd track the cursor position on keydown for every event. Both minutes and Hours inputs look the same/similar.

 setOnKeyListener { _, keyCode, keyEvent ->
            if (keyEvent.action == KeyEvent.ACTION_DOWN) cursorPosition = selectionStart
            (keyCode == KeyEvent.KEYCODE_DEL && keyEvent.action == KeyEvent.ACTION_DOWN && selectionStart == selectionEnd && selectionStart != 0).also { performDelete ->
                if (performDelete) Logic.deleteTime(minutesInputString, minutesInput.text, cursorPosition, Field.Minutes)
            }
        }

最后，我有我的邏輯類，我實(shí)際上執(zhí)行了字符串操作.

Finally, I have my Logic class which I actually performed the string manipulation.

// Inside update/delete I convert the strings into a string that is like 00129 and use the cursorPosition/Field enum to determine where to add text.
Logic.updateTime(minutesInputString, hoursInputString, cursorPosition, Field) : String[]
Logic.deleteTime(minutesInputString, hoursInputString, cursorPosition, Field): String[]

然后我立即使用輸入設(shè)置時(shí)間.

I then set the time immediately with the inputs.

updateTime(mins, hours, position, Field.MINUTES).also{ 
    // ("00", "129", 2, Minutes) returns as ["01", "29"] 
    minutesInput.setText(it[0])
    minutesInput.setText(it[1])
}

仍在解決的復(fù)雜問題，但這就是我解決它的方法.實(shí)施這個(gè)解決方案花了我 4 個(gè)小時(shí)，我已經(jīng)轉(zhuǎn)動(dòng)了將近三天的輪子！

Complicated problem that is still being worked on, but this is how I've solved it. Implementing this solution took me 4 hours where I had spun my wheels for nearly three days!

這篇關(guān)于android 的 EditText 的動(dòng)態(tài)前導(dǎo)文本的文章就介紹到這了，希望我們推薦的答案對(duì)大家有所幫助，也希望大家多多支持html5模板網(wǎng)！