title: How to maintain Webview state with BottomNavigationBar in Flutter
body: <p>I'm creating a Flutter application that uses a BottomNavigationBar to change between pages. In one of the pages, I have a Webview (I'm using the <a href="https://pub.dev/packages/webview_flutter" rel="nofollow noreferrer">plugin</a> developed by the Flutter dev team) and I can't get to keep the state of the webview when I navigate to another tab then come back. I don't know if there is a way either.</p>
  
  <p>I've tried using a PageStorageBucket and also AutomaticKeepAliveClientMixin, to no avail. I've noticed that the state of a simple ListView is kept between tabs when using PageStorageBucket, but it doesn't seem to work with a Webview.</p>
  
  <p>Here's a minimal, reproducible example:</p>
  
  <pre><code>class _MyHomePageState extends State&lt;MyHomePage&gt; {
    List&lt;Widget&gt; _pages;
    int _selectedIndex = 0;
  
    @override
    void initState() {
      super.initState();
      _pages = [
        Center(
          child: Text('HOME'),
        ),
        WebView(
          initialUrl: 'https://flutter.io',
          javascriptMode: JavascriptMode.unrestricted,
        )
      ];
    }
  
    @override
    Widget build(BuildContext context) {
      return Scaffold(
        bottomNavigationBar: BottomNavigationBar(
          items: [
            BottomNavigationBarItem(icon: Icon(Icons.home), title: Text('Home')),
            BottomNavigationBarItem(icon: Icon(Icons.web), title: Text('Web')),
          ],
          currentIndex: _selectedIndex,
          onTap: (index) {
            setState(() {
              _selectedIndex = index;
            });
          },
        ),
        body: _pages[_selectedIndex],
      );
    }
  </code></pre>
  
  <p><a href="https://imgur.com/qOm7uEa" rel="nofollow noreferrer">https://imgur.com/qOm7uEa</a></p>
  
  <p>I'd want the web to be in the same state when I go back to the Webview tab, I don't want it to reload.</p>