Android WebView wrap text to newline and prevent horizontal scrolling

Question

I am using a WebView to display content, however, content that is long creates horizontal scrolling, which is not desired. When I attempt to use methods like setLoadWithOverviewMode() and setUseWideViewPort(), etc, as all of the other solutions suggest, the text is shrunk too small to read. The Autosizing Layout Algorithm produces the same result as well. The desired outcome is to have the html retain its scale, but wrap the text to make it fit the screen, rather than scaling the text size down. Here is my xml, if its any help:

<ScrollView>
        ...

        <LinearLayout
                android:id="@+id/details_fragment_description_container"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_marginBottom="@dimen/margin_extra_extra_large"
                android:background="@color/white"
                android:orientation="horizontal"
                android:paddingTop="@dimen/padding_extra_extra_large"
                android:visibility="visible">

            <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:paddingEnd="@dimen/padding_extra_extra_large"
                    android:paddingStart="@dimen/padding_extra_extra_large"
                    android:src="@drawable/ic_drafts_24_biscay"/>

            <WebView
                    android:id="@+id/details_fragment_description_webview"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"/>

        </LinearLayout>

score -1 · Answer 1 · answered Jun 27 '18 at 17:44

-1

Create an instance of your WebView within your activity/class, then call setOnTouchListener interface on your instance and disable the scrolling programmatically:

webview.setOnTouchListener(new View.OnTouchListener() {
public boolean onTouch(View v, MotionEvent event) {
  return (event.getAction() == MotionEvent.ACTION_MOVE);
}
});

Then, within your xml, wrap your WebView with ScrollView and set android:scrollbars="vertical"

<ScrollView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:scrollbars="vertical">
   <WebView
   android:id="@+id/details_fragment_description_webview"
   android:layout_width="match_parent"
   android:layout_height="wrap_content"/>
</ScrollView>

Credit goes to this solution

answered Jun 27 '18 at 17:44

Red M

2,609
3
30
50

Unfortunately this does not work either. This solution merely cuts of the part of the view that does not fit on the device screen by preventing horizontal scrolling. This is only part of the solution, as I would like the text that is being cut off to wrap to a new line, or to fit on the device screen _without_ scaling down in size. – Jason Cromer Jun 27 '18 at 17:48
I believe that this will have to be achieve from the website itself because what you are asking for is to not change the size and to not cut off the lines that goes beyond the device screen. Android xml layout will provide you with the ability to scale the size of the text so that it fits its screen or to cut it off, however I believe that it's impossible to create a new text line in the website itself from the Android API. – Red M Jun 27 '18 at 18:16
I am not displaying a website, I am displaying HTML text. – Jason Cromer Jun 27 '18 at 18:18
An alternative is to directly use your html text into your android but then you will get rid off WebView but that does not answer your question. – Red M Jun 27 '18 at 18:36

Android WebView wrap text to newline and prevent horizontal scrolling

1 Answers1