How can i load image url to fit my webview in android?

Question

I am developing an android application.Here i am displaying a url image in webview. But the image is not fit to my webview. some one is suggested to use viewport concept. But i am not able to use that perfectly. I attached my issue in drawing form with explanation. I used

mWebView.getSettings().setUseWideViewPort (true);

but not get the good result. I need to show the fitted image in all resolution devices including 7inch, 10 inch tablets. So please look at the attached image and suggest me the right way to fit url image in my webview place. I would like to show my image same as in 3rd diagram.

Here is my code for loading image:

webView = (WebView) findViewById(R.id.webimage);
        WebSettings webSettings = imageView.getSettings(); 
        webSettings.setLoadsImagesAutomatically(true);
        webSettings.setSupportZoom(true) ;
        webSettings.setBuiltInZoomControls(true);
        webView.setBackgroundColor(Color.TRANSPARENT);
        webView.getSettings().setUseWideViewPort (true);
        webView.getSettings().setLoadWithOverviewMode(true);
        webView.setWebViewClient(new WebViewClient()
        {
        //some dialog implementation
        }
        webView.loadUrl(myurl);

enter image description here

Is the url image coming from a html page? Will you have hands on the html code? — kittu88, Nov 22 '12 at 11:39
Thanks for fast response. i edited my question by adding my code which i am using to load image in webview — Raghu Mudem, Nov 22 '12 at 11:48

score 2 · Answer 1 · edited May 23 '17 at 11:58

you can set width attribute of img to 100% and don't set height attribute

<body >
<img id="resizeImage" src="you_image.png" width="100%" alt="" />
</body>

Edited : Actually i also Having the Same Problem. However Still i am Waiting for the Correct Answer.

you can refere my Question HERE

though i have managed some how this Problem with a Trick by managing height and Width of Device. and Using wv.setInitialScale(185); ByDefault the Zoom will be in Top Left Corner.

i have put my code below.

WindowManager mWinMgr;
    public static int displayWidth = 0, displayHeight = 0;

    @Override
    protected void onCreate(Bundle icicle) {
        // TODO Auto-generated method stub
        super.onCreate(icicle);
        // this.getWindow().requestFeature(Window.FEATURE_PROGRESS);
        // this.setProgressBarVisibility(true);
        mWinMgr = (WindowManager) this.getSystemService(Context.WINDOW_SERVICE);
        displayWidth = mWinMgr.getDefaultDisplay().getWidth();
        displayHeight = mWinMgr.getDefaultDisplay().getHeight();

        setContentView(R.layout.view_my_poops);

        try {
            Map_Type = getIntent().getExtras().getString("MAP_TYPE");
        } catch (Exception e) {

        }
        Log.i(TAG, "MAP TYPE" + Map_Type);

    }

    @SuppressLint("SetJavaScriptEnabled")
    @Override
    protected void onResume() {
        // TODO Auto-generated method stub
        super.onResume();

        WebView wv;

        wv = (WebView) findViewById(R.id.webview_MyPoops);
        wv.getSettings().setJavaScriptEnabled(true);
        // this.setProgressBarVisibility(true);
        if (displayWidth >= 552 && displayHeight >= 976 || displayWidth >= 976
                && displayHeight >= 552) {
            wv.setInitialScale(185);
        } else {
            // wv.setInitialScale(150);
        }
        // wv.setInitialScale(30);


        URL = "YOUR_URL";


        Log.i(TAG, "Loading URL" + URL);

        final Activity activity = ViewMyPoop.this;

        wv.setWebChromeClient(new WebChromeClient() {

            public void onProgressChanged(WebView view, int progress) {
                // TODO Auto-generated method stub
                // Log.i(TAG, "Inside OnProgress Changed" + URL);
                activity.setTitle("Loading...");
                activity.setProgress(progress * 100);
                if (progress == 100)
                    activity.setTitle("My title");
            }
        });

        wv.loadUrl(URL);
        wv.setWebViewClient(new WebViewClient());
}

Hope it will Some How Help you.

Thank for your response.i cann't edit html source.Just i am getting image link api call — Raghu Mudem, Nov 22 '12 at 12:02
I need to run my application all devices like tablets and note's also — Raghu Mudem, Nov 22 '12 at 12:14
yes it will run in all devices. you can try it out. but the thing is we will not get image 100% fit in every device. but by implementing it. you can get 90% solution to your problem. i am also waiting for the other Efficient answer. — Bhavesh Patadiya, Nov 22 '12 at 12:17
this answer actually helped me, this should be accepted as the right answer, — jofftiquez, Feb 19 '14 at 08:36

score 1 · Answer 2 · answered Apr 26 '13 at 04:30

Are u try below code for above problem:-

Display display = getWindowManager().getDefaultDisplay();
int width=display.getWidth();

String data="<html><head><title>Example</title><meta name=\"viewport\"\"content=\"width="+width+", initial-scale=0.65 \" /></head>";
data=data+"<body><center><img width=\""+width+"\" src=\""+url+"\" /></center></body></html>";
webView.loadData(data, "text/html", null);

score 0 · Answer 3 · edited May 23 '17 at 12:03

0

You can try this:

webView.setInitialScale(30);
WebSettings webSettings = webView.getSettings();
webSettings.setUseWideViewPort(true);

Refer: link

edited May 23 '17 at 12:03

Community

1
1

answered Nov 22 '12 at 11:52

kittu88

2,451
5
40
80

But i cann't edit html source.Just i am getting image link api call. still not getting – Raghu Mudem Nov 22 '12 at 12:02
ok then just use the code for the webview set up. I guess it will help you. Ignore the html part. – kittu88 Nov 22 '12 at 12:03
No i tried that also but my image is showing like 1st diagram in my attached diagram – Raghu Mudem Nov 22 '12 at 12:09
adding my webview code here: – Raghu Mudem Nov 22 '12 at 12:44

How can i load image url to fit my webview in android?

3 Answers3

Linked