How to stop android webview content reflow when double tapped?

Question

First of all, I would like the WebView can be scrolled but it need to behave just like a picture such that the scrolling would not cause the WebView to rearrange its layout to fit screen. It should just provide scrollbar when the page is really bigger than screen.

I have read How to stop android webview from wrapping content while zooming?. It works except the double tap performed.

To regenerate the problem,
1. I load a web page which is full of text to fullscreen WebView.
2. double tap the right side of screen. <--here it just zoom in, no problem
3. double tap the left side of screen.

The problem come. The text is rearranged. When I zoom back to original scale. The text is just fill in half of the screen.

How to stop webView to rearrange its layout no matter what is happening?

Answer 1

I finally solve of this by this line.

webView.getSettings().setLayoutAlgorithm(WebSettings.LayoutAlgorithm.NORMAL);

By default, the WebSettings.LayoutAlgorithm is NARROW_COLUMNS.

By study the android.webkit.ZoomManager class, it must reflow (rearrange) if NARROW_COLUMNS and the else case is reflow if necessary. I don't know what the "necessary" is but as least it won't reflow anymore in my case.

There is some off-topic but my goal is to prevent content reflow. I found out that on Android 2.x device, sometime, the web page content would reflow if I click the zoomControl button even though set webView.getSettings().setUseWideViewPort(true);.On Android 4, this problem is not exist.

If I am not mistaken. I think it is the web page meta tag cause this. Therefore, I make sure the web page don't have this line:<meta name="viewport" content="width=device-width"> .And I really can see the different that without this line, the web content do not reflow.