When to use keys, part 1 - stataless

main.dart

import 'package:flutter/material.dart';
import 'dart:math';

void main() { 
  runApp(new MaterialApp(home: PositionedTiles()));
  

}

class PositionedTiles extends StatefulWidget {
 @override
 State<StatefulWidget> createState() => PositionedTilesState();
}

class PositionedTilesState extends State<PositionedTiles> {
 List<Widget> tiles = [
   StatelessColorfulTile(),
   StatelessColorfulTile(),
 ];

 

 @override
 Widget build(BuildContext context) {
   return Scaffold(
     body: Row(children: tiles),
     floatingActionButton: FloatingActionButton(
         child: Icon(Icons.sentiment_very_satisfied), onPressed: swapTiles),
   );
 }

 swapTiles() {
   setState(() {
     tiles.insert(1, tiles.removeAt(0));
   });
 }
}

class StatelessColorfulTile extends StatelessWidget {
 final Color myColor = UniqueColorGenerator().getColor();
 @override
 Widget build(BuildContext context) {
   return Container(
       color: myColor, child: Padding(padding: EdgeInsets.all(70.0)));
 }
}

class UniqueColorGenerator {
  
  UniqueColorGenerator();
  var randomGenerator = Random();
  List<Color> _listColors = [
    Colors.pinkAccent,
    Colors.brown,
    Colors.green,
    Colors.purple,
    Colors.yellow
  ];
  
  Color getColor() {
    
    return _listColors[randomGenerator.nextInt(4)];
  }
}