Android webview fit all content to screen

12,507

Solution 1

use this following methods.

webview.getSettings().setUseWideViewPort(true);
webview.getSettings().setLoadWithOverviewMode(true);

Solution 2

To make the webview expand to the whole screen, add the webview in your activity layout xml and make sure you set the layout_width and layout_height to fill_parent. Here's a simple example:

  <LinearLayout 
  xmlns:android="http://schemas.android.com/apk/res/android"
  android:orientation="vertical"
  android:layout_width="fill_parent"
  android:layout_height="fill_parent">
  <WebView  
      android:id="@+id/webview"
      android:layout_width="fill_parent" 
      android:layout_height="fill_parent"/>
  </LinearLayout>
Share:
12,507
MW_hk
Author by

MW_hk

Updated on July 26, 2022

Comments

  • MW_hk
    MW_hk over 1 year

    Hi I have a webview and I want it to fit to screen, such that the user does not have to scroll horizontally or vertically

    I have searched before, many suggest the following but it only limits the width, user will still have to scroll vertically:

    engine = (WebView) (findViewById(R.id.webView1));
    engine.loadUrl(www.example.com); 
    engine.getSettings().setLoadWithOverviewMode(true);
    engine.getSettings().setUseWideViewPort(true);
    

    I tried another method, using scaling method, but it won't work..... I got the window width (1024 pixels) and the web content width was also 1024 pixels!! So the scaling did not work.... Is there any method to get the correct scale?

    Or....is there any other way?....THANKS!!

    // get the window width and height
        Point outSize = new Point();
        getWindowManager().getDefaultDisplay().getSize(outSize);
        width = outSize.x;
        height = outSize.y;
        Log.i("Menuboard", "width: " + Integer.toString(width) + ", height: "
                + Integer.toString(height));
    
    WebViewClient client = new WebViewClient() {
    
            public void onPageFinished(WebView view, String url) {
                int x = engine.getWidth();
                int y = engine.getHeight();
    
                Log.i("Menuboard", "web width: " + Integer.toString(x)
                        + ", height: " + Integer.toString(y));
    
                int scale1 = width * 100/x;
                int scale2 = height * 100/y;
    
                Log.i("Menuboard", "Scale1: " + Integer.toString(scale1)
                        + ", Scale2: " + Integer.toString(scale2));
    
                if (scale1 < scale2) {
                    engine.setInitialScale(scale1);
                    Log.i("Menuboard", "scale1");
                } else if (scale1 > scale2) {
                    engine.setInitialScale(scale2);
                    Log.i("Menuboard", "scale2: " + Integer.toString(scale2));
                }
            }
        };
    
        engine = (WebView) (findViewById(R.id.webView1));
        engine.loadUrl(string);
        engine.getSettings().setBuiltInZoomControls(true);
        engine.setPadding(0, 0, 0, 0);
                engine.setWebViewClient(client);
    

    Just some notes:

    To scale the webview:

    engine = (WebView) (findViewById(R.id.webView1));
    engine.loadUrl(www.example.com);
    engine.getSettings().setBuiltInZoomControls(true);
    engine.setPadding(0, 0, 0, 0);
    engine.setInitialScale(50); // 0 - 100 where 100 is full scale
    

    To get window width and height:

    Point outSize = new Point();
    getWindowManager().getDefaultDisplay().getSize(outSize);
    width = outSize.x;
    height = outSize.y;