Android - how to auto scroll textView to align with editText position?

Question

I am trying to create a notepad with the line number. I am able to display lineNumber but the problem is that as soon as editext reaches the end of the screen textview is not getting auto-scroll with editext current position or lineNumber .

Here is XML Code

<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">

<TextView
    android:id="@+id/lineNumber"
    android:layout_width="40dp"
    android:layout_height="match_parent"
    android:background="#eee"
    android:gravity="center_horizontal"
    android:padding="10dp"
    android:text="1"
    android:textSize="18sp"
    tools:layout_editor_absoluteY="12dp"
    />

<EditText
    android:id="@+id/fileText"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_toEndOf="@+id/lineNumber"
    android:ems="10"
    android:padding="10dp"
    android:gravity="left|top"
    android:inputType="textMultiLine"
    android:scrollbars="vertical"/>
</RelativeLayout>

Here is Fragment Code

public class FileViewFragment extends Fragment {

TextView lineNumber;
EditText fileText;
String fileName = "";

@Nullable
@Override
public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
    View view = inflater.inflate(R.layout.fragment_file_viewer, container, false);
    lineNumber = view.findViewById(R.id.lineNumber);
    fileText = view.findViewById(R.id.fileText);

    fileText.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) {
            int lines = fileText.getLineCount();
            String linesNumber = "";
            for (int i = 1; i <= lines; i++) {
                linesNumber = linesNumber + i + "\n";
            }
            lineNumber.setText(linesNumber);

        }

        @Override
        public void afterTextChanged(Editable s) {

        }
    });
      return view;
    }
}

So, how can I auto-scroll textview with editext position?

Answer 1

In your onTextChanged method after you have set the new lineNumber Text you have to calculate the current Y position of your EditText and scroll the TextView to that position by using its scrollTo method. The calculation of EditText Y position will be like below:

int y = fileText.getLayout().getLineTop(fileText.getLineCount()) - (fileText.getHeight()) + (fileText.getPaddingBottom()) + (fileText.getPaddingTop());
lineNumber.scrollTo(0, Math.max(y, 0));

and of course if you want the TextView to be scrollable you have to add the below line of code in your onCreateView method:

lineNumber.setMovementMethod(new ScrollingMovementMethod());

Answer 2

To solve the scrolling issue you have to change your xml file and put both EditText and TextView in a single parent View wrapping to its content which is inside a scrollview, so now the whole view will be scrollable. Below is the new xml file:

<?xml version="1.0" encoding="utf-8"?>
<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">

    <RelativeLayout
        android:layout_width="40dp"
        android:layout_height="match_parent"
        android:layout_alignParentStart="true"
        android:background="#eee"/>

    <ScrollView
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <RelativeLayout
            android:id="@+id/containerRl"
            android:layout_width="match_parent"
            android:layout_height="wrap_content">

            <TextView
                android:id="@+id/lineNumber"
                android:layout_width="40dp"
                android:layout_height="match_parent"
                android:background="#eee"
                android:gravity="center_horizontal"
                android:padding="10dp"
                android:text="1"
                android:textSize="18sp"
                tools:layout_editor_absoluteY="12dp" />

            <EditText
                android:id="@+id/fileText"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_toEndOf="@+id/lineNumber"
                android:ems="10"
                android:padding="10dp"
                android:gravity="left|top"
                android:inputType="textMultiLine"
                android:scrollbars="vertical"/>
        </RelativeLayout>

    </ScrollView>

</RelativeLayout>

And remove the lines of code in my previous answer.