Preserving state between tab view pages : <h3>issue</h3>

<p>I have two <code>ListViews</code> rendering inside of a <code>TabBarView</code> using a <code>TabController</code>.</p>

<p>How do I preserve state (for lack of a better word) between each <code>ListView</code> so that: 1.) the Widgets don't rebuild and 2.) the <code>ListView</code> position is remembered between tabs.</p>

<h3>relevant code</h3>

<pre><code>class AppState extends State&lt;App&gt; with SingleTickerProviderStateMixin {
  TabController _tabController;

  @override
  void initState() {
    super.initState();
    _tabController = new TabController(
      vsync: this,
      length: _allPages.length,
    );
  }

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

  Widget _buildScaffold(BuildContext context) {
    return new Scaffold(
      appBar: new AppBar(
        title: new Text('headlines'),
        bottom: new TabBar(
            controller: _tabController,
            isScrollable: true,
            tabs: _allPages
                .map((_Page page) =&gt; new Tab(text: page.country))
                .toList()),
      ),
      body: new TabBarView(
          controller: _tabController,
          children: _allPages.map((_Page page) {
            return new SafeArea(
              top: false,
              bottom: false,
              child: new Container(
                key: new ObjectKey(page.country),
                child: new Newsfeed(country: page.country),
              ),
            );
          }).toList()),
    );
  }

  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      title: 'news app',
      home: _buildScaffold(context),
    );
  }
}
</code></pre>

<h3>illustrating gif</h3>

<p><a href="https://media.giphy.com/media/2ysWhzqHVqL1xcBlBE/giphy.gif" rel="noreferrer">https://media.giphy.com/media/2ysWhzqHVqL1xcBlBE/giphy.gif</a></p>
