Autosizing EditText

Ahmed Hegazy picture Ahmed Hegazy · Nov 1, 2017 · Viewed 12.1k times · Source

Android recently added the support for resizing TextViews text size based on the view size and the min and max text size.
https://developer.android.com/guide/topics/ui/look-and-feel/autosizing-textview.html

Unfortunately, they don't support EditTexts, so Is there any other alternatives for EditText?

Answer

Sulfkain picture Sulfkain · Jan 19, 2018

I was stuck as you, how EditText is child of TextView but don't support autosize ¿?¿?

I have achieve this with some kind of hack. First I saw the TextView code to copy and implement as extension (in Kotlin) on EditTextView, but.. there is a bulk of methods, so endly I discard that option.

What I have do, it's to use a TextView invisible (yes I know is a complete hack, am not very happy with that but Google should be ashamed about this)

This is my xmls

    <TextView android:id="@+id/invisibleTextView"
    android:layout_height="0dp"
    android:layout_width="match_parent"
    android:focusable="false"
    app:autoSizeTextType="uniform"
    app:autoSizeMinTextSize="@dimen/text_min"
    app:autoSizeMaxTextSize="@dimen/text_max"
    app:autoSizeStepGranularity="@dimen/text_step"
    android:textAlignment="center"
    app:layout_constraintLeft_toLeftOf="@id/main"
    app:layout_constraintRight_toRightOf="@id/main"
    app:layout_constraintTop_toBottomOf="@id/textCount"
    app:layout_constraintBottom_toBottomOf="@id/main"
    android:visibility="invisible"
    tool:text="This is a Resizable Textview" />


<EditText android:id="@+id/resizableEditText"
    android:layout_height="0dp"
    android:layout_width="match_parent"
    android:textAlignment="center"
    app:layout_constraintLeft_toLeftOf="@id/main"
    app:layout_constraintRight_toRightOf="@id/main"
    app:layout_constraintTop_toBottomOf="@id/textCount"
    app:layout_constraintBottom_toBottomOf="@id/main"
    android:maxLength="@integer/max_text_length"
    tool:text="This is a Resizable EditTextView" />

Note: It's important both view have the same width/height

Then on my code I use the autocalculations from this textview to use on my EditTextView.

private fun setupAutoresize() {
    invisibleTextView.setText("a", TextView.BufferType.EDITABLE) //calculate the right size for one character
    resizableEditText.textSize = autosizeText(invisibleTextView.textSize)
    resizableEditText.setHint(R.string.text_hint)

    resizableEditText.addTextChangedListener(object : TextWatcher {
        override fun afterTextChanged(editable: Editable?) {
            resizableEditText.textSize = autosizeText(invisibleTextView.textSize)
        }

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

        override fun onTextChanged(s: CharSequence?, start: Int, before: Int, count: Int) {
            textCount.text = currentCharacters.toString()
            val text = if (s?.isEmpty() ?: true) getString(R.string.text_hint) else s.toString()
            invisibleTextView.setText(text, TextView.BufferType.EDITABLE)
        }
    })
}

private fun autosizeText(size: Float): Float {
    return size / (resources.displayMetrics.density + MARGIN_FACTOR /*0.2f*/)
}

As note, for change the size of hint i use this Android EditText Hint Size.

I know it's a hard workaround, but at least we are sure this will continue working even when resizable change on future versions, while a propetary or abandoned github lib will fail.

I hope some day, google hear us and implement on childs this wonderfull feature, and we could avoid all this stuff

Hope this helps