Flutter 网页视图

Question

I've created a list of web addresses of some websites which I want to go to on a click of their corresponding buttons in the app(1st button for 1st website, 2nd for the second one and so on...). I'm using the 'flutter-webview-plugin' which has all the properties of "Scaffold" and also a property "url". I'm not able to access those websites 'index-wise' in the "url" property(like we access the images in a list, index wise).

My code:

class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
  return MaterialApp(
    title: 'Just Another App',
    home: Home(),
    routes: {
      "/webview": (_) => WebviewScaffold(
            withJavascript: true,
            withLocalStorage: true,
            url: ,
            appBar: AppBar(
              title: Text('Browser'),
            ),
          ),
    },
    theme: ThemeData(primaryColor: Colors.black),
  );
} 
}

I haven't shared the code for the buttons as its already been done and this is the only problem left to be solved. Any help is really appreciated.

Answer 1

Declare a WebViewController like this,

WebViewController controller;

then on each button press change url,

          RaisedButton(onPressed: () {
              url = 'https://flutter.dev/docs/get-started/editor';
              setState(() {
                print(url);
                controller.loadUrl(url);
              });
            }),
            RaisedButton(onPressed: () {
              url = 'https://flutter.dev/docs/get-started/test-drive';
              setState(() {
                print(url);
                controller.loadUrl(url);
              });
            }),

Now inside webview declare your controller,

            Expanded(
              child: WebView(
                initialUrl: url,
                onWebViewCreated: (WebViewController webViewController) {
                  controller = webViewController;
                },
              ),
            ),

I have created a working example here

---

Additionally , To enable click events on WebView you have to enable javascript in your webview by adding javascriptMode: JavascriptMode.unrestricted in your code. Because,

By default, JavaScript in your WebView is disabled

For ex:

WebView(
         initialUrl: 'https://flutter.dev/',
        javascriptMode: JavascriptMode.unrestricted,
      ),