Flutter webview loadUrl method not working properlly

Question

I have Test page that loads data from HTML for each question of the Test. Whenever I get video as a iFrame from the HTML, I parse it to data URI and then will display that video in a WebView. I use this same page for all the questions. When I click next question I used the following code to display new video in the same webview.

webviewController.loadUrl(newUrl)

This works completely fine until I have two or more videos in the same page. When there is two or more videos in the same page. The videos in the upcoming page shows the same previous video.

Below is code how I render my Video from html.

Widget renderVideo(dom.Element iframe) {
    String initialUrl =
        Uri.dataFromString(iframe, mimeType: 'text/html')
            .toString();
    if (testBloc.webViewController != null) {
      testBloc.webViewController.loadUrl(initialUrl);
    }
    return Container(
      width: 300,
      height: 350,
      child: WebView(
        initialUrl: initialUrl,
        javascriptMode: JavascriptMode.unrestricted,
        onWebViewCreated: (WebViewController controller) {
          testBloc.webViewController = controller;
          controller.loadUrl(initialUrl);
        },
      ),
    );
  }

So everytime there is iframe this method will be called in a page. So when there is only one video in the page this will be called once. When there is two or more videos in the page, this is will be called two or more times creating as many as webviews. Whenever I encounter two or more videos in single page, the upcoming pages webview will display the same video that came in the multiple video page.

For example:

Page 1: It has one video. It will be displayed in the webview.

Page 2: If it has two or more video. It will be displayed in as many webviews.

Page 3: And then the page followed by the multi video page does not display its own video. Instead it 
displays the video of the page 2. All the upcoming pages from here also display the video of the page 2.

I could not find why this is happening and how to resolve this. Can anyone guide me here.

I am sorry If I have not explained it properly or if I have elaborated it big. Maybe reading the example might make you understand the problem clearly.

Thanks in advance.

Please Check stackoverflow.com/a/62280375/10150796 this

Nikunj Kumbhani
– Nikunj Kumbhani

2020-06-09 10:33:24 +00:00
Commented Jun 9, 2020 at 10:33 — Nikunj Kumbhani
– Nikunj Kumbhani, Commented Jun 9, 2020 at 10:33

Omatt · Accepted Answer · 2022-10-03 16:40:57Z

0

You might've need to wrap loadUrl() inside setState() to update the WebViewController's loadUrl. This should rebuild the WebView with the new URL.

setState((){
  testBloc.webViewController.loadUrl(newUrl)
});

answered Oct 3, 2022 at 16:40

Omatt

10.8k2 gold badges68 silver badges187 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Flutter webview loadUrl method not working properlly

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related