How to disable webview vertical scrolling to load the whole page as another column

I want to disable the vertical scroll view of the webview. Load the web page as columns in a webview using this method, I can give the user the effect of reading a book.

this style i added in html.it doesn't work at all.

loadingStringHorizontal="<style type='text/css'>body { width:200px;height:400px; -webkit-column-gap:17px;-webkit-column-width:170px; text-align:justify ;} </style>"; 

Thank you for your time.

+6
source share
3 answers

You can try to split one column

 myWebView.getSettings().setLayoutAlgorithm(LayoutAlgorithm.SINGLE_COLUMN); 

or in XML you cannot put it in scrollbar

 <WebView android:scrollbars="none" /> 

then set myWebView.setScrollContainer(false);

+4
source

first you need to add a custom webview to disable vertical scrolling down

 class CustomWebView2 extends WebView { Context mContext = null; private float start_y = -1; private String DEBUG_TAG = " touch:"; public CustomWebView2(Context context) { super(context); mContext = this.getContext(); } public CustomWebView2(Context context, AttributeSet attrs) { super(context, attrs); mContext = context; } @Override public boolean onTouchEvent(MotionEvent event) { int action = event.getAction(); switch (action) { case (MotionEvent.ACTION_DOWN): /** * get Y position */ start_y = event.getY(); break; case (MotionEvent.ACTION_MOVE): /** * if you scroll to up more than 60px * webView scroll back to Y=0 */ if(start_y-event.getY()>60) { scrollTo(getScrollX(),0); return true; } break; case (MotionEvent.ACTION_UP): Log.d(DEBUG_TAG, "Action was UP"); break; } return super.onTouchEvent(event); } } 

then you can create multiple webview columns using javascript ( fooobar.com/questions/96881 / ... )

You must apply these lines to your webview setup.

  CustomWebView webView_ = (CustomWebView) view.findViewById(R.id.webView); webView_.getSettings().setUseWideViewPort(true); webView_.getSettings().setLayoutAlgorithm(LayoutAlgorithm.NARROW_COLUMNS); /** * hide vertical scrollBar */ webView_.setVerticalScrollBarEnabled(false); 

after fully loading the page in a web browser, you should run javascript code in your web browser

  webView_.setWebViewClient(new WebViewClient(){ public void onPageFinished(WebView view, String url) { injectJavascript(); } }); 

this is javascript code

 public void injectJavascript() { String js = "javascript:function initialize() { " + "var d = document.getElementsByTagName('body')[0];" + "var ourH = window.innerHeight; " + "var ourW = window.innerWidth; " + "var fullH = d.offsetHeight; " + "var pageCount = Math.floor(fullH/ourH)+1;" + "var currentPage = 0; " + "var newW = pageCount*ourW; " + "d.style.height = ourH+'px';" + "d.style.width = newW+'px';" + "d.style.webkitColumnGap = '2px'; " + "d.style.margin = 0; " + "d.style.webkitColumnCount = pageCount;" + "}"; webView_.loadUrl(js); webView_.loadUrl("javascript:initialize()"); } 
+1
source

Try adding CSS overflow: auto;overflow-y: hidden;

0
source

Source: https://habr.com/ru/post/885714/


All Articles