Question

嘿，我正在尝试创建一个屏幕，该屏幕显示带有bottomappbar的Web视图。因此，您加载了Webview，然后点击底部应用栏中的某个项目时，另一个网站应加载到相同的Webview中...

除了最初解析的内容外，我无法弄清楚如何打开其他网站。我尝试使用《 setState》更新网址，但它仅更新应用程序栏标题，并且Webview仍显示原始网站

这是我当前的代码：

class _WebviewContainer extends State<WebviewContainer> {
var url;
final key = UniqueKey();

_WebviewContainer(this.url); 

@override
Widget build(BuildContext context) {    
return Scaffold(
  appBar: AppBar(
    title: Text(url),
    actions: <Widget>[
      IconButton(
        icon: Icon(
          Icons.home,
          size: 40.0,
          color: Colors.white,
        ),
        onPressed: () => {
          //-> Here I set the new url but the webview always shows the origin website

          setState(() {
            url = 'https://stackoverflow.com/';
          })
        },
      )
    ],
  ),
  body: Column(
    children: <Widget>[
      Expanded(
        child: WebView(
          key: key,
          javascriptMode: JavascriptMode.unrestricted,
          initialUrl: url,              
        ),
      ),          
    ],
  ),
);
}
}

我从YouTube上的一个教程中获取了代码，创建者还表示，如果url的状态发生更改，则将重新加载Webview，但不幸的是他没有显示如何操作

有人可以帮助我吗？

预先感谢杜比

Answer 1

所以我遇到了类似的情况，只是当我从下拉菜单中选择一个项目时，我希望在Web视图中加载一个新的URL。我是如何创建WebViewController的实例

的

WebViewController controller;

然后在使用onWebViewCreated参数创建Web视图时设置此控制器

child: WebView(
      key: _key,
      javascriptMode: JavascriptMode.unrestricted,
      initialUrl: url,
    onWebViewCreated: (WebViewController webViewController) {
    controller = webViewController;}

现在已经设置了控制器，您可以在setState（）中使用其loadUrl方法来更改显示的网址

setState(() {                
            controller.loadUrl(newUrl_here);

我刚开始使用Flutter，所以当然可以是更好的方法，但这对我有用

Answer 2

您还可以尝试使用我的插件flutter_inappwebview，它是Flutter插件，可让您添加内联WebView或打开应用程序内浏览器窗口，并具有许多事件，方法和选项来控制WebView。

要更新您的AppBar标题并同时打开一个新网站，您只需使用新的URL更新窗口小部件的url变量，然后调用InAppWebViewController.loadUrl(url)方法。

使用您的构建方法的完整示例：

import 'dart:async';

import 'package:flutter/material.dart';

import 'package:flutter_inappwebview/flutter_inappwebview.dart';

Future main() async {
  runApp(new MyApp());
}

class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => new _MyAppState();
}

class _MyAppState extends State<MyApp> {

  @override
  void initState() {
    super.initState();
  }

  @override
  void dispose() {
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
        home: InAppWebViewPage()
    );
  }
}

class InAppWebViewPage extends StatefulWidget {
  @override
  _InAppWebViewPageState createState() => new _InAppWebViewPageState();
}

class _InAppWebViewPageState extends State<InAppWebViewPage> {
  InAppWebViewController webView;
  String url = "https://flutter.dev/";

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
          title: Text(url),
          actions: <Widget>[
            IconButton(
              icon: Icon(
                Icons.home,
                size: 40.0,
                color: Colors.white,
              ),
              onPressed: () {
                url = "https://stackoverflow.com/";
                if (webView != null)
                  webView.loadUrl(url: url);
                setState(() { });
              },
            )
          ],
        ),
        body: Container(
            child: Column(children: <Widget>[
              Expanded(
                child: Container(
                  child: InAppWebView(
                    initialUrl: url,
                    initialHeaders: {},
                    initialOptions: InAppWebViewWidgetOptions(
                      inAppWebViewOptions: InAppWebViewOptions(
                        debuggingEnabled: true,
                      ),
                    ),
                    onWebViewCreated: (InAppWebViewController controller) {
                      webView = controller;
                    },
                    onLoadStart: (InAppWebViewController controller, String url) {

                    },
                    onLoadStop: (InAppWebViewController controller, String url) {
                    },
                  ),
                ),
              ),
            ]))
    );
  }
}

Flutter：webview_flutter更新同一webview小部件中的URL

2 个答案: