WebView获得最大滚动宽度

时间：2016-10-25 11:20:38

标签： javascript android webview

大家好我正在创建epub阅读器并在android webview中加载这本书 并使webview水平移动引用this  但现在我想让webview像页面一样移动所以我想这样做 1.计算总水平线宽度和屏幕宽度，现在将它们除以得到总页数 2.锁定webview的滚动，当用户滑动时，将webview的滚动设置为screenwidth * swipeCount

现在的问题是，当我试图获得totalHorizo​​ntalScrollWidth它给出了屏幕宽度我尝试了这些方法，但都给出了相同的结果

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();
        }
    });

返回480个屏幕宽度

和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();
}
}

并使用此webView获取此类

的computeHorizo​​ntalScrollRange 
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);

 }
 }

即便如此，结果为480，即屏幕尺寸

我也遇到过这个脚本，但不知道如何从这个脚本获取值到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;";

有人请帮助我获取webview的最大水平滚动宽度或某些替代方法以获得翻页效果。

2 个答案:

答案 0 :(得分：2)

我想我已经很晚了但是感谢this我能够在WebView中实现平滑的水平滑动动画。

根据您的初始问题，想要获得html页面的总宽度，在我的解决方案中，我使用了 WebChromeClients onJsAlert（）方法，您可以在其中获取从javascript返回值。我使用这种方法来获取水平页面的数量。

在我的 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())");
}

我使用 javascript：alert（initialize（））来执行javascript函数，其中我返回已创建的水平页面的数量。我传递给Custom WebView。

<强> Horizo​​ntalWebView.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;
    }
}

您可以找到完整的解决方案here

答案 1 :(得分：1)

我解决了这个问题，解决方案是保持倒数计时器并在计算宽度前给出1秒延迟

这是我怎么做的

 @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();



}
相关问题
最新问题