CODEWITHSUNDEEP
javaandroidwebviewzooming
Carla Dessi
Carla Dessi

Reputation: 9666

Android Webview initial zoom out

I'm using a webview in my android app, at the moment when the app is started the website is zoomed in quite a lot, i want it to be zoomed out to fit the width of the screen. I currently have this in my activity:

super.onCreate(savedInstanceState);
    setContentView(R.layout.shop);
    WebView webview;
    webview = (WebView) findViewById(R.id.webview);
    webview.setWebViewClient(new WebViewClient());
    webview.getSettings().setJavaScriptEnabled(true);
    webview.loadUrl("http://www.example.com");

Upvotes: 26

Views: 42184

Answers (8)

Mehmet Baykar
Mehmet Baykar

Reputation: 364

If you need to reset the zoom level to its initial state every time a webpage loads (whether it's a refresh or a new page), you can implement the following code within the onPageFinished method. This will set the zoom to the default state:

override fun onPageFinished(view: WebView?, url: String?) {
        super.onPageFinished(view, url)
        view?.post {
            view.zoomBy(0.0101f) // Ensure the value is slightly greater than 0.01
        }
    }

This approach ensures that the zoom is effectively reset. Special thanks to George Vortelinos for providing the initial solution.

Upvotes: 0

George Vortelinos
George Vortelinos

Reputation: 41

Set WebView settings like:

webView.settings.run {
    builtInZoomControls = true
    //hide +- zoom buttons
    displayZoomControls = false 
    //zooms out the content to fit on screen by width
    loadWithOverviewMode = true 
    //when page contains the viewport meta tag
    useWideViewPort = true 
}

But consider that zoom settings above, work only for WebView first run.
If you want to full zoom out every time you load a URL in WebView (I faced this case), use zoomBy like this

webView.loadUrl(url)
webView.zoomBy(0.02f)

Upvotes: 1

Papa Yev
Papa Yev

Reputation: 628

    //This the the enabling of the zoom controls 
    webView.getSettings().setBuiltInZoomControls(true);

    //This will zoom out the WebView
    webView.getSettings().setUseWideViewPort(true);
    webView.getSettings().setLoadWithOverviewMode(true);
    webView.setInitialScale(1);

Upvotes: 8

Matt
Matt

Reputation: 728

For Kit Kat and later devices you need to set the viewport meta tag in the headers of the HTML page loaded by your WebView in order to prevent the default zoom in behavior.

<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>

Upvotes: 3

Shakti
Shakti

Reputation: 1581

webview.getSettings().setLoadWithOverviewMode(true);

This will cause the webview to be zoomed out initially. 

webview.getSettings().setUseWideViewPort(true);

The Webview will have a normal viewport (like desktop browser), when false the webview will have a viewport constrained to it's own dimensions.

EDIT: With the introduction of "Chrome web view" in Android KitKat, this code might not work.

Upvotes: 51

aleb
aleb

Reputation: 2552

This zooms out so that the content (an SVG in my case) fits on the screen but does not make unnecessary space.

webView.getSettings().setUseWideViewPort(true);
webView.setInitialScale(1);

Upvotes: 19

Zohaib Brohi
Zohaib Brohi

Reputation: 574

use the webSettings class to set the zoom level...

webview.getSettings().setDefaultZoom(WebSettings.ZoomDensity.FAR);

Upvotes: 2

Artyom Kiriliyk
Artyom Kiriliyk

Reputation: 2513

Try this:

    webView.setInitialScale(50);
    webPlanSettings.setDefaultZoom(WebSettings.ZoomDensity.FAR);
    webPlanSettings.setUseWideViewPort(true);

Upvotes: 9

Related Questions