title: Can't get simple app with two ListView in one Column work
body: <p>I am trying to write app with two <code>ListView</code>s. The idea is simple. At start we have <code>n</code>-element in first <code>ListView</code>, and by clicking elements we move elements to second.
  Something like this:
  <a href="https://i.stack.imgur.com/IM6Tp.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/IM6Tp.png" alt="enter image description here" /></a></p>
  <p>To get:
  <a href="https://i.stack.imgur.com/ILMWv.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/ILMWv.png" alt="enter image description here" /></a></p>
  <p>To simplified code I created two global variable lists (green and blue). But I faced with problem that I do not understanding how to call <code>setState()</code> from Stateless widgets. And I am not sure that I should change color boxes to something else.</p>
  <p>Should I do all widgets statefull? How to trigger update in <code>ListView</code>?</p>
  <p>I created copy-paste example:</p>
  <pre><code>import 'dart:convert';
  
  import 'package:flutter/material.dart';
  
  void main() {
    runApp(MyApp());
  }
  
  List blueList = [1,2,3,4,5,6,7,8];
  List greenList = [];
  
  
  class MyApp extends StatelessWidget {
    @override
    Widget build(BuildContext context) {
      return GetMaterialApp(
        debugShowCheckedModeBanner: false,
        home: HomeView(),
        themeMode: ThemeMode.system,
      );
    }
  }
  
  
  class HomeView extends StatelessWidget {
    @override 
    Widget build(BuildContext context) {
      return Scaffold( 
            appBar: AppBar(title: Text(&quot;Demo App&quot;),),
            body: SafeArea( 
  
              child: Column(children: [
                WidgetOne(),
                WidgetTwo(),
              ],)
              
              ),
  
    );
  
    }
  }
  
  class _WidgetOneState extends StatelessWidget {
    @override
    Widget build(BuildContext context) {
      return Expanded(child: ListView.builder(
              // shrinkWrap: true,
            itemBuilder: (ctx, idx) =&gt;
                WidgetBlue(blueList[idx]), 
            itemCount: blueList.length));
    }
  }
  
  class WidgetOne extends _WidgetOneState {
    @override
    _WidgetOneState createState() =&gt; _WidgetOneState();
  }
  
  
  class _WidgetTwoState extends StatelessWidget {
    @override
    Widget build(BuildContext context) {
      return Expanded(child: ListView.builder(
              // shrinkWrap: true,
            itemBuilder: (ctx, idx) =&gt;
                WidgetGreen(greenList[idx]), 
            itemCount: greenList.length));
  
    }
  }
  
  class WidgetTwo extends _WidgetOneState {
    @override
    _WidgetTwoState createState() =&gt; _WidgetTwoState();
  }
  
  
  class WidgetBlue extends StatelessWidget {
    int index;
    WidgetBlue(this.index);
    @override
    Widget build(BuildContext context) {
      return InkWell(
        child: Center(
          child: Container(
            color: Colors.blue,
            height: 50,
            width: 90,
            child: Text(&quot;$index&quot;),
          ),
  
        ),
        onTap: () { 
          blueList.removeLast();
        },
      );
    }
  
   }
  
  
  class WidgetGreen extends StatelessWidget {
    int index;
    WidgetGreen(this.index);
    @override
    Widget build(BuildContext context) {
      return InkWell(
        child: Center(
          child: Container(
            color: Colors.green,
            height: 50,
            width: 90,
            child: Text(&quot;$index&quot;),
          ),
  
        ),
        onTap: () { 
          // do not do nothing
        },
      );
    }
  
   }
  </code></pre>