WebView gets maximum scroll width

Question

Hi guys, I am creating an epub reader and have downloaded the book in an Android web browser. and also made a webview to move horizontally, referring to this, but now I want the web view to move like pages, so I want to do this 1. Calculate the total horizontal width and width of the screen, now divide them to get the total number of pages 2 .block scrolling of the web profile and, when the user runs, set the scrolling of webview to the screen width * swipeCount

Now the problem is that when I try to get totalHorizontalScrollWidth, it gives the width of the screen, I tried these methods, but both give the same result

Firstmethod

ViewTreeObserver vto = webView.getViewTreeObserver(); vto.addOnGlobalLayoutListener(new OnGlobalLayoutListener() { @Override public void onGlobalLayout() { webView.getViewTreeObserver().removeGlobalOnLayoutListener(this); Log.e("ScrollWidth",""+webView.getMeasuredWidth()); Toast.makeText(getApplicationContext(), "new Width is"+webView.getMeasuredWidth(), Toast.LENGTH_SHORT).show(); } }); 

returns 480 screen widths

and SecondMethod

 public class WebViewWidth extends WebView { public WebViewWidth(Context context) { super(context); } public WebViewWidth(Context context, AttributeSet attrs) { super(context, attrs); } public int getContentWidth() { return this.computeHorizontalScrollRange(); } public int getContentHeight() { return this.computeVerticalScrollRange(); } } 

and used this webView to get computeHorizontalScrollRange, like this one

 private class MyWebViewClient extends WebViewClient { private Context mContext; public MyWebViewClient(Context context) { this.mContext = context; } @Override public boolean shouldOverrideUrlLoading(WebView view, String url) { return true; } @Override public void onPageFinished(WebView view, String url) { mProgressDialog.dismiss(); final WebView myWebView = (WebView) view; String varMySheet = "var mySheet = document.styleSheets[0];"; String addCSSRule = "function addCSSRule(selector, newRule) {" + "ruleIndex = mySheet.cssRules.length;" + "mySheet.insertRule(selector + '{' + newRule + ';}', ruleIndex);" + "}"; String insertRule1 = "addCSSRule('html', 'padding: 0px; height: " + (myWebView.getMeasuredHeight() / mContext.getResources().getDisplayMetrics().density) + "px; -webkit-column-gap: 0px; -webkit-column-width: " + myWebView.getMeasuredWidth() + "px;')"; myWebView.loadUrl("javascript:" + varMySheet); myWebView.loadUrl("javascript:" + addCSSRule); myWebView.loadUrl("javascript:" + insertRule1); super.onPageFinished(view, url); int widthis = webView.getContentWidth(); Toast.makeText(getApplicationContext(), "Width is"+widthis, Toast.LENGTH_SHORT).show(); Log.i("WidthTotoal Scroll", ""+widthis); } } 

Even this gives a result like 480, which is the screen size

I also came across this script, but don't know how to get the values ​​from this script in android

  String js = ""+ "var desiredHeight;"+ " var desiredWidth;"+ " var bodyID = document.getElementsByTagName('body')[0];"+ " totalHeight = bodyID.offsetHeight;"+ "pageCount = Math.floor(totalHeight/desiredHeight) + 1;"+ " bodyID.style.padding = 10;"+ //(optional) prevents clipped letters around the edges " bodyID.style.width = desiredWidth * pageCount;"+ " bodyID.style.height = desiredHeight;"+ " bodyID.style.WebkitColumnCount = pageCount;"; 

someone please help me get the maximum webview scrollbar width or some alternative to get an effect like page rotation.

Answer 1

i there was a problem and the solution was to keep the countdown timer and give a delay of 1 second before calculating the width

this is how i did it

  @Override public void onPageFinished(final WebView view, String url) { final WebView myWebView = (WebView) view; String varMySheet = "var mySheet = document.styleSheets[0];"; String addCSSRule = "function addCSSRule(selector, newRule) {" + "ruleIndex = mySheet.cssRules.length;" + "mySheet.insertRule(selector + '{' + newRule + ';}', ruleIndex);" + "}"; String insertRule1 = "addCSSRule('html', 'padding: 0px; height: " + (myWebView.getMeasuredHeight() / mContext.getResources().getDisplayMetrics().density) + "px; -webkit-column-gap: 0px; -webkit-column-width: " + myWebView.getMeasuredWidth() + "px;')"; String js = ""+ "var desiredHeight;"+ " var desiredWidth;"+ " var bodyID = document.getElementsByTagName('body')[0];"+ " totalHeight = bodyID.offsetHeight;"+ "pageCount = Math.floor(totalHeight/desiredHeight) + 1;"+ " bodyID.style.padding = 10;"+ //(optional) prevents clipped letters around the edges " bodyID.style.width = desiredWidth * pageCount;"+ " bodyID.style.height = desiredHeight;"+ " bodyID.style.WebkitColumnCount = pageCount;"+ "function getPagesCount() {"+ " android.getPagesCount(pageCount);"+ " };"; myWebView.loadUrl("javascript:" + varMySheet); myWebView.loadUrl("javascript:" + addCSSRule); myWebView.loadUrl("javascript:" + insertRule1); view.setVisibility(View.VISIBLE); super.onPageFinished(view, url); CountDownTimer test= new CountDownTimer(3000,1000) { @Override public void onTick(long millisUntilFinished) { } @Override public void onFinish() { int widthis = webView.getContentWidth(); TotalScrollWidth=widthis; Log.i("WidthTotoal Scroll", ""+widthis); TotalPages= (TotalScrollWidth/ScreenWidth)-1; Toast.makeText(getApplicationContext(), "Total Pages are" +TotalPages, 100).show(); progressPages.setMax(TotalPages); progressdialog.dismiss(); } }; test.start(); } 

Answer 2

I guess I'm very late, but thanks to this I was able to implement smooth horizontal scroll animation in WebView.

According to your initial question, where do you want to get the total width of the html page, in my solution, I used the WebChromeClients onJsAlert () method, in which you can get the return values ​​from javascript. I use this method to get the number of horizontal pages.

In my MainActivity.java

 @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) { WebView.setWebContentsDebuggingEnabled(true); } wv = (HorizontalWebView) findViewById(R.id.web_view); wv.getSettings().setJavaScriptEnabled(true); wv.setWebViewClient(new WebViewClient() { public void onPageFinished(WebView view, String url) { injectJavascript(); } }); wv.setWebChromeClient(new WebChromeClient() { @Override public boolean onJsAlert(WebView view, String url, String message, JsResult result) { int pageCount = Integer.parseInt(message); wv.setPageCount(pageCount); result.confirm(); return true; } }); wv.loadUrl("file:///android_asset/ch03.html"); } private void injectJavascript() { String js = "function initialize(){\n" + " var d = document.getElementsByTagName('body')[0];\n" + " var ourH = window.innerHeight;\n" + " var ourW = window.innerWidth;\n" + " var fullH = d.offsetHeight;\n" + " var pageCount = Math.floor(fullH/ourH)+1;\n" + " var currentPage = 0;\n" + " var newW = pageCount*ourW;\n" + " d.style.height = ourH+'px';\n" + " d.style.width = newW+'px';\n" + " d.style.margin = 0;\n" + " d.style.webkitColumnCount = pageCount;\n" + " return pageCount;\n" + "}"; wv.loadUrl("javascript:" + js); wv.loadUrl("javascript:alert(initialize())"); } 

I use javascript: alert (initialize ()) to execute a javascript function in which I return the number of horizontal pages that have been created. which I pass to the custom WebView.

HorizontalWebView.java

 public class HorizontalWebView extends WebView { private float x1 = -1; private int pageCount = 0; public HorizontalWebView(Context context, AttributeSet attrs) { super(context, attrs); } @Override public boolean onTouchEvent(MotionEvent event) { switch (event.getAction()) { case MotionEvent.ACTION_DOWN: x1 = event.getX(); break; case MotionEvent.ACTION_UP: float x2 = event.getX(); float deltaX = x2 - x1; if (Math.abs(deltaX) > 100) { // Left to Right swipe action if (x2 > x1) { turnPageLeft(); return true; } // Right to left swipe action else { turnPageRight(); return true; } } break; } return true; } private int current_x = 0; private void turnPageLeft() { if (getCurrentPage() > 0) { int scrollX = getPrevPagePosition(); loadAnimation(scrollX); current_x = scrollX; scrollTo(scrollX, 0); } } private int getPrevPagePosition() { int prevPage = getCurrentPage() - 1; return (int) Math.ceil(prevPage * this.getMeasuredWidth()); } private void turnPageRight() { if (getCurrentPage() < pageCount - 1) { int scrollX = getNextPagePosition(); loadAnimation(scrollX); current_x = scrollX; scrollTo(scrollX, 0); } } private void loadAnimation(int scrollX) { ObjectAnimator anim = ObjectAnimator.ofInt(this, "scrollX", current_x, scrollX); anim.setDuration(500); anim.setInterpolator(new LinearInterpolator()); anim.start(); } private int getNextPagePosition() { int nextPage = getCurrentPage() + 1; return (int) Math.ceil(nextPage * this.getMeasuredWidth()); } public int getCurrentPage() { return (int) (Math.ceil((double) getScrollX() / this.getMeasuredWidth())); } public void setPageCount(int pageCount) { this.pageCount = pageCount; } } 

You can find a complete working solution here.