Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to force soft-keyboard NOT to hide textview/counter under edittext?

The problem is that android keyboard is hiding textview under edittext (not edittext itself!) while being opened.

This is my layout example:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    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="wrap_content"
    tools:context=".MainActivity">


    <android.support.v4.widget.NestedScrollView
        android:id="@+id/nestedScrollView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical">

            <ImageView
                android:id="@+id/big_image"
                android:layout_width="200dp"
                android:layout_height="600dp"
                android:layout_centerHorizontal="true"
                android:background="@color/colorPrimary"
                android:src="@drawable/ic_launcher_foreground"/>


            <android.support.design.widget.TextInputLayout
                android:id="@+id/comment_input_layout"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_below="@+id/big_image">

                <EditText
                    android:id="@+id/comment_edittext_view"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:hint="your comment"
                    android:imeOptions="actionDone"
                    android:maxLength="250"/>
            </android.support.design.widget.TextInputLayout>

            <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_below="@+id/comment_input_layout"
                android:text="0/250"/>
        </RelativeLayout>

    </android.support.v4.widget.NestedScrollView>
</LinearLayout>

Images below to make it clear:

screen without keyboard

actual behavior

expected behavior

I found several similar questions on stackoverflow, none of them has solutions:( Please, help me to deal with this problem! Be sure, that I used all advices considering android:windowSoftInputMode="adjustPan" or android:windowSoftInputMode="adjustResize" or android:focusableInTouchMode="true" or android:fitsSystemWindows="true" or adding this textview on separate from edittext layout, having framelayout as root,

but the problem is a little more complicated.

Another important things are, that this text below edittext should

  • remain above keyboard while text is going on another line

  • dissapear while edittext is scrolling up (as it is the part of edittext).

like image 423
Yulia Avatar asked Jun 02 '19 17:06

Yulia


2 Answers

I faced the same issue. I have already log a ticket to Material regarding this. The "hack" I applied, thanks to my awesome colleague's advice is this: Whenever the layout is rendered and I click on the field which has the counter (which is the last field on my layout), scroll it to the bottom programatically, so that the keyboard not longer hides the counter.

Here are the difference pieces of code of my program which you can refer to:

    override fun onFocusChange(p0: View?, isOnFocus: Boolean) {
    if (isOnFocus.not() && getDescription().isEmpty()) {
        tnDescriptionLayout.error = resources.getString(R.string.description_error_message)
        tnDescriptionLayout.isErrorEnabled = true
    } else {
        tnDescriptionLayout.isErrorEnabled = false

        llayout.postDelayed(object : Runnable {
            override fun run() {
                var v =
                    tnDescriptionLayout.findViewById<AppCompatTextView>(R.id.textinput_counter)
                nestedScrollView.smoothScrollBy(0,v.height)
            }

        }, CoreConstants.MINIMUM_VIEW_LOAD_DURATION)
    }
    tvDescription.setText(getDescription())



    lateinit var nestedScrollView: NestedScrollView
    fun change(nestedScrollView: NestedScrollView){
      this.nestedScrollView=nestedScrollView
    }

    paymentOrderContent.change(nestedScrollView = parentView.nestedScrollViewParent)

I hope that this helps you!

like image 81
Jeyveen Bhoyroo Avatar answered Oct 14 '22 01:10

Jeyveen Bhoyroo


You can archive your design using this design also

In XML use TextInputLayout instated of edittext

                <android.support.design.widget.TextInputLayout
                    android:id="@+id/itFAuthAnswer"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_marginTop="@dimen/_5sdp"
                    app:passwordToggleEnabled="true"
                    app:counterEnabled="true"// add this 
                    app:counterMaxLength="250" //add this
                    app:hintTextAppearance="@style/AppTextInputHintLabelStyle">

                    <EditText
                        android:id="@+id/etName"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:hint="@string/et_auth_f_que_hint"
                        android:imeOptions="actionDone"
                        android:singleLine="true"/>
                </android.support.design.widget.TextInputLayout>

This lines of code is solved your issue in different way and its also suitable to your currant design.

app:counterEnabled="true"// make it true
app:counterMaxLength="250"//set your limit

Happy Learning...

like image 45
Arbaz.in Avatar answered Oct 14 '22 01:10

Arbaz.in