title: How to programmatically change Z-Index of widget Stack in Flutter
body: <p>As you can see in this Stack the yellow cube is at the bellow of a purple cube.</p>
  <p>when I click, I want to change the index of the yellow cube to transform it from index 0 to 1 and the purple cube from index 1 to 0, vice versa.</p>
  <p><a href="https://i.stack.imgur.com/KbGBO.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/KbGBO.png" alt="square" /></a></p>
  <p>I tried IndexedStack but it's only showing a single child from a list of children.</p>
  <pre><code>class _FlipIndex extends State&lt;FlipIndex&gt; {
  
    int currentIndex = 0;
  
    @override
    Widget build(BuildContext context) {
      return Center(
        child: GestureDetector(
          onTap: (){
            // Change Z-Index of widget
          },
          child: Stack(
            alignment: Alignment.center,
            children: [
              Transform.translate(
                offset: Offset(-30.0, 0.0),
                child: Container(
                  width: 100,
                  height: 100,
                  decoration: BoxDecoration(
                    color: Colors.yellow,
                    shape: BoxShape.rectangle,
                  ),
                ),
              ),
              Transform.translate(
                offset: Offset(30.0, 0.0),
                child: Container(
                  width: 100,
                  height: 100,
                  decoration: BoxDecoration(
                    color: Colors.purple,
                    shape: BoxShape.rectangle,
                  ),
                ),
              ),
            ],
          ),
        ),
      );
    }
  }
  </code></pre>