Webview not loading when inflated

Question

I am working on an app with a navigation drawer that can show several screens. These pages are all shown within the same Activity though by inflating them into a wrapper.

<android.support.design.widget.CoordinatorLayout 
    //some parameters 

    <include
        android:id="@+id/main_container"
        layout="@layout/content_main" />

</android.support.design.widget.CoordinatorLayout>

One of these screens contains a WebView.

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout 
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/webview_container"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:layout_behavior="@string/appbar_scrolling_view_behavior"
    tools:context=".MainActivity"
    tools:showIn="@layout/app_bar_main">


    <WebView
        android:id="@+id/web_view"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />
</android.support.constraint.ConstraintLayout>

To the Webview I attach a WebViewClient to handle some html manipulation with Javascript.

WebView webView = findViewById(R.id.web_view);
if (webView == null) {
    inflateLayout(R.layout.layout_with_webview);
    webView = findViewById(R.id.web_view);
}
webView.getSettings().setJavaScriptEnabled(true);
webView.setWebViewClient(new CustomWebViewClient());
webView.loadUrl("http://www.somesite.com");

If I put the WebView into the layout that is loaded with setContentView() when the activity starts everything loads correctly. After that I inflate a different Layout into the main_container using the following code:

public void inflateLayout(int toinflate) {
    ConstraintLayout mainLayout = findViewById(R.id.main_container);
    LayoutInflater inflater = (LayoutInflater) getSystemService(Context.LAYOUT_INFLATER_SERVICE);
    View layout = inflater.inflate(toinflate, null);
    mainLayout.removeAllViews();
    mainLayout.addView(layout);
    DrawerLayout drawer = findViewById(R.id.drawer_layout);
    drawer.closeDrawer(GravityCompat.START);
}

When I now want to inflate a Layout containing a WebView nothing is shown when I call webView.loadUrl("some url") eventhough the onPageFinished(...)method is being called.

Now the question is: what am I doing wrong and how can I use WebViews that are attached to the Screen using inflation.

Also: I already tried adding the WebView using addView and it did not work.

You are not providing the constraints in webview tag. Try adding the constraints and then check — Mushahid Gillani, Apr 27 '18 at 09:28
Adding the constraints did not change anything. Also If I put the WebView in the default layout it renders without any problems — Rittel, Apr 27 '18 at 09:34
@MushahidGillani it's a good idea, but I guess, it should work without it as we'll due to being an only child having match parent but read my answer as well — Pavneet_Singh, Apr 27 '18 at 09:34
r u sure that your `webView` is null here `(webView == null)` ?check it — Pavneet_Singh, Apr 27 '18 at 10:00
It is null everytime the webview is not currently displayed (that means when i am showing a different layout) — Rittel, Apr 27 '18 at 10:27

Pavneet_Singh · Accepted Answer · 2018-04-27T12:16:19.307

2

You need to reinitialise the new inflated layout references

public void inflateLayout(int toinflate) {
    ConstraintLayout mainLayout = findViewById(R.id.main_container);
    LayoutInflater inflater = (LayoutInflater) getSystemService(Context.LAYOUT_INFLATER_SERVICE);
    View layout = inflater.inflate(toinflate, null);
    mainLayout.removeAllViews();
    mainLayout.addView(layout);

   // you need to reinitialise the web view which will refer to 
   // the web view in newly inflated layout as
   webView = findViewById(R.id.web_view);
   webView.getSettings().setJavaScriptEnabled(true);
   webView.setWebViewClient(new CustomWebViewClient());

    DrawerLayout drawer = findViewById(R.id.drawer_layout);
    drawer.closeDrawer(GravityCompat.START);
}

because the new related view has no link with the existing layout of the activity hence the web view is loading normally but will have no effect on screen

Inflation is expensive so the efficient option is Fragments

Update : : The inflated layout must have appropriate layout param according to the constraint layout so use

View layout = inflater.inflate(toinflate, mainLayout);

edited Apr 27 '18 at 12:16

answered Apr 27 '18 at 09:21

Pavneet_Singh

36,884
5
53
68

My provided method works with all layouts except with the one containing the webview though. Adding the setContentView() did not work and it just kept showing a blank screen. I considered using Fragments, I wanted to try solving it this way first though. – Rittel Apr 27 '18 at 09:37
I already call those lines after I called inflateLayout(). I forgot to add the corresponding lines in the question and changed them now (cut a few too many lines when copying) – Rittel Apr 27 '18 at 09:51
no it is still wrong, Kindly pay attention to updated code – Pavneet_Singh Apr 27 '18 at 09:52
My code reflects your code's functionality. I cannot add the webView = findViewById(R.id.web_view); into the inflateLayout() method as I also inflate other layout in there. That is why I am setting the WebViewClient after the inflateLayout method is finished. The webview is null everytime i expect it to be null. – Rittel Apr 27 '18 at 10:59
can you simply try this `WebView webView = null; inflateLayout(R.layout.layout_with_webview); webView = findViewById(R.id.web_view); webView.getSettings().setJavaScriptEnabled(true); webView.setWebViewClient(new CustomWebViewClient());` – Pavneet_Singh Apr 27 '18 at 11:03

score -1 · Answer 2 · answered Apr 27 '18 at 10:31

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout 
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/webview_container"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:layout_behavior="@string/appbar_scrolling_view_behavior"
    tools:context=".MainActivity"
    tools:showIn="@layout/app_bar_main">


    <WebView
        android:id="@+id/web_view"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />
</android.support.constraint.ConstraintLayout>

The parent layout is ConstraintLayout while the child component i.e webView is not really having valid properties. Check this layout in preview first are you able to see your webview in it? if not try these-

<WebView
      android:id="@+id/web_view"
      android:layout_width="match_parent"
      android:layout_height="match_parent"
      app:layout_constraintLeft_toLeftOf="parent"
      app:layout_constraintRight_toRightOf="parent"
      app:layout_constraintTop_toTopOf="parent"
      app:layout_constraintBottom_toBottomOf="parent"/>

Adding those constraints did not help sorry. – Rittel Apr 27 '18 at 11:01 — Rittel, Apr 27 '18 at 11:01

Webview not loading when inflated

2 Answers2