implemented animated MeteringMeasureButton

This commit is contained in:
Vadim 2022-10-29 13:52:05 +03:00
parent e01ab62fd8
commit 2be18d9c01
3 changed files with 89 additions and 0 deletions

View file

@ -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);
}

View file

@ -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,
),
),
),
),
),
);
}
}

View file

@ -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),
),
);
}
}