mirror of
https://github.com/vodemn/m3_lightmeter.git
synced 2024-11-22 07:20:39 +00:00
increased slider tappable area
This commit is contained in:
parent
d6ed053079
commit
5614ef8ef3
3 changed files with 31 additions and 30 deletions
|
@ -38,6 +38,7 @@ class Dimens {
|
||||||
// `CenteredSlider`
|
// `CenteredSlider`
|
||||||
static const double cameraSliderTrackHeight = grid4;
|
static const double cameraSliderTrackHeight = grid4;
|
||||||
static const double cameraSliderTrackRadius = cameraSliderTrackHeight / 2;
|
static const double cameraSliderTrackRadius = cameraSliderTrackHeight / 2;
|
||||||
|
static const double cameraSliderHandleArea = 32;
|
||||||
static const double cameraSliderHandleSize = 24;
|
static const double cameraSliderHandleSize = 24;
|
||||||
static const double cameraSliderHandleIconSize = cameraSliderHandleSize * 2 / 3;
|
static const double cameraSliderHandleIconSize = cameraSliderHandleSize * 2 / 3;
|
||||||
|
|
||||||
|
|
|
@ -41,12 +41,12 @@ class _CenteredSliderState extends State<CenteredSlider> {
|
||||||
@override
|
@override
|
||||||
Widget build(BuildContext context) {
|
Widget build(BuildContext context) {
|
||||||
return SizedBox(
|
return SizedBox(
|
||||||
height: widget.isVertical ? double.maxFinite : Dimens.cameraSliderHandleSize,
|
height: widget.isVertical ? double.maxFinite : Dimens.cameraSliderHandleArea,
|
||||||
width: !widget.isVertical ? double.maxFinite : Dimens.cameraSliderHandleSize,
|
width: !widget.isVertical ? double.maxFinite : Dimens.cameraSliderHandleArea,
|
||||||
child: LayoutBuilder(
|
child: LayoutBuilder(
|
||||||
builder: (context, constraints) {
|
builder: (context, constraints) {
|
||||||
final biggestSize = widget.isVertical ? constraints.maxHeight : constraints.maxWidth;
|
final biggestSize = widget.isVertical ? constraints.maxHeight : constraints.maxWidth;
|
||||||
final handleDistance = biggestSize - Dimens.cameraSliderHandleSize;
|
final handleDistance = biggestSize - Dimens.cameraSliderHandleArea;
|
||||||
return RotatedBox(
|
return RotatedBox(
|
||||||
quarterTurns: widget.isVertical ? -1 : 0,
|
quarterTurns: widget.isVertical ? -1 : 0,
|
||||||
child: GestureDetector(
|
child: GestureDetector(
|
||||||
|
@ -60,11 +60,11 @@ class _CenteredSliderState extends State<CenteredSlider> {
|
||||||
handleDistance,
|
handleDistance,
|
||||||
),
|
),
|
||||||
child: SizedBox(
|
child: SizedBox(
|
||||||
height: Dimens.cameraSliderHandleSize,
|
height: Dimens.cameraSliderHandleArea,
|
||||||
width: biggestSize,
|
width: biggestSize,
|
||||||
child: _Slider(
|
child: _Slider(
|
||||||
handleDistance: handleDistance,
|
handleDistance: handleDistance,
|
||||||
handleSize: Dimens.cameraSliderHandleSize,
|
handleSize: Dimens.cameraSliderHandleArea,
|
||||||
trackThickness: Dimens.cameraSliderTrackHeight,
|
trackThickness: Dimens.cameraSliderTrackHeight,
|
||||||
value: relativeValue,
|
value: relativeValue,
|
||||||
icon: RotatedBox(
|
icon: RotatedBox(
|
||||||
|
@ -81,12 +81,12 @@ class _CenteredSliderState extends State<CenteredSlider> {
|
||||||
}
|
}
|
||||||
|
|
||||||
void _updateHandlePosition(double offset, double handleDistance) {
|
void _updateHandlePosition(double offset, double handleDistance) {
|
||||||
if (offset <= Dimens.cameraSliderHandleSize / 2) {
|
if (offset <= Dimens.cameraSliderHandleArea / 2) {
|
||||||
relativeValue = 0;
|
relativeValue = 0;
|
||||||
} else if (offset >= handleDistance + Dimens.cameraSliderHandleSize / 2) {
|
} else if (offset >= handleDistance + Dimens.cameraSliderHandleArea / 2) {
|
||||||
relativeValue = 1;
|
relativeValue = 1;
|
||||||
} else {
|
} else {
|
||||||
relativeValue = (offset - Dimens.cameraSliderHandleSize / 2) / handleDistance;
|
relativeValue = (offset - Dimens.cameraSliderHandleArea / 2) / handleDistance;
|
||||||
}
|
}
|
||||||
setState(() {});
|
setState(() {});
|
||||||
widget.onChanged(relativeValue * (widget.max - widget.min) + widget.min);
|
widget.onChanged(relativeValue * (widget.max - widget.min) + widget.min);
|
||||||
|
@ -124,7 +124,7 @@ class _Slider extends StatelessWidget {
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
AnimatedPositioned.fromRect(
|
AnimatedPositioned.fromRect(
|
||||||
duration: Dimens.durationM,
|
duration: Dimens.durationS,
|
||||||
rect: Rect.fromCenter(
|
rect: Rect.fromCenter(
|
||||||
center: Offset(
|
center: Offset(
|
||||||
handleSize / 2 + handleDistance * value,
|
handleSize / 2 + handleDistance * value,
|
||||||
|
@ -133,15 +133,17 @@ class _Slider extends StatelessWidget {
|
||||||
width: handleSize,
|
width: handleSize,
|
||||||
height: handleSize,
|
height: handleSize,
|
||||||
),
|
),
|
||||||
child: _Handle(
|
child: Center(
|
||||||
color: Theme.of(context).colorScheme.primary,
|
child: _Handle(
|
||||||
size: handleSize,
|
color: Theme.of(context).colorScheme.primary,
|
||||||
child: IconTheme(
|
size: Dimens.cameraSliderHandleSize,
|
||||||
data: Theme.of(context).iconTheme.copyWith(
|
child: IconTheme(
|
||||||
color: Theme.of(context).colorScheme.onPrimary,
|
data: Theme.of(context).iconTheme.copyWith(
|
||||||
size: Dimens.cameraSliderHandleIconSize,
|
color: Theme.of(context).colorScheme.onPrimary,
|
||||||
),
|
size: Dimens.cameraSliderHandleIconSize,
|
||||||
child: icon,
|
),
|
||||||
|
child: icon,
|
||||||
|
),
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
|
@ -163,15 +165,15 @@ class _Handle extends StatelessWidget {
|
||||||
|
|
||||||
@override
|
@override
|
||||||
Widget build(BuildContext context) {
|
Widget build(BuildContext context) {
|
||||||
return ClipRRect(
|
return SizedBox(
|
||||||
borderRadius: BorderRadius.circular(size / 2),
|
height: size,
|
||||||
child: SizedBox(
|
width: size,
|
||||||
height: size,
|
child: DecoratedBox(
|
||||||
width: size,
|
decoration: BoxDecoration(
|
||||||
child: ColoredBox(
|
|
||||||
color: color,
|
color: color,
|
||||||
child: child,
|
shape: BoxShape.circle,
|
||||||
),
|
),
|
||||||
|
child: child,
|
||||||
),
|
),
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
|
@ -31,7 +31,7 @@ class RulerSlider extends StatelessWidget {
|
||||||
valueAdapter(value),
|
valueAdapter(value),
|
||||||
style: Theme.of(context).textTheme.labelLarge,
|
style: Theme.of(context).textTheme.labelLarge,
|
||||||
),
|
),
|
||||||
const SizedBox(height: Dimens.grid8),
|
const SizedBox(height: Dimens.grid4),
|
||||||
Expanded(
|
Expanded(
|
||||||
child: Row(
|
child: Row(
|
||||||
children: [
|
children: [
|
||||||
|
@ -51,7 +51,6 @@ class RulerSlider extends StatelessWidget {
|
||||||
],
|
],
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
const SizedBox(height: Dimens.grid4),
|
|
||||||
IconButton(
|
IconButton(
|
||||||
icon: const Icon(Icons.sync),
|
icon: const Icon(Icons.sync),
|
||||||
onPressed: value != defaultValue ? () => onChanged(defaultValue) : null,
|
onPressed: value != defaultValue ? () => onChanged(defaultValue) : null,
|
||||||
|
@ -79,7 +78,7 @@ class _Ruler extends StatelessWidget {
|
||||||
Widget build(BuildContext context) {
|
Widget build(BuildContext context) {
|
||||||
return LayoutBuilder(
|
return LayoutBuilder(
|
||||||
builder: (context, constraints) {
|
builder: (context, constraints) {
|
||||||
final bool showAllMainTicks = Dimens.cameraSliderHandleSize * mainTicksCount <= constraints.maxHeight;
|
final bool showAllMainTicks = Dimens.cameraSliderHandleArea * mainTicksCount <= constraints.maxHeight;
|
||||||
return Column(
|
return Column(
|
||||||
crossAxisAlignment: CrossAxisAlignment.end,
|
crossAxisAlignment: CrossAxisAlignment.end,
|
||||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||||
|
@ -92,7 +91,7 @@ class _Ruler extends StatelessWidget {
|
||||||
}
|
}
|
||||||
final bool showValue = (index % (showAllMainTicks ? 2 : 4) == 0.0);
|
final bool showValue = (index % (showAllMainTicks ? 2 : 4) == 0.0);
|
||||||
return SizedBox(
|
return SizedBox(
|
||||||
height: index == itemsCount - 1 || showValue ? Dimens.cameraSliderHandleSize : 1,
|
height: index == itemsCount - 1 || showValue ? Dimens.cameraSliderHandleArea : 1,
|
||||||
child: Row(
|
child: Row(
|
||||||
mainAxisAlignment: MainAxisAlignment.end,
|
mainAxisAlignment: MainAxisAlignment.end,
|
||||||
children: [
|
children: [
|
||||||
|
@ -109,7 +108,6 @@ class _Ruler extends StatelessWidget {
|
||||||
width: isMainTick ? Dimens.grid8 : Dimens.grid4,
|
width: isMainTick ? Dimens.grid8 : Dimens.grid4,
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
const SizedBox(width: Dimens.grid4),
|
|
||||||
],
|
],
|
||||||
),
|
),
|
||||||
);
|
);
|
||||||
|
|
Loading…
Reference in a new issue