tropical-spray-2618 variant

main.dart

import 'package:flutter/material.dart';

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

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData.dark().copyWith(
        scaffoldBackgroundColor: darkBlue,
      ),
      home: const Scaffold(
        body: Center(
          child: MyStatefulWidget(),
        ),
      ),
    );
  }
}

class MyStatefulWidget extends StatefulWidget {
  const MyStatefulWidget({super.key});

  @override
  State<MyStatefulWidget> createState() => _MyStatefulWidgetState();
}

class _MyStatefulWidgetState extends State<MyStatefulWidget> {
  Alignment _position = Alignment.topLeft;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: SafeArea(
        child: Column(
          children: [
            Expanded(
              child: AnimatedAlign(
                duration: const Duration(seconds: 1),
                alignment: _position,
                child: Container(
                  width: 100,
                  height: 100,
                  decoration: const ShapeDecoration(
                    color: Colors.red,
                    shape: CircleBorder(),
                  ),
                ),
              ),
            ),
            Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                Flexible(
                  child: Padding(
                    padding: const EdgeInsets.all(100),
                    child: FloatingActionButton(
                      onPressed: () {
                        setState(() {
                          _position = Alignment.topLeft;
                        });
                      },
                      child: const Icon(
                        Icons.arrow_circle_left,
                        size: 24.0,
                      ),
                    ),
                  ),
                ),
                Flexible(
                  child: Padding(
                    padding: const EdgeInsets.all(100),
                    child: FloatingActionButton(
                      onPressed: () {
                        setState(() {
                          _position = Alignment.topRight;
                        });
                      },
                      child: const Icon(
                        Icons.arrow_circle_right,
                        size: 24.0,
                      ),
                    ),
                  ),
                ),
              ],
            ),
          ],
        ),
      ),
    );
  }
}