From 2be18d9c01e0525710ed0abb609bd105b429f492 Mon Sep 17 00:00:00 2001
From: Vadim <44135514+vodemn@users.noreply.github.com>
Date: Sat, 29 Oct 2022 13:52:05 +0300
Subject: [PATCH] implemented animated `MeteringMeasureButton`

---
 lib/res/dimens.dart                           |  4 ++
 .../components/measure_button.dart            | 60 +++++++++++++++++++
 .../components/shared/filled_circle.dart      | 25 ++++++++
 3 files changed, 89 insertions(+)
 create mode 100644 lib/screens/metering/components/bottom_controls/components/measure_button.dart
 create mode 100644 lib/screens/metering/components/shared/filled_circle.dart

diff --git a/lib/res/dimens.dart b/lib/res/dimens.dart
index 6eb3607..a9ce096 100644
--- a/lib/res/dimens.dart
+++ b/lib/res/dimens.dart
@@ -10,4 +10,8 @@ class Dimens {
   static const double grid24 = 24;
 
   static const double paddingM = 16;
+
+  static const Duration durationS = Duration(milliseconds: 100);
+  static const Duration durationM = Duration(milliseconds: 200);
+  static const Duration durationL = Duration(milliseconds: 300);
 }
diff --git a/lib/screens/metering/components/bottom_controls/components/measure_button.dart b/lib/screens/metering/components/bottom_controls/components/measure_button.dart
new file mode 100644
index 0000000..7f9d90b
--- /dev/null
+++ b/lib/screens/metering/components/bottom_controls/components/measure_button.dart
@@ -0,0 +1,60 @@
+import 'package:flutter/material.dart';
+import 'package:lightmeter/res/dimens.dart';
+import 'package:lightmeter/screens/metering/components/shared/filled_circle.dart';
+
+class MeteringMeasureButton extends StatefulWidget {
+  final double size;
+  final VoidCallback onTap;
+
+  const MeteringMeasureButton({
+    required this.onTap,
+    this.size = 72,
+    super.key,
+  });
+
+  @override
+  State<MeteringMeasureButton> createState() => _MeteringMeasureButtonState();
+}
+
+class _MeteringMeasureButtonState extends State<MeteringMeasureButton> {
+  bool _isPressed = true;
+
+  @override
+  Widget build(BuildContext context) {
+    return SizedBox.fromSize(
+      size: Size.square(widget.size),
+      child: GestureDetector(
+        onTap: widget.onTap,
+        onTapDown: (_) {
+          setState(() {
+            _isPressed = true;
+          });
+        },
+        onTapUp: (_) {
+          setState(() {
+            _isPressed = false;
+          });
+        },
+        child: DecoratedBox(
+          decoration: BoxDecoration(
+            borderRadius: BorderRadius.circular(widget.size / 2),
+            border: Border.all(
+              width: Dimens.grid4,
+              color: Theme.of(context).colorScheme.onSurface,
+            ),
+          ),
+          child: Center(
+            child: AnimatedScale(
+              duration: Dimens.durationS,
+              scale: _isPressed ? 0.9 : 1.0,
+              child: FilledCircle(
+                color: Theme.of(context).colorScheme.onSurface,
+                size: widget.size - Dimens.grid16,
+              ),
+            ),
+          ),
+        ),
+      ),
+    );
+  }
+}
diff --git a/lib/screens/metering/components/shared/filled_circle.dart b/lib/screens/metering/components/shared/filled_circle.dart
new file mode 100644
index 0000000..2eb1a2e
--- /dev/null
+++ b/lib/screens/metering/components/shared/filled_circle.dart
@@ -0,0 +1,25 @@
+import 'package:flutter/material.dart';
+
+class FilledCircle extends StatelessWidget {
+  final double size;
+  final Color color;
+  final Widget? child;
+
+  const FilledCircle({
+    required this.size,
+    required this.color,
+    this.child,
+    super.key,
+  });
+
+  @override
+  Widget build(BuildContext context) {
+    return ClipRRect(
+      borderRadius: BorderRadius.circular(size / 2),
+      child: SizedBox.fromSize(
+        size: Size.square(size),
+        child: ColoredBox(color: color),
+      ),
+    );
+  }
+}