177 lines
5.2 KiB
Dart
177 lines
5.2 KiB
Dart
|
import 'package:flutter/material.dart';
|
||
|
import 'dart:math';
|
||
|
|
||
|
ThemeData blackSlider(BuildContext context) {
|
||
|
return Theme.of(context).copyWith(
|
||
|
sliderTheme: SliderThemeData(
|
||
|
rangeThumbShape:
|
||
|
const RectRangeSliderThumbShape(enabledThumbRadius: 8),
|
||
|
thumbShape: const RectSliderThumbShape(enabledThumbRadius: 8),
|
||
|
thumbColor: Colors.grey[800],
|
||
|
activeTrackColor: Colors.grey[700],
|
||
|
inactiveTrackColor: Colors.grey[400],
|
||
|
activeTickMarkColor: Colors.white,
|
||
|
inactiveTickMarkColor: Colors.white));
|
||
|
}
|
||
|
|
||
|
class RectRangeSliderThumbShape extends RangeSliderThumbShape {
|
||
|
const RectRangeSliderThumbShape({
|
||
|
this.enabledThumbRadius = 10.0,
|
||
|
this.disabledThumbRadius,
|
||
|
this.elevation = 1.0,
|
||
|
this.pressedElevation = 6.0,
|
||
|
});
|
||
|
|
||
|
final double enabledThumbRadius;
|
||
|
|
||
|
final double? disabledThumbRadius;
|
||
|
double get _disabledThumbRadius => disabledThumbRadius ?? enabledThumbRadius;
|
||
|
|
||
|
final double elevation;
|
||
|
|
||
|
final double pressedElevation;
|
||
|
|
||
|
@override
|
||
|
Size getPreferredSize(bool isEnabled, bool isDiscrete) {
|
||
|
return Size.fromRadius(
|
||
|
isEnabled == true ? enabledThumbRadius : _disabledThumbRadius);
|
||
|
}
|
||
|
|
||
|
@override
|
||
|
void paint(
|
||
|
PaintingContext context,
|
||
|
Offset center, {
|
||
|
required Animation<double> activationAnimation,
|
||
|
required Animation<double> enableAnimation,
|
||
|
bool isDiscrete = false,
|
||
|
bool isEnabled = false,
|
||
|
bool? isOnTop,
|
||
|
required SliderThemeData sliderTheme,
|
||
|
TextDirection? textDirection,
|
||
|
Thumb? thumb,
|
||
|
bool? isPressed,
|
||
|
}) {
|
||
|
assert(sliderTheme.showValueIndicator != null);
|
||
|
assert(sliderTheme.overlappingShapeStrokeColor != null);
|
||
|
|
||
|
final Canvas canvas = context.canvas;
|
||
|
final Tween<double> radiusTween = Tween<double>(
|
||
|
begin: _disabledThumbRadius,
|
||
|
end: enabledThumbRadius,
|
||
|
);
|
||
|
final ColorTween colorTween = ColorTween(
|
||
|
begin: sliderTheme.disabledThumbColor,
|
||
|
end: sliderTheme.thumbColor,
|
||
|
);
|
||
|
final double radius = radiusTween.evaluate(enableAnimation);
|
||
|
final Tween<double> elevationTween = Tween<double>(
|
||
|
begin: elevation,
|
||
|
end: pressedElevation,
|
||
|
);
|
||
|
|
||
|
if (isOnTop ?? false) {
|
||
|
final Paint strokePaint = Paint()
|
||
|
..color = sliderTheme.overlappingShapeStrokeColor!
|
||
|
..strokeWidth = 1.0
|
||
|
..style = PaintingStyle.stroke;
|
||
|
canvas.drawRect(
|
||
|
Rect.fromCenter(
|
||
|
center: center, width: 2 * radius, height: 2 * radius),
|
||
|
strokePaint);
|
||
|
}
|
||
|
|
||
|
final Color color = colorTween.evaluate(enableAnimation)!;
|
||
|
|
||
|
final double evaluatedElevation =
|
||
|
isPressed! ? elevationTween.evaluate(activationAnimation) : elevation;
|
||
|
final Path shadowPath = Path()
|
||
|
..addArc(
|
||
|
Rect.fromCenter(
|
||
|
center: center, width: 2 * radius, height: 2 * radius),
|
||
|
0,
|
||
|
pi * 2);
|
||
|
canvas.drawShadow(shadowPath, Colors.black, evaluatedElevation, true);
|
||
|
|
||
|
canvas.drawRect(
|
||
|
Rect.fromCenter(center: center, width: 2 * radius, height: 2 * radius),
|
||
|
Paint()..color = color,
|
||
|
);
|
||
|
}
|
||
|
}
|
||
|
|
||
|
class RectSliderThumbShape extends SliderComponentShape {
|
||
|
const RectSliderThumbShape({
|
||
|
this.enabledThumbRadius = 10.0,
|
||
|
this.disabledThumbRadius,
|
||
|
this.elevation = 1.0,
|
||
|
this.pressedElevation = 6.0,
|
||
|
});
|
||
|
|
||
|
final double enabledThumbRadius;
|
||
|
|
||
|
final double? disabledThumbRadius;
|
||
|
double get _disabledThumbRadius => disabledThumbRadius ?? enabledThumbRadius;
|
||
|
|
||
|
final double elevation;
|
||
|
|
||
|
final double pressedElevation;
|
||
|
|
||
|
@override
|
||
|
Size getPreferredSize(bool isEnabled, bool isDiscrete) {
|
||
|
return Size.fromRadius(
|
||
|
isEnabled == true ? enabledThumbRadius : _disabledThumbRadius);
|
||
|
}
|
||
|
|
||
|
@override
|
||
|
void paint(
|
||
|
PaintingContext context,
|
||
|
Offset center, {
|
||
|
required Animation<double> activationAnimation,
|
||
|
required Animation<double> enableAnimation,
|
||
|
required bool isDiscrete,
|
||
|
required TextPainter labelPainter,
|
||
|
required RenderBox parentBox,
|
||
|
required SliderThemeData sliderTheme,
|
||
|
required TextDirection textDirection,
|
||
|
required double value,
|
||
|
required double textScaleFactor,
|
||
|
required Size sizeWithOverflow,
|
||
|
}) {
|
||
|
assert(sliderTheme.disabledThumbColor != null);
|
||
|
assert(sliderTheme.thumbColor != null);
|
||
|
|
||
|
final Canvas canvas = context.canvas;
|
||
|
final Tween<double> radiusTween = Tween<double>(
|
||
|
begin: _disabledThumbRadius,
|
||
|
end: enabledThumbRadius,
|
||
|
);
|
||
|
final ColorTween colorTween = ColorTween(
|
||
|
begin: sliderTheme.disabledThumbColor,
|
||
|
end: sliderTheme.thumbColor,
|
||
|
);
|
||
|
|
||
|
final Color color = colorTween.evaluate(enableAnimation)!;
|
||
|
final double radius = radiusTween.evaluate(enableAnimation);
|
||
|
|
||
|
final Tween<double> elevationTween = Tween<double>(
|
||
|
begin: elevation,
|
||
|
end: pressedElevation,
|
||
|
);
|
||
|
|
||
|
final double evaluatedElevation =
|
||
|
elevationTween.evaluate(activationAnimation);
|
||
|
final Path path = Path()
|
||
|
..addArc(
|
||
|
Rect.fromCenter(
|
||
|
center: center, width: 2 * radius, height: 2 * radius),
|
||
|
0,
|
||
|
pi * 2);
|
||
|
canvas.drawShadow(path, Colors.black, evaluatedElevation, true);
|
||
|
|
||
|
canvas.drawRect(
|
||
|
Rect.fromCenter(center: center, width: 2 * radius, height: 2 * radius),
|
||
|
Paint()..color = color,
|
||
|
);
|
||
|
}
|
||
|
}
|