Android webview - webpage renders in a very broken way

Question

I am trying to load this popular podcast in an Android WebView:

http://www.stitcher.com/podcast/entrepreneuronfirecom/entrepreneur-on-fire-tim-ferriss-other-incredible-entrepreneurs

And this is how I render it:

public class PodcastsActivity extends BaseActivity  
{    
    @Override
    public void onCreate(Bundle savedInstanceState) 
    {
        super.onCreate(savedInstanceState);

        WebView webview = new WebView(this);
        webview.getSettings().setAppCacheEnabled(false);
        webview.getSettings().setJavaScriptEnabled(true);
        webview.setInitialScale(100);
        webview.setWebViewClient(new WebViewClient());

        setContentView(webview);
        webview.loadUrl("http://www.stitcher.com/podcast/entrepreneuronfirecom/entrepreneur-on-fire-tim-ferriss-other-incredible-entrepreneurs");

And in my manifest I have the activity defined like this:

    <activity
        android:name="PodcastsActivity"
        android:label="Podcasts" 
        android:hardwareAccelerated="true"/>

But it renders like this:

enter image description here

Is there an extra setting that needs to be set? Or something I am missing?

Thanks!

score 6 · Accepted Answer · edited May 23 '17 at 12:31

6

I hope you have looked at other answers. Some of the things you may try are:

1) From webview not loading correctly in application question, you may try and enable java script before loading the URL:

webview.setInitialScale(1);
webview.getSettings().setAppCacheEnabled(false);
webview.getSettings().setJavaScriptEnabled(true);

2) As per Android webview not rendering html content correctly question, if your target is higher than 2.3.3 try adding this in your manifest file.

android:hardwareAccelerated="true"

Update

3) Also check that you have following permission in manifest as direct child to <manifest> tag:

<uses-permission android:name="android.permission.INTERNET" />

Unable to load webpage using WebView in Android

4) You can try shouldOverrideUrlLoading() method as stated here.

Update 2:

As you said that it displays correctly on your browser, there is another possibility of using the above method in case when a certain link is clicked within the app, it opens the default browser. I'm not sure if you would want this but it is a possibility. Something as follows:

webview.setWebViewClient(new WebViewClient(){
    public boolean shouldOverrideUrlLoading(WebView view, String url) {
        if (url != null) {
            view.getContext().startActivity(
                new Intent(Intent.ACTION_VIEW, Uri.parse(url)));
            return true;
        } else {
            return false;
        }
    }
});

webview.loadUrl("http://www.stitcher.com/podcast/entrepreneuronfirecom/entrepreneur-on-fire-tim-ferriss-other-incredible-entrepreneurs");

Source: WebView link click open default browser

Hope this helps.

edited May 23 '17 at 12:31

Community

1
1

answered Jul 09 '13 at 02:11

Shobhit Puri

25,769
11
95
124

thank you - trying it now :) I was tinkering with enabling JS previously. – Genadinik Jul 09 '13 at 02:23
ohh. I'm sorry it didn't work. Which phone are you trying it on? – Shobhit Puri Jul 09 '13 at 02:33
Right now I am trying on the simulator. – Genadinik Jul 09 '13 at 02:34
And I target sdk version 15 and added that hardwareAccelerated line – Genadinik Jul 09 '13 at 02:34
Just tested on a physical device. The same problem. It is a 2-year old phone. But OS is new: 4.0.4 – Genadinik Jul 09 '13 at 02:45
Hmm..Interesting. I've updated the answer with few other references. See if any one of them is your case. – Shobhit Puri Jul 09 '13 at 02:49
Thanks - I did #3. Now trying #4 from your suggestions – Genadinik Jul 09 '13 at 02:52
I also found this http://www.androidaspect.com/2012/09/android-webview-tutorial.html going to be trying it..but going to sleep soon. WIll try more tomorrow. Thanks! – Genadinik Jul 09 '13 at 03:00
@Genadinik Does this load properly in a browser in the emulator? – Shobhit Puri Jul 11 '13 at 17:39
this doesn't load properly either on a device, nor in the emulator when ran from the app. But when I just open a browser on my phone and run the url, then it does work fine. – Genadinik Jul 11 '13 at 20:24
You can use browser itself to open it, if you want to. See the updated answer. – Shobhit Puri Jul 12 '13 at 04:54
this is interesting, but my requirement is that the user is kept on the app. – Genadinik Jul 12 '13 at 10:09
Would it be possible to keep the user on the app using this method? Or the browser takes over and the app is not being used? If the browser takes over, and the user gets taken outside of the app, I cannot use this approach. – Genadinik Jul 12 '13 at 10:31
Adding this line `webView.getSettings().useWideViewPort(true)`, worked for me. – Rahul Chowdhury Jan 31 '18 at 08:26

Android webview - webpage renders in a very broken way

1 Answers1