완성

keys3.dart

import 'dart:math';

import 'package:flutter/material.dart';

final Color darkBlue = Color.fromARGB(255, 18, 32, 47);

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: PositionedTiles(),
    );
  }
}

class PositionedTiles extends StatefulWidget {
  @override
  _PositionedTilesState createState() => _PositionedTilesState();
}

class _PositionedTilesState extends State<PositionedTiles> {
  List<Widget> tiles;

  @override
  void initState() {
    super.initState();
    // tiles = [
    //   StatelessColorfulTile(),
    //   StatelessColorfulTile(),
    // ];
    // tiles = [
    //   StatefulColorfulTileNoState(),
    //   StatefulColorfulTileNoState(),
    // ];
    // tiles = [
    //   StatefulColorfulTile(),
    //   StatefulColorfulTile(),
    // ];
    tiles = [
      Padding(
        padding: const EdgeInsets.all(8.0),
        key: UniqueKey(),
        child: StatefulColorfulTile(),
      ),
      Padding(
        padding: const EdgeInsets.all(8.0),
        key: UniqueKey(),
        child: StatefulColorfulTile(),
      ),
    ];
  }

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

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

Color randColor() {
  int a = Random().nextInt(255);
  int r = Random().nextInt(255);
  int g = Random().nextInt(255);
  int b = Random().nextInt(255);
  return Color.fromARGB(a, r, g, b);
}

/// key가 필요함
/// state!
class StatefulColorfulTile extends StatefulWidget {
  const StatefulColorfulTile({Key key}) : super(key: key);

  @override
  _StatefulColorfulTileState createState() => _StatefulColorfulTileState();
}

class _StatefulColorfulTileState extends State<StatefulColorfulTile> {
  /// state가 있음
  var color;

  @override
  void initState() {
    super.initState();
    color = randColor();
  }

  @override
  Widget build(BuildContext context) {
    return Center(
      child: Container(
        height: 100.0,
        width: 100.0,
        color: color,
      ),
    );
  }
}