mirror of
https://github.com/vodemn/m3_lightmeter.git
synced 2024-11-24 00:10:47 +00:00
implemented animated MeteringMeasureButton
This commit is contained in:
parent
e01ab62fd8
commit
2be18d9c01
3 changed files with 89 additions and 0 deletions
|
@ -10,4 +10,8 @@ class Dimens {
|
||||||
static const double grid24 = 24;
|
static const double grid24 = 24;
|
||||||
|
|
||||||
static const double paddingM = 16;
|
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);
|
||||||
}
|
}
|
||||||
|
|
|
@ -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,
|
||||||
|
),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
25
lib/screens/metering/components/shared/filled_circle.dart
Normal file
25
lib/screens/metering/components/shared/filled_circle.dart
Normal 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),
|
||||||
|
),
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
Loading…
Reference in a new issue