slider_theme.dart 130 KB
Newer Older
Ian Hickson's avatar
Ian Hickson committed
1
// Copyright 2014 The Flutter Authors. All rights reserved.
2 3 4 5
// Use of this source code is governed by a BSD-style license that can be
// found in the LICENSE file.

import 'dart:math' as math;
6
import 'dart:ui' show Path, lerpDouble;
7 8 9 10 11

import 'package:flutter/foundation.dart';
import 'package:flutter/rendering.dart';
import 'package:flutter/widgets.dart';

12
import 'colors.dart';
13 14
import 'theme.dart';

15 16 17 18 19 20 21 22 23 24 25 26
/// Applies a slider theme to descendant [Slider] widgets.
///
/// A slider theme describes the colors and shape choices of the slider
/// components.
///
/// Descendant widgets obtain the current theme's [SliderThemeData] object using
/// [SliderTheme.of]. When a widget uses [SliderTheme.of], it is automatically
/// rebuilt if the theme later changes.
///
/// The slider is as big as the largest of
/// the [SliderComponentShape.getPreferredSize] of the thumb shape,
/// the [SliderComponentShape.getPreferredSize] of the overlay shape,
27
/// and the [SliderTickMarkShape.getPreferredSize] of the tick mark shape.
28 29 30 31 32
///
/// See also:
///
///  * [SliderThemeData], which describes the actual configuration of a slider
///    theme.
33
/// {@template flutter.material.SliderTheme.sliderComponentShape}
34 35 36 37
///  * [SliderComponentShape], which can be used to create custom shapes for
///    the [Slider]'s thumb, overlay, and value indicator and the
///    [RangeSlider]'s overlay.
/// {@endtemplate}
38
/// {@template flutter.material.SliderTheme.sliderTrackShape}
39 40 41
///  * [SliderTrackShape], which can be used to create custom shapes for the
///    [Slider]'s track.
/// {@endtemplate}
42
/// {@template flutter.material.SliderTheme.sliderTickMarkShape}
43 44 45
///  * [SliderTickMarkShape], which can be used to create custom shapes for the
///    [Slider]'s tick marks.
/// {@endtemplate}
46
/// {@template flutter.material.SliderTheme.rangeSliderThumbShape}
47 48 49
///  * [RangeSliderThumbShape], which can be used to create custom shapes for
///    the [RangeSlider]'s thumb.
/// {@endtemplate}
50
/// {@template flutter.material.SliderTheme.rangeSliderValueIndicatorShape}
51 52 53
///  * [RangeSliderValueIndicatorShape], which can be used to create custom
///    shapes for the [RangeSlider]'s value indicator.
/// {@endtemplate}
54
/// {@template flutter.material.SliderTheme.rangeSliderTrackShape}
55 56 57
///  * [RangeSliderTrackShape], which can be used to create custom shapes for
///    the [RangeSlider]'s track.
/// {@endtemplate}
58
/// {@template flutter.material.SliderTheme.rangeSliderTickMarkShape}
59 60 61
///  * [RangeSliderTickMarkShape], which can be used to create custom shapes for
///    the [RangeSlider]'s tick marks.
/// {@endtemplate}
62
class SliderTheme extends InheritedTheme {
63 64 65 66
  /// Applies the given theme [data] to [child].
  ///
  /// The [data] and [child] arguments must not be null.
  const SliderTheme({
67 68 69
    Key? key,
    required this.data,
    required Widget child,
70 71 72
  }) : assert(child != null),
       assert(data != null),
       super(key: key, child: child);
73 74 75 76 77 78 79 80 81 82

  /// Specifies the color and shape values for descendant slider widgets.
  final SliderThemeData data;

  /// Returns the data from the closest [SliderTheme] instance that encloses
  /// the given context.
  ///
  /// Defaults to the ambient [ThemeData.sliderTheme] if there is no
  /// [SliderTheme] in the given build context.
  ///
83
  /// {@tool snippet}
84 85
  ///
  /// ```dart
86
  /// class Launch extends StatefulWidget {
87 88
  ///   const Launch({Key? key}) : super(key: key);
  ///
89
  ///   @override
90
  ///   State createState() => LaunchState();
91
  /// }
92
  ///
93
  /// class LaunchState extends State<Launch> {
94
  ///   double _rocketThrust = 0;
95
  ///
96 97
  ///   @override
  ///   Widget build(BuildContext context) {
98
  ///     return SliderTheme(
99
  ///       data: SliderTheme.of(context).copyWith(activeTrackColor: const Color(0xff804040)),
100
  ///       child: Slider(
101 102 103 104 105
  ///         onChanged: (double value) { setState(() { _rocketThrust = value; }); },
  ///         value: _rocketThrust,
  ///       ),
  ///     );
  ///   }
106 107
  /// }
  /// ```
108
  /// {@end-tool}
109 110 111 112 113 114
  ///
  /// See also:
  ///
  ///  * [SliderThemeData], which describes the actual configuration of a slider
  ///    theme.
  static SliderThemeData of(BuildContext context) {
115
    final SliderTheme? inheritedTheme = context.dependOnInheritedWidgetOfExactType<SliderTheme>();
116
    return inheritedTheme != null ? inheritedTheme.data : Theme.of(context).sliderTheme;
117 118
  }

119 120
  @override
  Widget wrap(BuildContext context, Widget child) {
121
    return SliderTheme(data: data, child: child);
122 123
  }

124
  @override
125
  bool updateShouldNotify(SliderTheme oldWidget) => data != oldWidget.data;
126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151
}

/// Describes the conditions under which the value indicator on a [Slider]
/// will be shown. Used with [SliderThemeData.showValueIndicator].
///
/// See also:
///
///  * [Slider], a Material Design slider widget.
///  * [SliderThemeData], which describes the actual configuration of a slider
///    theme.
enum ShowValueIndicator {
  /// The value indicator will only be shown for discrete sliders (sliders
  /// where [Slider.divisions] is non-null).
  onlyForDiscrete,

  /// The value indicator will only be shown for continuous sliders (sliders
  /// where [Slider.divisions] is null).
  onlyForContinuous,

  /// The value indicator will be shown for all types of sliders.
  always,

  /// The value indicator will never be shown.
  never,
}

152 153 154 155 156 157 158 159 160 161 162 163 164 165 166
/// Identifier for a thumb.
///
/// There are 2 thumbs in a [RangeSlider], [start] and [end].
///
/// For [TextDirection.ltr], the [start] thumb is the left-most thumb and the
/// [end] thumb is the right-most thumb. For [TextDirection.rtl] the [start]
/// thumb is the right-most thumb, and the [end] thumb is the left-most thumb.
enum Thumb {
  /// Left-most thumb for [TextDirection.ltr], otherwise, right-most thumb.
  start,

  /// Right-most thumb for [TextDirection.ltr], otherwise, left-most thumb.
  end,
}

167 168 169 170 171 172 173 174
/// Holds the color, shape, and typography values for a material design slider
/// theme.
///
/// Use this class to configure a [SliderTheme] widget, or to set the
/// [ThemeData.sliderTheme] for a [Theme] widget.
///
/// To obtain the current ambient slider theme, use [SliderTheme.of].
///
175 176 177 178 179 180 181 182
/// This theme is for both the [Slider] and the [RangeSlider]. The properties
/// that are only for the [Slider] are: [tickMarkShape], [thumbShape],
/// [trackShape], and [valueIndicatorShape]. The properties that are only for
/// the [RangeSlider] are [rangeTickMarkShape], [rangeThumbShape],
/// [rangeTrackShape], [rangeValueIndicatorShape],
/// [overlappingShapeStrokeColor], [minThumbSeparation], and [thumbSelector].
/// All other properties are used by both the [Slider] and the [RangeSlider].
///
183 184 185 186
/// The parts of a slider are:
///
///  * The "thumb", which is a shape that slides horizontally when the user
///    drags it.
187
///  * The "track", which is the line that the slider thumb slides along.
188 189 190 191 192 193 194 195
///  * The "tick marks", which are regularly spaced marks that are drawn when
///    using discrete divisions.
///  * The "value indicator", which appears when the user is dragging the thumb
///    to indicate the value being selected.
///  * The "overlay", which appears around the thumb, and is shown when the
///    thumb is pressed, focused, or hovered. It is painted underneath the
///    thumb, so it must extend beyond the bounds of the thumb itself to
///    actually be visible.
196 197 198 199 200 201 202
///  * The "active" side of the slider is the side between the thumb and the
///    minimum value.
///  * The "inactive" side of the slider is the side between the thumb and the
///    maximum value.
///  * The [Slider] is disabled when it is not accepting user input. See
///    [Slider] for details on when this happens.
///
203 204 205 206
/// The thumb, track, tick marks, value indicator, and overlay can be customized
/// by creating subclasses of [SliderTrackShape],
/// [SliderComponentShape], and/or [SliderTickMarkShape]. See
/// [RoundSliderThumbShape], [RectangularSliderTrackShape],
207
/// [RoundSliderTickMarkShape], [RectangularSliderValueIndicatorShape], and
208
/// [RoundSliderOverlayShape] for examples.
209
///
210 211 212 213 214 215 216 217 218 219
/// The track painting can be skipped by specifying 0 for [trackHeight].
/// The thumb painting can be skipped by specifying
/// [SliderComponentShape.noThumb] for [SliderThemeData.thumbShape].
/// The overlay painting can be skipped by specifying
/// [SliderComponentShape.noOverlay] for [SliderThemeData.overlayShape].
/// The tick mark painting can be skipped by specifying
/// [SliderTickMarkShape.noTickMark] for [SliderThemeData.tickMarkShape].
/// The value indicator painting can be skipped by specifying the
/// appropriate [ShowValueIndicator] for [SliderThemeData.showValueIndicator].
///
220 221 222 223 224 225 226
/// See also:
///
///  * [SliderTheme] widget, which can override the slider theme of its
///    children.
///  * [Theme] widget, which performs a similar function to [SliderTheme],
///    but for overall themes.
///  * [ThemeData], which has a default [SliderThemeData].
227 228 229 230 231 232 233
/// {@macro flutter.material.SliderTheme.sliderComponentShape}
/// {@macro flutter.material.SliderTheme.sliderTrackShape}
/// {@macro flutter.material.SliderTheme.sliderTickMarkShape}
/// {@macro flutter.material.SliderTheme.rangeSliderThumbShape}
/// {@macro flutter.material.SliderTheme.rangeSliderValueIndicatorShape}
/// {@macro flutter.material.SliderTheme.rangeSliderTrackShape}
/// {@macro flutter.material.SliderTheme.rangeSliderTickMarkShape}
234
@immutable
235
class SliderThemeData with Diagnosticable {
236
  /// Create a [SliderThemeData] given a set of exact values.
237 238 239 240 241 242
  ///
  /// This will rarely be used directly. It is used by [lerp] to
  /// create intermediate themes based on two themes.
  ///
  /// The simplest way to create a SliderThemeData is to use
  /// [copyWith] on the one you get from [SliderTheme.of], or create an
243 244
  /// entirely new one with [SliderThemeData.fromPrimaryColors].
  ///
245
  /// {@tool snippet}
246 247 248
  ///
  /// ```dart
  /// class Blissful extends StatefulWidget {
249 250
  ///   const Blissful({Key? key}) : super(key: key);
  ///
251
  ///   @override
252
  ///   State createState() => BlissfulState();
253 254 255
  /// }
  ///
  /// class BlissfulState extends State<Blissful> {
256
  ///   double _bliss = 0;
257 258 259
  ///
  ///   @override
  ///   Widget build(BuildContext context) {
260
  ///     return SliderTheme(
261
  ///       data: SliderTheme.of(context).copyWith(activeTrackColor: const Color(0xff404080)),
262
  ///       child: Slider(
263 264 265 266 267 268 269
  ///         onChanged: (double value) { setState(() { _bliss = value; }); },
  ///         value: _bliss,
  ///       ),
  ///     );
  ///   }
  /// }
  /// ```
270
  /// {@end-tool}
271
  const SliderThemeData({
272 273 274 275 276 277 278 279 280 281
    this.trackHeight,
    this.activeTrackColor,
    this.inactiveTrackColor,
    this.disabledActiveTrackColor,
    this.disabledInactiveTrackColor,
    this.activeTickMarkColor,
    this.inactiveTickMarkColor,
    this.disabledActiveTickMarkColor,
    this.disabledInactiveTickMarkColor,
    this.thumbColor,
282
    this.overlappingShapeStrokeColor,
283 284 285
    this.disabledThumbColor,
    this.overlayColor,
    this.valueIndicatorColor,
286
    this.overlayShape,
287 288
    this.tickMarkShape,
    this.thumbShape,
289
    this.trackShape,
290
    this.valueIndicatorShape,
291 292 293 294
    this.rangeTickMarkShape,
    this.rangeThumbShape,
    this.rangeTrackShape,
    this.rangeValueIndicatorShape,
295 296
    this.showValueIndicator,
    this.valueIndicatorTextStyle,
297 298
    this.minThumbSeparation,
    this.thumbSelector,
299
  });
300 301 302 303 304 305 306 307 308 309

  /// Generates a SliderThemeData from three main colors.
  ///
  /// Usually these are the primary, dark and light colors from
  /// a [ThemeData].
  ///
  /// The opacities of these colors will be overridden with the Material Design
  /// defaults when assigning them to the slider theme component colors.
  ///
  /// This is used to generate the default slider theme for a [ThemeData].
310
  factory SliderThemeData.fromPrimaryColors({
311 312 313 314
    required Color primaryColor,
    required Color primaryColorDark,
    required Color primaryColorLight,
    required TextStyle valueIndicatorTextStyle,
315 316 317 318
  }) {
    assert(primaryColor != null);
    assert(primaryColorDark != null);
    assert(primaryColorLight != null);
319
    assert(valueIndicatorTextStyle != null);
320 321 322

    // These are Material Design defaults, and are used to derive
    // component Colors (with opacity) from base colors.
323 324 325 326
    const int activeTrackAlpha = 0xff;
    const int inactiveTrackAlpha = 0x3d; // 24% opacity
    const int disabledActiveTrackAlpha = 0x52; // 32% opacity
    const int disabledInactiveTrackAlpha = 0x1f; // 12% opacity
327 328 329 330 331 332
    const int activeTickMarkAlpha = 0x8a; // 54% opacity
    const int inactiveTickMarkAlpha = 0x8a; // 54% opacity
    const int disabledActiveTickMarkAlpha = 0x1f; // 12% opacity
    const int disabledInactiveTickMarkAlpha = 0x1f; // 12% opacity
    const int thumbAlpha = 0xff;
    const int disabledThumbAlpha = 0x52; // 32% opacity
333
    const int overlayAlpha = 0x1f; // 12% opacity
334 335
    const int valueIndicatorAlpha = 0xff;

336
    return SliderThemeData(
337
      trackHeight: 2.0,
338 339 340 341
      activeTrackColor: primaryColor.withAlpha(activeTrackAlpha),
      inactiveTrackColor: primaryColor.withAlpha(inactiveTrackAlpha),
      disabledActiveTrackColor: primaryColorDark.withAlpha(disabledActiveTrackAlpha),
      disabledInactiveTrackColor: primaryColorDark.withAlpha(disabledInactiveTrackAlpha),
342 343 344 345 346
      activeTickMarkColor: primaryColorLight.withAlpha(activeTickMarkAlpha),
      inactiveTickMarkColor: primaryColor.withAlpha(inactiveTickMarkAlpha),
      disabledActiveTickMarkColor: primaryColorLight.withAlpha(disabledActiveTickMarkAlpha),
      disabledInactiveTickMarkColor: primaryColorDark.withAlpha(disabledInactiveTickMarkAlpha),
      thumbColor: primaryColor.withAlpha(thumbAlpha),
347
      overlappingShapeStrokeColor: Colors.white,
348
      disabledThumbColor: primaryColorDark.withAlpha(disabledThumbAlpha),
349
      overlayColor: primaryColor.withAlpha(overlayAlpha),
350
      valueIndicatorColor: primaryColor.withAlpha(valueIndicatorAlpha),
351
      overlayShape: const RoundSliderOverlayShape(),
352
      tickMarkShape: const RoundSliderTickMarkShape(),
353
      thumbShape: const RoundSliderThumbShape(),
354
      trackShape: const RoundedRectSliderTrackShape(),
355
      valueIndicatorShape: const PaddleSliderValueIndicatorShape(),
356 357 358 359
      rangeTickMarkShape: const RoundRangeSliderTickMarkShape(),
      rangeThumbShape: const RoundRangeSliderThumbShape(),
      rangeTrackShape: const RoundedRectRangeSliderTrackShape(),
      rangeValueIndicatorShape: const PaddleRangeSliderValueIndicatorShape(),
360
      valueIndicatorTextStyle: valueIndicatorTextStyle,
361 362 363 364
      showValueIndicator: ShowValueIndicator.onlyForDiscrete,
    );
  }

365
  /// The height of the [Slider] track.
366
  final double? trackHeight;
367

368
  /// The color of the [Slider] track between the [Slider.min] position and the
369
  /// current thumb position.
370
  final Color? activeTrackColor;
371

372
  /// The color of the [Slider] track between the current thumb position and the
373
  /// [Slider.max] position.
374
  final Color? inactiveTrackColor;
375

376
  /// The color of the [Slider] track between the [Slider.min] position and the
377
  /// current thumb position when the [Slider] is disabled.
378
  final Color? disabledActiveTrackColor;
379

380
  /// The color of the [Slider] track between the current thumb position and the
381
  /// [Slider.max] position when the [Slider] is disabled.
382
  final Color? disabledInactiveTrackColor;
383

384
  /// The color of the track's tick marks that are drawn between the [Slider.min]
385
  /// position and the current thumb position.
386
  final Color? activeTickMarkColor;
387

388
  /// The color of the track's tick marks that are drawn between the current
389
  /// thumb position and the [Slider.max] position.
390
  final Color? inactiveTickMarkColor;
391

392
  /// The color of the track's tick marks that are drawn between the [Slider.min]
393
  /// position and the current thumb position when the [Slider] is disabled.
394
  final Color? disabledActiveTickMarkColor;
395

396
  /// The color of the track's tick marks that are drawn between the current
397 398
  /// thumb position and the [Slider.max] position when the [Slider] is
  /// disabled.
399
  final Color? disabledInactiveTickMarkColor;
400 401

  /// The color given to the [thumbShape] to draw itself with.
402
  final Color? thumbColor;
403

404 405 406
  /// The color given to the perimeter of the top [rangeThumbShape] when the
  /// thumbs are overlapping and the top [rangeValueIndicatorShape] when the
  /// value indicators are overlapping.
407
  final Color? overlappingShapeStrokeColor;
408

409 410
  /// The color given to the [thumbShape] to draw itself with when the
  /// [Slider] is disabled.
411
  final Color? disabledThumbColor;
412

413 414
  /// The color of the overlay drawn around the slider thumb when it is
  /// pressed, focused, or hovered.
415 416
  ///
  /// This is typically a semi-transparent color.
417
  final Color? overlayColor;
418 419

  /// The color given to the [valueIndicatorShape] to draw itself with.
420
  final Color? valueIndicatorColor;
421

422

423
  /// The shape that will be used to draw the [Slider]'s overlay.
424
  ///
425 426
  /// Both the [overlayColor] and a non default [overlayShape] may be specified.
  /// The default [overlayShape] refers to the [overlayColor].
427
  ///
428
  /// The default value is [RoundSliderOverlayShape].
429
  final SliderComponentShape? overlayShape;
430 431 432 433 434 435 436 437 438

  /// The shape that will be used to draw the [Slider]'s tick marks.
  ///
  /// The [SliderTickMarkShape.getPreferredSize] is used to help determine the
  /// location of each tick mark on the track. The slider's minimum size will
  /// be at least this big.
  ///
  /// The default value is [RoundSliderTickMarkShape].
  ///
439
  /// See also:
440
  ///
Shi-Hao Hong's avatar
Shi-Hao Hong committed
441
  ///  * [RoundRangeSliderTickMarkShape], which is the default tick mark
442
  ///    shape for the range slider.
443
  final SliderTickMarkShape? tickMarkShape;
444 445

  /// The shape that will be used to draw the [Slider]'s thumb.
446 447 448 449 450
  ///
  /// The default value is [RoundSliderThumbShape].
  ///
  /// See also:
  ///
Shi-Hao Hong's avatar
Shi-Hao Hong committed
451
  ///  * [RoundRangeSliderThumbShape], which is the default thumb shape for
452
  ///    the [RangeSlider].
453
  final SliderComponentShape? thumbShape;
454

455 456 457 458 459 460 461 462 463 464 465
  /// The shape that will be used to draw the [Slider]'s track.
  ///
  /// The [SliderTrackShape.getPreferredRect] method is used to map
  /// slider-relative gesture coordinates to the correct thumb position on the
  /// track. It is also used to horizontally position tick marks, when the
  /// slider is discrete.
  ///
  /// The default value is [RoundedRectSliderTrackShape].
  ///
  /// See also:
  ///
Shi-Hao Hong's avatar
Shi-Hao Hong committed
466
  ///  * [RoundedRectRangeSliderTrackShape], which is the default track
467
  ///    shape for the [RangeSlider].
468
  final SliderTrackShape? trackShape;
469

470
  /// The shape that will be used to draw the [Slider]'s value
471
  /// indicator.
472 473 474 475 476
  ///
  /// The default value is [PaddleSliderValueIndicatorShape].
  ///
  /// See also:
  ///
Shi-Hao Hong's avatar
Shi-Hao Hong committed
477
  ///  * [PaddleRangeSliderValueIndicatorShape], which is the default value
478
  ///    indicator shape for the [RangeSlider].
479
  final SliderComponentShape? valueIndicatorShape;
480

481 482 483 484 485 486 487 488 489 490
  /// The shape that will be used to draw the [RangeSlider]'s tick marks.
  ///
  /// The [RangeSliderTickMarkShape.getPreferredSize] is used to help determine
  /// the location of each tick mark on the track. The slider's minimum size
  /// will be at least this big.
  ///
  /// The default value is [RoundRangeSliderTickMarkShape].
  ///
  /// See also:
  ///
Shi-Hao Hong's avatar
Shi-Hao Hong committed
491
  ///  * [RoundSliderTickMarkShape], which is the default tick mark shape
492
  ///    for the [Slider].
493
  final RangeSliderTickMarkShape? rangeTickMarkShape;
494 495 496 497 498 499 500 501 502 503 504

  /// The shape that will be used for the [RangeSlider]'s thumbs.
  ///
  /// By default the same shape is used for both thumbs, but strokes the top
  /// thumb when it overlaps the bottom thumb. The top thumb is always the last
  /// selected thumb.
  ///
  /// The default value is [RoundRangeSliderThumbShape].
  ///
  /// See also:
  ///
Shi-Hao Hong's avatar
Shi-Hao Hong committed
505
  ///  * [RoundSliderThumbShape], which is the default thumb shape for the
506
  ///    [Slider].
507
  final RangeSliderThumbShape? rangeThumbShape;
508 509 510

  /// The shape that will be used to draw the [RangeSlider]'s track.
  ///
511
  /// The [SliderTrackShape.getPreferredRect] method is used to map
512 513 514 515 516 517 518 519
  /// slider-relative gesture coordinates to the correct thumb position on the
  /// track. It is also used to horizontally position the tick marks, when the
  /// slider is discrete.
  ///
  /// The default value is [RoundedRectRangeSliderTrackShape].
  ///
  /// See also:
  ///
Shi-Hao Hong's avatar
Shi-Hao Hong committed
520
  ///  * [RoundedRectSliderTrackShape], which is the default track
521
  ///    shape for the [Slider].
522
  final RangeSliderTrackShape? rangeTrackShape;
523 524 525 526 527 528 529 530 531 532 533 534

  /// The shape that will be used for the [RangeSlider]'s value indicators.
  ///
  /// The default shape uses the same value indicator for each thumb, but
  /// strokes the top value indicator when it overlaps the bottom value
  /// indicator. The top indicator corresponds to the top thumb, which is always
  /// the most recently selected thumb.
  ///
  /// The default value is [PaddleRangeSliderValueIndicatorShape].
  ///
  /// See also:
  ///
Shi-Hao Hong's avatar
Shi-Hao Hong committed
535
  ///  * [PaddleSliderValueIndicatorShape], which is the default value
536
  ///    indicator shape for the [Slider].
537
  final RangeSliderValueIndicatorShape? rangeValueIndicatorShape;
538

539 540
  /// Whether the value indicator should be shown for different types of
  /// sliders.
541 542 543 544
  ///
  /// By default, [showValueIndicator] is set to
  /// [ShowValueIndicator.onlyForDiscrete]. The value indicator is only shown
  /// when the thumb is being touched.
545
  final ShowValueIndicator? showValueIndicator;
546

547
  /// The text style for the text on the value indicator.
548
  final TextStyle? valueIndicatorTextStyle;
549

550 551 552 553 554
  /// Limits the thumb's separation distance.
  ///
  /// Use this only if you want to control the visual appearance of the thumbs
  /// in terms of a logical pixel value. This can be done when you want a
  /// specific look for thumbs when they are close together. To limit with the
555
  /// real values, rather than logical pixels, the values can be restricted by
556
  /// the parent.
557
  final double? minThumbSeparation;
558 559 560 561 562 563 564 565 566 567

  /// Determines which thumb should be selected when the slider is interacted
  /// with.
  ///
  /// If null, the default thumb selector finds the closest thumb, excluding
  /// taps that are between the thumbs and not within any one touch target.
  /// When the selection is within the touch target bounds of both thumbs, no
  /// thumb is selected until the selection is moved.
  ///
  /// Override this for custom thumb selection.
568
  final RangeThumbSelector? thumbSelector;
569

570 571
  /// Creates a copy of this object but with the given fields replaced with the
  /// new values.
572
  SliderThemeData copyWith({
573 574 575 576 577 578 579 580 581 582 583 584 585 586 587 588 589 590 591 592 593 594 595 596 597 598 599
    double? trackHeight,
    Color? activeTrackColor,
    Color? inactiveTrackColor,
    Color? disabledActiveTrackColor,
    Color? disabledInactiveTrackColor,
    Color? activeTickMarkColor,
    Color? inactiveTickMarkColor,
    Color? disabledActiveTickMarkColor,
    Color? disabledInactiveTickMarkColor,
    Color? thumbColor,
    Color? overlappingShapeStrokeColor,
    Color? disabledThumbColor,
    Color? overlayColor,
    Color? valueIndicatorColor,
    SliderComponentShape? overlayShape,
    SliderTickMarkShape? tickMarkShape,
    SliderComponentShape? thumbShape,
    SliderTrackShape? trackShape,
    SliderComponentShape? valueIndicatorShape,
    RangeSliderTickMarkShape? rangeTickMarkShape,
    RangeSliderThumbShape? rangeThumbShape,
    RangeSliderTrackShape? rangeTrackShape,
    RangeSliderValueIndicatorShape? rangeValueIndicatorShape,
    ShowValueIndicator? showValueIndicator,
    TextStyle? valueIndicatorTextStyle,
    double? minThumbSeparation,
    RangeThumbSelector? thumbSelector,
600
  }) {
601
    return SliderThemeData(
602
      trackHeight: trackHeight ?? this.trackHeight,
603 604 605 606
      activeTrackColor: activeTrackColor ?? this.activeTrackColor,
      inactiveTrackColor: inactiveTrackColor ?? this.inactiveTrackColor,
      disabledActiveTrackColor: disabledActiveTrackColor ?? this.disabledActiveTrackColor,
      disabledInactiveTrackColor: disabledInactiveTrackColor ?? this.disabledInactiveTrackColor,
607 608 609
      activeTickMarkColor: activeTickMarkColor ?? this.activeTickMarkColor,
      inactiveTickMarkColor: inactiveTickMarkColor ?? this.inactiveTickMarkColor,
      disabledActiveTickMarkColor: disabledActiveTickMarkColor ?? this.disabledActiveTickMarkColor,
610
      disabledInactiveTickMarkColor: disabledInactiveTickMarkColor ?? this.disabledInactiveTickMarkColor,
611
      thumbColor: thumbColor ?? this.thumbColor,
612
      overlappingShapeStrokeColor: overlappingShapeStrokeColor ?? this.overlappingShapeStrokeColor,
613 614 615
      disabledThumbColor: disabledThumbColor ?? this.disabledThumbColor,
      overlayColor: overlayColor ?? this.overlayColor,
      valueIndicatorColor: valueIndicatorColor ?? this.valueIndicatorColor,
616
      overlayShape: overlayShape ?? this.overlayShape,
617
      tickMarkShape: tickMarkShape ?? this.tickMarkShape,
618
      thumbShape: thumbShape ?? this.thumbShape,
619
      trackShape: trackShape ?? this.trackShape,
620
      valueIndicatorShape: valueIndicatorShape ?? this.valueIndicatorShape,
621 622 623 624
      rangeTickMarkShape: rangeTickMarkShape ?? this.rangeTickMarkShape,
      rangeThumbShape: rangeThumbShape ?? this.rangeThumbShape,
      rangeTrackShape: rangeTrackShape ?? this.rangeTrackShape,
      rangeValueIndicatorShape: rangeValueIndicatorShape ?? this.rangeValueIndicatorShape,
625
      showValueIndicator: showValueIndicator ?? this.showValueIndicator,
626
      valueIndicatorTextStyle: valueIndicatorTextStyle ?? this.valueIndicatorTextStyle,
627 628
      minThumbSeparation: minThumbSeparation ?? this.minThumbSeparation,
      thumbSelector: thumbSelector ?? this.thumbSelector,
629 630 631 632 633 634 635
    );
  }

  /// Linearly interpolate between two slider themes.
  ///
  /// The arguments must not be null.
  ///
636
  /// {@macro dart.ui.shadow.lerp}
637 638 639 640
  static SliderThemeData lerp(SliderThemeData a, SliderThemeData b, double t) {
    assert(a != null);
    assert(b != null);
    assert(t != null);
641
    return SliderThemeData(
642
      trackHeight: lerpDouble(a.trackHeight, b.trackHeight, t),
643 644 645 646
      activeTrackColor: Color.lerp(a.activeTrackColor, b.activeTrackColor, t),
      inactiveTrackColor: Color.lerp(a.inactiveTrackColor, b.inactiveTrackColor, t),
      disabledActiveTrackColor: Color.lerp(a.disabledActiveTrackColor, b.disabledActiveTrackColor, t),
      disabledInactiveTrackColor: Color.lerp(a.disabledInactiveTrackColor, b.disabledInactiveTrackColor, t),
647 648
      activeTickMarkColor: Color.lerp(a.activeTickMarkColor, b.activeTickMarkColor, t),
      inactiveTickMarkColor: Color.lerp(a.inactiveTickMarkColor, b.inactiveTickMarkColor, t),
649 650
      disabledActiveTickMarkColor: Color.lerp(a.disabledActiveTickMarkColor, b.disabledActiveTickMarkColor, t),
      disabledInactiveTickMarkColor: Color.lerp(a.disabledInactiveTickMarkColor, b.disabledInactiveTickMarkColor, t),
651
      thumbColor: Color.lerp(a.thumbColor, b.thumbColor, t),
652
      overlappingShapeStrokeColor: Color.lerp(a.overlappingShapeStrokeColor, b.overlappingShapeStrokeColor, t),
653 654 655
      disabledThumbColor: Color.lerp(a.disabledThumbColor, b.disabledThumbColor, t),
      overlayColor: Color.lerp(a.overlayColor, b.overlayColor, t),
      valueIndicatorColor: Color.lerp(a.valueIndicatorColor, b.valueIndicatorColor, t),
656
      overlayShape: t < 0.5 ? a.overlayShape : b.overlayShape,
657
      tickMarkShape: t < 0.5 ? a.tickMarkShape : b.tickMarkShape,
658
      thumbShape: t < 0.5 ? a.thumbShape : b.thumbShape,
659
      trackShape: t < 0.5 ? a.trackShape : b.trackShape,
660
      valueIndicatorShape: t < 0.5 ? a.valueIndicatorShape : b.valueIndicatorShape,
661 662 663 664
      rangeTickMarkShape: t < 0.5 ? a.rangeTickMarkShape : b.rangeTickMarkShape,
      rangeThumbShape: t < 0.5 ? a.rangeThumbShape : b.rangeThumbShape,
      rangeTrackShape: t < 0.5 ? a.rangeTrackShape : b.rangeTrackShape,
      rangeValueIndicatorShape: t < 0.5 ? a.rangeValueIndicatorShape : b.rangeValueIndicatorShape,
665
      showValueIndicator: t < 0.5 ? a.showValueIndicator : b.showValueIndicator,
666
      valueIndicatorTextStyle: TextStyle.lerp(a.valueIndicatorTextStyle, b.valueIndicatorTextStyle, t),
667 668
      minThumbSeparation: lerpDouble(a.minThumbSeparation, b.minThumbSeparation, t),
      thumbSelector: t < 0.5 ? a.thumbSelector : b.thumbSelector,
669 670 671 672 673
    );
  }

  @override
  int get hashCode {
674
    return hashList(<Object?>[
675
      trackHeight,
676 677 678 679
      activeTrackColor,
      inactiveTrackColor,
      disabledActiveTrackColor,
      disabledInactiveTrackColor,
680 681 682 683 684
      activeTickMarkColor,
      inactiveTickMarkColor,
      disabledActiveTickMarkColor,
      disabledInactiveTickMarkColor,
      thumbColor,
685
      overlappingShapeStrokeColor,
686 687 688
      disabledThumbColor,
      overlayColor,
      valueIndicatorColor,
689
      overlayShape,
690
      tickMarkShape,
691
      thumbShape,
692
      trackShape,
693
      valueIndicatorShape,
694 695 696 697
      rangeTickMarkShape,
      rangeThumbShape,
      rangeTrackShape,
      rangeValueIndicatorShape,
698
      showValueIndicator,
699
      valueIndicatorTextStyle,
700 701 702
      minThumbSeparation,
      thumbSelector,
    ]);
703 704 705 706
  }

  @override
  bool operator ==(Object other) {
707 708 709
    if (identical(this, other)) {
      return true;
    }
710 711 712
    if (other.runtimeType != runtimeType) {
      return false;
    }
713 714 715 716 717 718 719 720 721 722 723 724 725 726 727 728 729 730 731 732 733 734 735 736 737 738 739 740
    return other is SliderThemeData
        && other.trackHeight == trackHeight
        && other.activeTrackColor == activeTrackColor
        && other.inactiveTrackColor == inactiveTrackColor
        && other.disabledActiveTrackColor == disabledActiveTrackColor
        && other.disabledInactiveTrackColor == disabledInactiveTrackColor
        && other.activeTickMarkColor == activeTickMarkColor
        && other.inactiveTickMarkColor == inactiveTickMarkColor
        && other.disabledActiveTickMarkColor == disabledActiveTickMarkColor
        && other.disabledInactiveTickMarkColor == disabledInactiveTickMarkColor
        && other.thumbColor == thumbColor
        && other.overlappingShapeStrokeColor == overlappingShapeStrokeColor
        && other.disabledThumbColor == disabledThumbColor
        && other.overlayColor == overlayColor
        && other.valueIndicatorColor == valueIndicatorColor
        && other.overlayShape == overlayShape
        && other.tickMarkShape == tickMarkShape
        && other.thumbShape == thumbShape
        && other.trackShape == trackShape
        && other.valueIndicatorShape == valueIndicatorShape
        && other.rangeTickMarkShape == rangeTickMarkShape
        && other.rangeThumbShape == rangeThumbShape
        && other.rangeTrackShape == rangeTrackShape
        && other.rangeValueIndicatorShape == rangeValueIndicatorShape
        && other.showValueIndicator == showValueIndicator
        && other.valueIndicatorTextStyle == valueIndicatorTextStyle
        && other.minThumbSeparation == minThumbSeparation
        && other.thumbSelector == thumbSelector;
741 742 743
  }

  @override
744 745
  void debugFillProperties(DiagnosticPropertiesBuilder properties) {
    super.debugFillProperties(properties);
746
    const SliderThemeData defaultData = SliderThemeData();
747
    properties.add(DoubleProperty('trackHeight', trackHeight, defaultValue: defaultData.trackHeight));
748 749 750 751 752 753 754 755 756 757 758 759 760
    properties.add(ColorProperty('activeTrackColor', activeTrackColor, defaultValue: defaultData.activeTrackColor));
    properties.add(ColorProperty('inactiveTrackColor', inactiveTrackColor, defaultValue: defaultData.inactiveTrackColor));
    properties.add(ColorProperty('disabledActiveTrackColor', disabledActiveTrackColor, defaultValue: defaultData.disabledActiveTrackColor));
    properties.add(ColorProperty('disabledInactiveTrackColor', disabledInactiveTrackColor, defaultValue: defaultData.disabledInactiveTrackColor));
    properties.add(ColorProperty('activeTickMarkColor', activeTickMarkColor, defaultValue: defaultData.activeTickMarkColor));
    properties.add(ColorProperty('inactiveTickMarkColor', inactiveTickMarkColor, defaultValue: defaultData.inactiveTickMarkColor));
    properties.add(ColorProperty('disabledActiveTickMarkColor', disabledActiveTickMarkColor, defaultValue: defaultData.disabledActiveTickMarkColor));
    properties.add(ColorProperty('disabledInactiveTickMarkColor', disabledInactiveTickMarkColor, defaultValue: defaultData.disabledInactiveTickMarkColor));
    properties.add(ColorProperty('thumbColor', thumbColor, defaultValue: defaultData.thumbColor));
    properties.add(ColorProperty('overlappingShapeStrokeColor', overlappingShapeStrokeColor, defaultValue: defaultData.overlappingShapeStrokeColor));
    properties.add(ColorProperty('disabledThumbColor', disabledThumbColor, defaultValue: defaultData.disabledThumbColor));
    properties.add(ColorProperty('overlayColor', overlayColor, defaultValue: defaultData.overlayColor));
    properties.add(ColorProperty('valueIndicatorColor', valueIndicatorColor, defaultValue: defaultData.valueIndicatorColor));
761 762 763 764 765 766 767 768 769
    properties.add(DiagnosticsProperty<SliderComponentShape>('overlayShape', overlayShape, defaultValue: defaultData.overlayShape));
    properties.add(DiagnosticsProperty<SliderTickMarkShape>('tickMarkShape', tickMarkShape, defaultValue: defaultData.tickMarkShape));
    properties.add(DiagnosticsProperty<SliderComponentShape>('thumbShape', thumbShape, defaultValue: defaultData.thumbShape));
    properties.add(DiagnosticsProperty<SliderTrackShape>('trackShape', trackShape, defaultValue: defaultData.trackShape));
    properties.add(DiagnosticsProperty<SliderComponentShape>('valueIndicatorShape', valueIndicatorShape, defaultValue: defaultData.valueIndicatorShape));
    properties.add(DiagnosticsProperty<RangeSliderTickMarkShape>('rangeTickMarkShape', rangeTickMarkShape, defaultValue: defaultData.rangeTickMarkShape));
    properties.add(DiagnosticsProperty<RangeSliderThumbShape>('rangeThumbShape', rangeThumbShape, defaultValue: defaultData.rangeThumbShape));
    properties.add(DiagnosticsProperty<RangeSliderTrackShape>('rangeTrackShape', rangeTrackShape, defaultValue: defaultData.rangeTrackShape));
    properties.add(DiagnosticsProperty<RangeSliderValueIndicatorShape>('rangeValueIndicatorShape', rangeValueIndicatorShape, defaultValue: defaultData.rangeValueIndicatorShape));
770 771
    properties.add(EnumProperty<ShowValueIndicator>('showValueIndicator', showValueIndicator, defaultValue: defaultData.showValueIndicator));
    properties.add(DiagnosticsProperty<TextStyle>('valueIndicatorTextStyle', valueIndicatorTextStyle, defaultValue: defaultData.valueIndicatorTextStyle));
772
    properties.add(DoubleProperty('minThumbSeparation', minThumbSeparation, defaultValue: defaultData.minThumbSeparation));
773
    properties.add(DiagnosticsProperty<RangeThumbSelector>('thumbSelector', thumbSelector, defaultValue: defaultData.thumbSelector));
774 775 776
  }
}

777
/// Base class for slider thumb, thumb overlay, and value indicator shapes.
778
///
779
/// Create a subclass of this if you would like a custom shape.
780
///
781 782 783 784 785 786 787 788
/// All shapes are painted to the same canvas and ordering is important.
/// The overlay is painted first, then the value indicator, then the thumb.
///
/// The thumb painting can be skipped by specifying [noThumb] for
/// [SliderThemeData.thumbShape].
///
/// The overlay painting can be skipped by specifying [noOverlay] for
/// [SliderThemeData.overlayShape].
789 790 791
///
/// See also:
///
792 793 794
///  * [RoundSliderThumbShape], which is the default [Slider]'s thumb shape that
///    paints a solid circle.
///  * [RoundSliderOverlayShape], which is the default [Slider] and
795
///    [RangeSlider]'s overlay shape that paints a transparent circle.
796 797
///  * [PaddleSliderValueIndicatorShape], which is the default [Slider]'s value
///    indicator shape that paints a custom path with text in it.
798 799
abstract class SliderComponentShape {
  /// This abstract const constructor enables subclasses to provide
800
  /// const constructors so that they can be used in const expressions.
801
  const SliderComponentShape();
802

803 804 805 806
  /// Returns the preferred size of the shape, based on the given conditions.
  Size getPreferredSize(bool isEnabled, bool isDiscrete);

  /// Paints the shape, taking into account the state passed to it.
807
  ///
808
  /// {@template flutter.material.SliderComponentShape.paint.context}
809 810 811
  /// The `context` argument is the same as the one that includes the [Slider]'s
  /// render box.
  /// {@endtemplate}
812
  ///
813
  /// {@template flutter.material.SliderComponentShape.paint.center}
814 815 816
  /// The `center` argument is the offset for where this shape's center should be
  /// painted. This offset is relative to the origin of the [context] canvas.
  /// {@endtemplate}
817
  ///
818 819
  /// The `activationAnimation` argument is an animation triggered when the user
  /// begins to interact with the slider. It reverses when the user stops interacting
820
  /// with the slider.
821
  ///
822
  /// {@template flutter.material.SliderComponentShape.paint.enableAnimation}
823
  /// The `enableAnimation` argument is an animation triggered when the [Slider]
824 825 826
  /// is enabled, and it reverses when the slider is disabled. The [Slider] is
  /// enabled when [Slider.onChanged] is not null.Use this to paint intermediate
  /// frames for this shape when the slider changes enabled state.
827
  /// {@endtemplate}
828
  ///
829
  /// {@template flutter.material.SliderComponentShape.paint.isDiscrete}
830 831 832
  /// The `isDiscrete` argument is true if [Slider.divisions] is non-null. When
  /// true, the slider will render tick marks on top of the track.
  /// {@endtemplate}
833
  ///
834 835 836 837
  /// If the `labelPainter` argument is non-null, then [TextPainter.paint]
  /// should be called on the `labelPainter` with the location that the label
  /// should appear. If the `labelPainter` argument is null, then no label was
  /// supplied to the [Slider].
838
  ///
839
  /// {@template flutter.material.SliderComponentShape.paint.parentBox}
840 841 842
  /// The `parentBox` argument is the [RenderBox] of the [Slider]. Its attributes,
  /// such as size, can be used to assist in painting this shape.
  /// {@endtemplate}
843
  ///
844
  /// {@template flutter.material.SliderComponentShape.paint.sliderTheme}
845 846 847
  /// the `sliderTheme` argument is the theme assigned to the [Slider] that this
  /// shape belongs to.
  /// {@endtemplate}
848
  ///
849 850 851
  /// The `textDirection` argument can be used to determine how any extra text
  /// or graphics (besides the text painted by the `labelPainter`) should be
  /// positioned. The `labelPainter` already has the [textDirection] set.
852
  ///
853 854
  /// The `value` argument is the current parametric value (from 0.0 to 1.0) of
  /// the slider.
855
  ///
856
  /// {@template flutter.material.SliderComponentShape.paint.textScaleFactor}
857 858 859 860
  /// The `textScaleFactor` argument can be used to determine whether the
  /// component should paint larger or smaller, depending on whether
  /// [textScaleFactor] is greater than 1 for larger, and between 0 and 1 for
  /// smaller. It usually comes from [MediaQueryData.textScaleFactor].
861 862
  /// {@endtemplate}
  ///
863
  /// {@template flutter.material.SliderComponentShape.paint.sizeWithOverflow}
864 865 866 867 868
  /// The `sizeWithOverflow` argument can be used to determine the bounds the
  /// drawing of the components that are outside of the regular slider bounds.
  /// It's the size of the box, whose center is aligned with the slider's
  /// bounds, that the value indicators must be drawn within. Typically, it is
  /// bigger than the slider.
869
  /// {@endtemplate}
870 871
  void paint(
    PaintingContext context,
872
    Offset center, {
873 874
    required Animation<double> activationAnimation,
    required Animation<double> enableAnimation,
875
    required bool isDiscrete,
876 877 878 879 880
    required TextPainter labelPainter,
    required RenderBox parentBox,
    required SliderThemeData sliderTheme,
    required TextDirection textDirection,
    required double value,
881 882
    required double textScaleFactor,
    required Size sizeWithOverflow,
883
  });
884 885 886 887 888 889 890 891 892 893 894 895 896 897 898 899

  /// Special instance of [SliderComponentShape] to skip the thumb drawing.
  ///
  /// See also:
  ///
  ///  * [SliderThemeData.thumbShape], which is the shape that the [Slider]
  ///    uses when painting the thumb.
  static final SliderComponentShape noThumb = _EmptySliderComponentShape();

  /// Special instance of [SliderComponentShape] to skip the overlay drawing.
  ///
  /// See also:
  ///
  ///  * [SliderThemeData.overlayShape], which is the shape that the [Slider]
  ///    uses when painting the overlay.
  static final SliderComponentShape noOverlay = _EmptySliderComponentShape();
900 901
}

902
/// Base class for [Slider] tick mark shapes.
903
///
904
/// Create a subclass of this if you would like a custom slider tick mark shape.
905
///
906 907 908
/// The tick mark painting can be skipped by specifying [noTickMark] for
/// [SliderThemeData.tickMarkShape].
///
909 910
/// See also:
///
911 912
///  * [RoundSliderTickMarkShape], which is the default [Slider]'s tick mark
///    shape that paints a solid circle.
913 914
/// {@macro flutter.material.SliderTheme.sliderTrackShape}
/// {@macro flutter.material.SliderTheme.sliderComponentShape}
915
abstract class SliderTickMarkShape {
916
  /// This abstract const constructor enables subclasses to provide
917 918 919 920 921 922 923
  /// const constructors so that they can be used in const expressions.
  const SliderTickMarkShape();

  /// Returns the preferred size of the shape.
  ///
  /// It is used to help position the tick marks within the slider.
  ///
924
  /// {@macro flutter.material.SliderComponentShape.paint.sliderTheme}
925
  ///
926
  /// {@template flutter.material.SliderTickMarkShape.getPreferredSize.isEnabled}
927 928
  /// The `isEnabled` argument is false when [Slider.onChanged] is null and true
  /// otherwise. When true, the slider will respond to input.
929
  /// {@endtemplate}
930
  Size getPreferredSize({
931
    required SliderThemeData sliderTheme,
932
    required bool isEnabled,
933 934 935 936
  });

  /// Paints the slider track.
  ///
937
  /// {@macro flutter.material.SliderComponentShape.paint.context}
938
  ///
939
  /// {@macro flutter.material.SliderComponentShape.paint.center}
940
  ///
941
  /// {@macro flutter.material.SliderComponentShape.paint.parentBox}
942
  ///
943
  /// {@macro flutter.material.SliderComponentShape.paint.sliderTheme}
944
  ///
945
  /// {@macro flutter.material.SliderComponentShape.paint.enableAnimation}
946
  ///
947
  /// {@macro flutter.material.SliderTickMarkShape.getPreferredSize.isEnabled}
948
  ///
949 950 951 952 953 954 955
  /// The `textDirection` argument can be used to determine how the tick marks
  /// are painting depending on whether they are on an active track segment or
  /// not. The track segment between the start of the slider and the thumb is
  /// the active track segment. The track segment between the thumb and the end
  /// of the slider is the inactive track segment. In LTR text direction, the
  /// start of the slider is on the left, and in RTL text direction, the start
  /// of the slider is on the right.
956 957 958
  void paint(
    PaintingContext context,
    Offset center, {
959 960 961 962
    required RenderBox parentBox,
    required SliderThemeData sliderTheme,
    required Animation<double> enableAnimation,
    required Offset thumbCenter,
963
    required bool isEnabled,
964
    required TextDirection textDirection,
965
  });
966 967 968 969 970

  /// Special instance of [SliderTickMarkShape] to skip the tick mark painting.
  ///
  /// See also:
  ///
971 972
  ///  * [SliderThemeData.tickMarkShape], which is the shape that the [Slider]
  ///    uses when painting tick marks.
973 974 975
  static final SliderTickMarkShape noTickMark = _EmptySliderTickMarkShape();
}

976
/// Base class for slider track shapes.
977
///
978 979 980 981 982 983 984 985 986
/// The slider's thumb moves along the track. A discrete slider's tick marks
/// are drawn after the track, but before the thumb, and are aligned with the
/// track.
///
/// The [getPreferredRect] helps position the slider thumb and tick marks
/// relative to the track.
///
/// See also:
///
987 988
///  * [RoundedRectSliderTrackShape] for the default [Slider]'s track shape that
///    paints a stadium-like track.
989 990
/// {@macro flutter.material.SliderTheme.sliderTickMarkShape}
/// {@macro flutter.material.SliderTheme.sliderComponentShape}
991 992 993 994 995 996 997 998 999 1000
abstract class SliderTrackShape {
  /// This abstract const constructor enables subclasses to provide
  /// const constructors so that they can be used in const expressions.
  const SliderTrackShape();

  /// Returns the preferred bounds of the shape.
  ///
  /// It is used to provide horizontal boundaries for the thumb's position, and
  /// to help position the slider thumb and tick marks relative to the track.
  ///
1001
  /// The `parentBox` argument can be used to help determine the preferredRect relative to
1002 1003
  /// attributes of the render box of the slider itself, such as size.
  ///
1004
  /// The `offset` argument is relative to the caller's bounding box. It can be used to
1005 1006
  /// convert gesture coordinates from global to slider-relative coordinates.
  ///
1007
  /// {@macro flutter.material.SliderComponentShape.paint.sliderTheme}
1008
  ///
1009
  /// {@macro flutter.material.SliderTickMarkShape.getPreferredSize.isEnabled}
1010
  ///
1011
  /// {@macro flutter.material.SliderComponentShape.paint.isDiscrete}
1012
  Rect getPreferredRect({
1013
    required RenderBox parentBox,
1014
    Offset offset = Offset.zero,
1015
    required SliderThemeData sliderTheme,
1016
    bool isEnabled,
1017 1018
    bool isDiscrete,
  });
1019

1020 1021
  /// Paints the track shape based on the state passed to it.
  ///
1022
  /// {@macro flutter.material.SliderComponentShape.paint.context}
1023
  ///
1024 1025 1026
  /// The `offset` argument the offset of the origin of the `parentBox` to the
  /// origin of its `context` canvas. This shape must be painted relative to
  /// this offset. See [PaintingContextCallback].
1027
  ///
1028
  /// {@macro flutter.material.SliderComponentShape.paint.parentBox}
1029
  ///
1030
  /// {@macro flutter.material.SliderComponentShape.paint.sliderTheme}
1031
  ///
1032
  /// {@macro flutter.material.SliderComponentShape.paint.enableAnimation}
1033
  ///
1034 1035 1036
  /// The `thumbCenter` argument is the offset of the center of the thumb
  /// relative to the origin of the [PaintingContext.canvas]. It can be used as
  /// the point that divides the track into 2 segments.
1037
  ///
1038
  /// {@macro flutter.material.SliderTickMarkShape.getPreferredSize.isEnabled}
1039
  ///
1040
  /// {@macro flutter.material.SliderComponentShape.paint.isDiscrete}
1041
  ///
1042 1043
  /// The `textDirection` argument can be used to determine how the track
  /// segments are painted depending on whether they are active or not.
1044
  ///
1045
  /// {@template flutter.material.SliderTrackShape.paint.trackSegment}
1046 1047 1048 1049 1050 1051
  /// The track segment between the start of the slider and the thumb is the
  /// active track segment. The track segment between the thumb and the end of the
  /// slider is the inactive track segment. In [TextDirection.ltr], the start of
  /// the slider is on the left, and in [TextDirection.rtl], the start of the
  /// slider is on the right.
  /// {@endtemplate}
1052 1053
  void paint(
    PaintingContext context,
1054
    Offset offset, {
1055 1056 1057 1058
    required RenderBox parentBox,
    required SliderThemeData sliderTheme,
    required Animation<double> enableAnimation,
    required Offset thumbCenter,
1059
    bool isEnabled,
1060
    bool isDiscrete,
1061
    required TextDirection textDirection,
1062
  });
1063 1064
}

1065
/// Base class for [RangeSlider] thumb shapes.
1066
///
1067 1068
/// See also:
///
1069 1070
///  * [RoundRangeSliderThumbShape] for the default [RangeSlider]'s thumb shape
///    that paints a solid circle.
1071 1072 1073 1074
/// {@macro flutter.material.SliderTheme.rangeSliderTickMarkShape}
/// {@macro flutter.material.SliderTheme.rangeSliderTrackShape}
/// {@macro flutter.material.SliderTheme.rangeSliderValueIndicatorShape}
/// {@macro flutter.material.SliderTheme.sliderComponentShape}
1075 1076
abstract class RangeSliderThumbShape {
  /// This abstract const constructor enables subclasses to provide
1077
  /// const constructors so that they can be used in const expressions.
1078
  const RangeSliderThumbShape();
1079 1080

  /// Returns the preferred size of the shape, based on the given conditions.
1081
  ///
1082
  /// {@template flutter.material.RangeSliderThumbShape.getPreferredSize.isDiscrete}
1083 1084 1085
  /// The `isDiscrete` argument is true if [RangeSlider.divisions] is non-null.
  /// When true, the slider will render tick marks on top of the track.
  /// {@endtemplate}
1086
  ///
1087
  /// {@template flutter.material.RangeSliderThumbShape.getPreferredSize.isEnabled}
1088 1089
  /// The `isEnabled` argument is false when [RangeSlider.onChanged] is null and
  /// true otherwise. When true, the slider will respond to input.
1090
  /// {@endtemplate}
1091 1092
  Size getPreferredSize(bool isEnabled, bool isDiscrete);

1093
  /// Paints the thumb shape based on the state passed to it.
1094
  ///
1095
  /// {@template flutter.material.RangeSliderThumbShape.paint.context}
1096 1097
  /// The `context` argument represents the [RangeSlider]'s render box.
  /// {@endtemplate}
1098
  ///
1099
  /// {@macro flutter.material.SliderComponentShape.paint.center}
1100
  ///
1101
  /// {@template flutter.material.RangeSliderThumbShape.paint.activationAnimation}
1102 1103 1104 1105
  /// The `activationAnimation` argument is an animation triggered when the user
  /// begins to interact with the [RangeSlider]. It reverses when the user stops
  /// interacting with the slider.
  /// {@endtemplate}
1106
  ///
1107
  /// {@template flutter.material.RangeSliderThumbShape.paint.enableAnimation}
1108
  /// The `enableAnimation` argument is an animation triggered when the
1109 1110 1111 1112
  /// [RangeSlider] is enabled, and it reverses when the slider is disabled. The
  /// [RangeSlider] is enabled when [RangeSlider.onChanged] is not null. Use
  /// this to paint intermediate frames for this shape when the slider changes
  /// enabled state.
1113
  /// {@endtemplate}
1114
  ///
1115
  /// {@macro flutter.material.RangeSliderThumbShape.getPreferredSize.isDiscrete}
1116
  ///
1117
  /// {@macro flutter.material.RangeSliderThumbShape.getPreferredSize.isEnabled}
1118
  ///
1119 1120 1121
  /// If the `isOnTop` argument is true, this thumb is painted on top of the
  /// other slider thumb because this thumb is the one that was most recently
  /// selected.
1122
  ///
1123
  /// {@template flutter.material.RangeSliderThumbShape.paint.sliderTheme}
1124 1125 1126
  /// The `sliderTheme` argument is the theme assigned to the [RangeSlider] that
  /// this shape belongs to.
  /// {@endtemplate}
1127
  ///
1128 1129 1130
  /// The `textDirection` argument can be used to determine how the orientation
  /// of either slider thumb should be changed, such as drawing different
  /// shapes for the left and right thumb.
1131
  ///
1132
  /// {@template flutter.material.RangeSliderThumbShape.paint.thumb}
1133 1134 1135
  /// The `thumb` argument is the specifier for which of the two thumbs this
  /// method should paint (start or end).
  /// {@endtemplate}
1136
  ///
1137 1138 1139
  /// The `isPressed` argument can be used to give the selected thumb
  /// additional selected or pressed state visual feedback, such as a larger
  /// shadow.
1140 1141 1142
  void paint(
    PaintingContext context,
    Offset center, {
1143 1144
    required Animation<double> activationAnimation,
    required Animation<double> enableAnimation,
1145 1146 1147
    bool isDiscrete,
    bool isEnabled,
    bool isOnTop,
1148
    TextDirection textDirection,
1149
    required SliderThemeData sliderTheme,
1150
    Thumb thumb,
1151
    bool isPressed,
1152 1153 1154 1155 1156 1157 1158
  });
}

/// Base class for [RangeSlider] value indicator shapes.
///
/// See also:
///
1159 1160
///  * [PaddleRangeSliderValueIndicatorShape] for the default [RangeSlider]'s
///    value indicator shape that paints a custom path with text in it.
1161 1162 1163 1164
/// {@macro flutter.material.SliderTheme.rangeSliderTickMarkShape}
/// {@macro flutter.material.SliderTheme.rangeSliderThumbShape}
/// {@macro flutter.material.SliderTheme.rangeSliderTrackShape}
/// {@macro flutter.material.SliderTheme.sliderComponentShape}
1165 1166 1167 1168 1169 1170 1171
abstract class RangeSliderValueIndicatorShape {
  /// This abstract const constructor enables subclasses to provide
  /// const constructors so that they can be used in const expressions.
  const RangeSliderValueIndicatorShape();

  /// Returns the preferred size of the shape, based on the given conditions.
  ///
1172
  /// {@macro flutter.material.RangeSliderThumbShape.getPreferredSize.isEnabled}
1173
  ///
1174
  /// {@macro flutter.material.RangeSliderThumbShape.getPreferredSize.isDiscrete}
1175
  ///
1176 1177
  /// The `labelPainter` argument helps determine the width of the shape. It is
  /// variable width because it is derived from a formatted string.
1178
  ///
1179
  /// {@macro flutter.material.SliderComponentShape.paint.textScaleFactor}
1180 1181 1182
  Size getPreferredSize(
    bool isEnabled,
    bool isDiscrete, {
1183 1184
    required TextPainter labelPainter,
    required double textScaleFactor,
1185
  });
1186

1187 1188 1189 1190 1191
  /// Determines the best offset to keep this shape on the screen.
  ///
  /// Override this method when the center of the value indicator should be
  /// shifted from the vertical center of the thumb.
  double getHorizontalShift({
1192 1193 1194 1195 1196 1197
    RenderBox? parentBox,
    Offset? center,
    TextPainter? labelPainter,
    Animation<double>? activationAnimation,
    double? textScaleFactor,
    Size? sizeWithOverflow,
1198 1199 1200 1201
  }) {
    return 0;
  }

1202 1203
  /// Paints the value indicator shape based on the state passed to it.
  ///
1204
  /// {@macro flutter.material.RangeSliderThumbShape.paint.context}
1205
  ///
1206
  /// {@macro flutter.material.SliderComponentShape.paint.center}
1207
  ///
1208
  /// {@macro flutter.material.RangeSliderThumbShape.paint.activationAnimation}
1209
  ///
1210
  /// {@macro flutter.material.RangeSliderThumbShape.paint.enableAnimation}
1211
  ///
1212
  /// {@macro flutter.material.RangeSliderThumbShape.getPreferredSize.isDiscrete}
1213
  ///
1214
  /// The `isOnTop` argument is the top-most value indicator between the two value
1215 1216 1217 1218
  /// indicators, which is always the indicator for the most recently selected thumb. In
  /// the default case, this is used to paint a stroke around the top indicator
  /// for better visibility between the two indicators.
  ///
1219
  /// {@macro flutter.material.SliderComponentShape.paint.textScaleFactor}
1220
  ///
1221
  /// {@macro flutter.material.SliderComponentShape.paint.sizeWithOverflow}
1222
  ///
1223
  /// {@template flutter.material.RangeSliderValueIndicatorShape.paint.parentBox}
1224 1225 1226
  /// The `parentBox` argument is the [RenderBox] of the [RangeSlider]. Its
  /// attributes, such as size, can be used to assist in painting this shape.
  /// {@endtemplate}
1227
  ///
1228
  /// {@macro flutter.material.RangeSliderThumbShape.paint.sliderTheme}
1229
  ///
1230 1231 1232 1233
  /// The `textDirection` argument can be used to determine how any extra text
  /// or graphics, besides the text painted by the [labelPainter] should be
  /// positioned. The `labelPainter` argument already has the `textDirection`
  /// set.
1234
  ///
1235 1236
  /// The `value` argument is the current parametric value (from 0.0 to 1.0) of
  /// the slider.
1237
  ///
1238
  /// {@macro flutter.material.RangeSliderThumbShape.paint.thumb}
1239 1240
  void paint(
    PaintingContext context,
1241
    Offset center, {
1242 1243
    required Animation<double> activationAnimation,
    required Animation<double> enableAnimation,
1244
    bool isDiscrete,
1245
    bool isOnTop,
1246
    required TextPainter labelPainter,
1247 1248
    double textScaleFactor,
    Size sizeWithOverflow,
1249 1250
    required RenderBox parentBox,
    required SliderThemeData sliderTheme,
1251 1252
    TextDirection textDirection,
    double value,
1253
    Thumb thumb,
1254
  });
1255
}
1256

1257 1258 1259 1260 1261 1262 1263
/// Base class for [RangeSlider] tick mark shapes.
///
/// This is a simplified version of [SliderComponentShape] with a
/// [SliderThemeData] passed when getting the preferred size.
///
/// See also:
///
1264 1265
///  * [RoundRangeSliderTickMarkShape] for the default [RangeSlider]'s tick mark
///    shape that paints a solid circle.
1266 1267 1268 1269
/// {@macro flutter.material.SliderTheme.rangeSliderThumbShape}
/// {@macro flutter.material.SliderTheme.rangeSliderTrackShape}
/// {@macro flutter.material.SliderTheme.rangeSliderValueIndicatorShape}
/// {@macro flutter.material.SliderTheme.sliderComponentShape}
1270 1271 1272 1273 1274 1275
abstract class RangeSliderTickMarkShape {
  /// This abstract const constructor enables subclasses to provide
  /// const constructors so that they can be used in const expressions.
  const RangeSliderTickMarkShape();

  /// Returns the preferred size of the shape.
1276
  ///
1277
  /// It is used to help position the tick marks within the slider.
1278
  ///
1279
  /// {@macro flutter.material.RangeSliderThumbShape.paint.sliderTheme}
1280
  ///
1281
  /// {@macro flutter.material.RangeSliderThumbShape.getPreferredSize.isEnabled}
1282
  Size getPreferredSize({
1283
    required SliderThemeData sliderTheme,
1284 1285
    bool isEnabled,
  });
1286

1287
  /// Paints the slider track.
1288
  ///
1289
  /// {@macro flutter.material.RangeSliderThumbShape.paint.context}
1290
  ///
1291
  /// {@macro flutter.material.SliderComponentShape.paint.center}
1292
  ///
1293
  /// {@macro flutter.material.RangeSliderValueIndicatorShape.paint.parentBox}
1294
  ///
1295
  /// {@macro flutter.material.RangeSliderThumbShape.paint.sliderTheme}
1296
  ///
1297
  /// {@macro flutter.material.RangeSliderThumbShape.paint.enableAnimation}
1298
  ///
1299
  /// {@macro flutter.material.RangeSliderThumbShape.getPreferredSize.isEnabled}
1300
  ///
1301 1302
  /// The `textDirection` argument can be used to determine how the tick marks
  /// are painted depending on whether they are on an active track segment or not.
1303
  ///
1304
  /// {@template flutter.material.RangeSliderTickMarkShape.paint.trackSegment}
1305 1306 1307 1308 1309
  /// The track segment between the two thumbs is the active track segment. The
  /// track segments between the thumb and each end of the slider are the inactive
  /// track segments. In [TextDirection.ltr], the start of the slider is on the
  /// left, and in [TextDirection.rtl], the start of the slider is on the right.
  /// {@endtemplate}
1310 1311 1312
  void paint(
    PaintingContext context,
    Offset center, {
1313 1314 1315 1316 1317
    required RenderBox parentBox,
    required SliderThemeData sliderTheme,
    required Animation<double> enableAnimation,
    required Offset startThumbCenter,
    required Offset endThumbCenter,
1318
    bool isEnabled,
1319
    required TextDirection textDirection,
1320
  });
1321 1322
}

1323
/// Base class for [RangeSlider] track shapes.
1324
///
1325 1326 1327 1328 1329 1330 1331 1332 1333
/// The slider's thumbs move along the track. A discrete slider's tick marks
/// are drawn after the track, but before the thumb, and are aligned with the
/// track.
///
/// The [getPreferredRect] helps position the slider thumbs and tick marks
/// relative to the track.
///
/// See also:
///
1334 1335
///  * [RoundedRectRangeSliderTrackShape] for the default [RangeSlider]'s track
///    shape that paints a stadium-like track.
1336 1337 1338 1339
/// {@macro flutter.material.SliderTheme.rangeSliderTickMarkShape}
/// {@macro flutter.material.SliderTheme.rangeSliderThumbShape}
/// {@macro flutter.material.SliderTheme.rangeSliderValueIndicatorShape}
/// {@macro flutter.material.SliderTheme.sliderComponentShape}
1340 1341 1342 1343
abstract class RangeSliderTrackShape {
  /// This abstract const constructor enables subclasses to provide
  /// const constructors so that they can be used in const expressions.
  const RangeSliderTrackShape();
1344

1345 1346 1347 1348 1349 1350
  /// Returns the preferred bounds of the shape.
  ///
  /// It is used to provide horizontal boundaries for the position of the
  /// thumbs, and to help position the slider thumbs and tick marks relative to
  /// the track.
  ///
1351 1352 1353
  /// The `parentBox` argument can be used to help determine the preferredRect
  /// relative to attributes of the render box of the slider itself, such as
  /// size.
1354
  ///
1355 1356 1357
  /// The `offset` argument is relative to the caller's bounding box. It can be
  /// used to convert gesture coordinates from global to slider-relative
  /// coordinates.
1358
  ///
1359
  /// {@macro flutter.material.RangeSliderThumbShape.paint.sliderTheme}
1360
  ///
1361
  /// {@macro flutter.material.RangeSliderThumbShape.getPreferredSize.isEnabled}
1362
  ///
1363
  /// {@macro flutter.material.RangeSliderThumbShape.getPreferredSize.isDiscrete}
1364
  Rect getPreferredRect({
1365
    required RenderBox parentBox,
1366
    Offset offset = Offset.zero,
1367
    required SliderThemeData sliderTheme,
1368 1369 1370 1371 1372 1373
    bool isEnabled,
    bool isDiscrete,
  });

  /// Paints the track shape based on the state passed to it.
  ///
1374
  /// {@macro flutter.material.SliderComponentShape.paint.context}
1375 1376 1377 1378
  ///
  /// The `offset` argument is the offset of the origin of the `parentBox` to
  /// the origin of its `context` canvas. This shape must be painted relative
  /// to this offset. See [PaintingContextCallback].
1379
  ///
1380
  /// {@macro flutter.material.RangeSliderValueIndicatorShape.paint.parentBox}
1381
  ///
1382
  /// {@macro flutter.material.RangeSliderThumbShape.paint.sliderTheme}
1383
  ///
1384
  /// {@macro flutter.material.RangeSliderThumbShape.paint.enableAnimation}
1385
  ///
1386 1387 1388
  /// The `startThumbCenter` argument is the offset of the center of the start
  /// thumb relative to the origin of the [PaintingContext.canvas]. It can be
  /// used as one point that divides the track between inactive and active.
1389
  ///
1390 1391 1392
  /// The `endThumbCenter` argument is the offset of the center of the end
  /// thumb relative to the origin of the [PaintingContext.canvas]. It can be
  /// used as one point that divides the track between inactive and active.
1393
  ///
1394
  /// {@macro flutter.material.RangeSliderThumbShape.getPreferredSize.isEnabled}
1395
  ///
1396
  /// {@macro flutter.material.RangeSliderThumbShape.getPreferredSize.isDiscrete}
1397
  ///
1398 1399 1400
  /// The `textDirection` argument can be used to determine how the track
  /// segments are painted depending on whether they are on an active track
  /// segment or not.
1401
  ///
1402
  /// {@macro flutter.material.RangeSliderTickMarkShape.paint.trackSegment}
1403 1404
  void paint(
    PaintingContext context,
1405
    Offset offset, {
1406 1407 1408 1409 1410 1411 1412 1413
    required RenderBox parentBox,
    required SliderThemeData sliderTheme,
    required Animation<double> enableAnimation,
    required Offset startThumbCenter,
    required Offset endThumbCenter,
    bool isEnabled = false,
    bool isDiscrete = false,
    required TextDirection textDirection,
1414
  });
1415 1416
}

1417 1418 1419
/// Base track shape that provides an implementation of [getPreferredRect] for
/// default sizing.
///
1420 1421 1422 1423
/// The height is set from [SliderThemeData.trackHeight] and the width of the
/// parent box less the larger of the widths of [SliderThemeData.thumbShape] and
/// [SliderThemeData.overlayShape].
///
1424 1425
/// See also:
///
1426 1427 1428 1429
///  * [RectangularSliderTrackShape], which is a track shape with sharp
///    rectangular edges
///  * [RoundedRectSliderTrackShape], which is a track shape with round
///    stadium-like edges.
1430
mixin BaseSliderTrackShape {
1431 1432 1433
  /// Returns a rect that represents the track bounds that fits within the
  /// [Slider].
  ///
1434 1435
  /// The width is the width of the [Slider] or [RangeSlider], but padded by
  /// the max  of the overlay and thumb radius. The height is defined by the
1436 1437 1438 1439 1440
  /// [SliderThemeData.trackHeight].
  ///
  /// The [Rect] is centered both horizontally and vertically within the slider
  /// bounds.
  Rect getPreferredRect({
1441
    required RenderBox parentBox,
1442
    Offset offset = Offset.zero,
1443
    required SliderThemeData sliderTheme,
1444 1445 1446
    bool isEnabled = false,
    bool isDiscrete = false,
  }) {
1447 1448
    assert(isEnabled != null);
    assert(isDiscrete != null);
1449
    assert(parentBox != null);
1450
    assert(sliderTheme != null);
1451 1452 1453
    final double thumbWidth = sliderTheme.thumbShape!.getPreferredSize(isEnabled, isDiscrete).width;
    final double overlayWidth = sliderTheme.overlayShape!.getPreferredSize(isEnabled, isDiscrete).width;
    final double trackHeight = sliderTheme.trackHeight!;
1454 1455 1456
    assert(overlayWidth >= 0);
    assert(trackHeight >= 0);

1457
    final double trackLeft = offset.dx + math.max(overlayWidth / 2, thumbWidth / 2);
1458
    final double trackTop = offset.dy + (parentBox.size.height - trackHeight) / 2;
1459 1460 1461 1462
    final double trackRight = trackLeft + parentBox.size.width - math.max(thumbWidth, overlayWidth);
    final double trackBottom = trackTop + trackHeight;
    // If the parentBox'size less than slider's size the trackRight will be less than trackLeft, so switch them.
    return Rect.fromLTRB(math.min(trackLeft, trackRight), trackTop, math.max(trackLeft, trackRight), trackBottom);
1463 1464
  }
}
1465

1466
/// A [Slider] track that's a simple rectangle.
1467
///
1468
/// It paints a solid colored rectangle, vertically centered in the
1469
/// `parentBox`. The track rectangle extends to the bounds of the `parentBox`,
1470 1471
/// but is padded by the [RoundSliderOverlayShape] radius. The height is defined
/// by the [SliderThemeData.trackHeight]. The color is determined by the
1472
/// [Slider]'s enabled state and the track segment's active state which are
1473
/// defined by:
1474 1475 1476 1477 1478
///   [SliderThemeData.activeTrackColor],
///   [SliderThemeData.inactiveTrackColor],
///   [SliderThemeData.disabledActiveTrackColor],
///   [SliderThemeData.disabledInactiveTrackColor].
///
1479
/// {@macro flutter.material.SliderTrackShape.paint.trackSegment}
1480
///
1481 1482 1483
/// ![A slider widget, consisting of 5 divisions and showing the rectangular slider track shape.]
/// (https://flutter.github.io/assets-for-api-docs/assets/material/rectangular_slider_track_shape.png)
///
1484 1485 1486 1487 1488
/// See also:
///
///  * [Slider], for the component that is meant to display this shape.
///  * [SliderThemeData], where an instance of this class is set to inform the
///    slider of the visual details of the its track.
1489
/// {@macro flutter.material.SliderTheme.sliderTrackShape}
1490 1491 1492
///  * [RoundedRectSliderTrackShape], for a similar track with rounded edges.
class RectangularSliderTrackShape extends SliderTrackShape with BaseSliderTrackShape {
  /// Creates a slider track that draws 2 rectangles.
1493 1494 1495
  const RectangularSliderTrackShape({
    @Deprecated(
      'It no longer has any effect because the thumb does not shrink when the slider is disabled now. '
1496
      'This feature was deprecated after v1.26.0-18.0.pre.',
1497
    )
1498
    this.disabledThumbGapWidth = 2.0,
1499
  });
1500 1501 1502 1503 1504 1505 1506

  /// Horizontal spacing, or gap, between the disabled thumb and the track.
  ///
  /// This is only used when the slider is disabled. There is no gap around
  /// the thumb and any part of the track when the slider is enabled. The
  /// Material spec defaults this gap width 2, which is half of the disabled
  /// thumb radius.
1507 1508
  @Deprecated(
    'It no longer has any effect because the thumb does not shrink when the slider is disabled now. '
1509
    'This feature was deprecated after v1.26.0-18.0.pre.',
1510
  )
1511
  final double disabledThumbGapWidth;
1512 1513 1514 1515 1516

  @override
  void paint(
    PaintingContext context,
    Offset offset, {
1517 1518 1519 1520 1521
    required RenderBox parentBox,
    required SliderThemeData sliderTheme,
    required Animation<double> enableAnimation,
    required TextDirection textDirection,
    required Offset thumbCenter,
1522 1523 1524 1525 1526 1527 1528
    bool isDiscrete = false,
    bool isEnabled = false,
  }) {
    assert(context != null);
    assert(offset != null);
    assert(parentBox != null);
    assert(sliderTheme != null);
1529 1530 1531 1532 1533 1534 1535 1536 1537 1538
    assert(sliderTheme.disabledActiveTrackColor != null);
    assert(sliderTheme.disabledInactiveTrackColor != null);
    assert(sliderTheme.activeTrackColor != null);
    assert(sliderTheme.inactiveTrackColor != null);
    assert(sliderTheme.thumbShape != null);
    assert(enableAnimation != null);
    assert(textDirection != null);
    assert(thumbCenter != null);
    assert(isEnabled != null);
    assert(isDiscrete != null);
1539 1540 1541
    // If the slider [SliderThemeData.trackHeight] is less than or equal to 0,
    // then it makes no difference whether the track is painted or not,
    // therefore the painting can be a no-op.
1542
    if (sliderTheme.trackHeight! <= 0) {
1543 1544 1545 1546 1547
      return;
    }

    // Assign the track segment paints, which are left: active, right: inactive,
    // but reversed for right to left text.
1548 1549
    final ColorTween activeTrackColorTween = ColorTween(begin: sliderTheme.disabledActiveTrackColor, end: sliderTheme.activeTrackColor);
    final ColorTween inactiveTrackColorTween = ColorTween(begin: sliderTheme.disabledInactiveTrackColor, end: sliderTheme.inactiveTrackColor);
1550 1551
    final Paint activePaint = Paint()..color = activeTrackColorTween.evaluate(enableAnimation)!;
    final Paint inactivePaint = Paint()..color = inactiveTrackColorTween.evaluate(enableAnimation)!;
1552 1553
    final Paint leftTrackPaint;
    final Paint rightTrackPaint;
1554 1555 1556 1557 1558 1559 1560 1561 1562 1563 1564 1565 1566 1567 1568 1569 1570 1571 1572
    switch (textDirection) {
      case TextDirection.ltr:
        leftTrackPaint = activePaint;
        rightTrackPaint = inactivePaint;
        break;
      case TextDirection.rtl:
        leftTrackPaint = inactivePaint;
        rightTrackPaint = activePaint;
        break;
    }

    final Rect trackRect = getPreferredRect(
      parentBox: parentBox,
      offset: offset,
      sliderTheme: sliderTheme,
      isEnabled: isEnabled,
      isDiscrete: isDiscrete,
    );

1573
    final Rect leftTrackSegment = Rect.fromLTRB(trackRect.left, trackRect.top, thumbCenter.dx, trackRect.bottom);
1574 1575
    if (!leftTrackSegment.isEmpty)
      context.canvas.drawRect(leftTrackSegment, leftTrackPaint);
1576
    final Rect rightTrackSegment = Rect.fromLTRB(thumbCenter.dx, trackRect.top, trackRect.right, trackRect.bottom);
1577 1578 1579 1580 1581 1582 1583 1584
    if (!rightTrackSegment.isEmpty)
      context.canvas.drawRect(rightTrackSegment, rightTrackPaint);
  }
}

/// The default shape of a [Slider]'s track.
///
/// It paints a solid colored rectangle with rounded edges, vertically centered
1585 1586
/// in the `parentBox`. The track rectangle extends to the bounds of the
/// `parentBox`, but is padded by the larger of [RoundSliderOverlayShape]'s
1587 1588 1589 1590 1591 1592 1593 1594
/// radius and [RoundSliderThumbShape]'s radius. The height is defined by the
/// [SliderThemeData.trackHeight]. The color is determined by the [Slider]'s
/// enabled state and the track segment's active state which are defined by:
///   [SliderThemeData.activeTrackColor],
///   [SliderThemeData.inactiveTrackColor],
///   [SliderThemeData.disabledActiveTrackColor],
///   [SliderThemeData.disabledInactiveTrackColor].
///
1595
/// {@macro flutter.material.SliderTrackShape.paint.trackSegment}
1596
///
1597 1598 1599
/// ![A slider widget, consisting of 5 divisions and showing the rounded rect slider track shape.]
/// (https://flutter.github.io/assets-for-api-docs/assets/material/rounded_rect_slider_track_shape.png)
///
1600 1601 1602 1603 1604
/// See also:
///
///  * [Slider], for the component that is meant to display this shape.
///  * [SliderThemeData], where an instance of this class is set to inform the
///    slider of the visual details of the its track.
1605
/// {@macro flutter.material.SliderTheme.sliderTrackShape}
1606 1607 1608
///  * [RectangularSliderTrackShape], for a similar track with sharp edges.
class RoundedRectSliderTrackShape extends SliderTrackShape with BaseSliderTrackShape {
  /// Create a slider track that draws two rectangles with rounded outer edges.
1609
  const RoundedRectSliderTrackShape();
1610 1611 1612

  @override
  void paint(
1613 1614
    PaintingContext context,
    Offset offset, {
1615 1616 1617 1618 1619
    required RenderBox parentBox,
    required SliderThemeData sliderTheme,
    required Animation<double> enableAnimation,
    required TextDirection textDirection,
    required Offset thumbCenter,
1620 1621
    bool isDiscrete = false,
    bool isEnabled = false,
1622
    double additionalActiveTrackHeight = 2,
1623
  }) {
1624 1625 1626 1627 1628 1629 1630 1631 1632
    assert(context != null);
    assert(offset != null);
    assert(parentBox != null);
    assert(sliderTheme != null);
    assert(sliderTheme.disabledActiveTrackColor != null);
    assert(sliderTheme.disabledInactiveTrackColor != null);
    assert(sliderTheme.activeTrackColor != null);
    assert(sliderTheme.inactiveTrackColor != null);
    assert(sliderTheme.thumbShape != null);
1633 1634 1635
    assert(enableAnimation != null);
    assert(textDirection != null);
    assert(thumbCenter != null);
1636 1637 1638
    // If the slider [SliderThemeData.trackHeight] is less than or equal to 0,
    // then it makes no difference whether the track is painted or not,
    // therefore the painting  can be a no-op.
1639
    if (sliderTheme.trackHeight == null || sliderTheme.trackHeight! <= 0) {
1640 1641 1642 1643 1644 1645 1646
      return;
    }

    // Assign the track segment paints, which are leading: active and
    // trailing: inactive.
    final ColorTween activeTrackColorTween = ColorTween(begin: sliderTheme.disabledActiveTrackColor, end: sliderTheme.activeTrackColor);
    final ColorTween inactiveTrackColorTween = ColorTween(begin: sliderTheme.disabledInactiveTrackColor, end: sliderTheme.inactiveTrackColor);
1647 1648
    final Paint activePaint = Paint()..color = activeTrackColorTween.evaluate(enableAnimation)!;
    final Paint inactivePaint = Paint()..color = inactiveTrackColorTween.evaluate(enableAnimation)!;
1649 1650
    final Paint leftTrackPaint;
    final Paint rightTrackPaint;
1651 1652 1653 1654 1655 1656 1657 1658 1659 1660 1661 1662 1663 1664 1665 1666 1667 1668
    switch (textDirection) {
      case TextDirection.ltr:
        leftTrackPaint = activePaint;
        rightTrackPaint = inactivePaint;
        break;
      case TextDirection.rtl:
        leftTrackPaint = inactivePaint;
        rightTrackPaint = activePaint;
        break;
    }

    final Rect trackRect = getPreferredRect(
      parentBox: parentBox,
      offset: offset,
      sliderTheme: sliderTheme,
      isEnabled: isEnabled,
      isDiscrete: isDiscrete,
    );
1669 1670 1671
    final Radius trackRadius = Radius.circular(trackRect.height / 2);
    final Radius activeTrackRadius = Radius.circular(trackRect.height / 2 + 1);

1672 1673 1674 1675 1676 1677 1678 1679 1680 1681 1682 1683 1684 1685 1686 1687 1688 1689 1690 1691 1692 1693
    context.canvas.drawRRect(
      RRect.fromLTRBAndCorners(
        trackRect.left,
        (textDirection == TextDirection.ltr) ? trackRect.top - (additionalActiveTrackHeight / 2): trackRect.top,
        thumbCenter.dx,
        (textDirection == TextDirection.ltr) ? trackRect.bottom + (additionalActiveTrackHeight / 2) : trackRect.bottom,
        topLeft: (textDirection == TextDirection.ltr) ? activeTrackRadius : trackRadius,
        bottomLeft: (textDirection == TextDirection.ltr) ? activeTrackRadius: trackRadius,
      ),
      leftTrackPaint,
    );
    context.canvas.drawRRect(
      RRect.fromLTRBAndCorners(
        thumbCenter.dx,
        (textDirection == TextDirection.rtl) ? trackRect.top - (additionalActiveTrackHeight / 2) : trackRect.top,
        trackRect.right,
        (textDirection == TextDirection.rtl) ? trackRect.bottom + (additionalActiveTrackHeight / 2) : trackRect.bottom,
        topRight: (textDirection == TextDirection.rtl) ? activeTrackRadius : trackRadius,
        bottomRight: (textDirection == TextDirection.rtl) ? activeTrackRadius : trackRadius,
      ),
      rightTrackPaint,
    );
1694 1695 1696
  }
}

1697
/// A [RangeSlider] track that's a simple rectangle.
1698
///
1699
/// It paints a solid colored rectangle, vertically centered in the
1700
/// `parentBox`. The track rectangle extends to the bounds of the `parentBox`,
1701 1702
/// but is padded by the [RoundSliderOverlayShape] radius. The height is
/// defined by the [SliderThemeData.trackHeight]. The color is determined by the
1703
/// [Slider]'s enabled state and the track segment's active state which are
1704 1705 1706 1707 1708
/// defined by:
///   [SliderThemeData.activeTrackColor],
///   [SliderThemeData.inactiveTrackColor],
///   [SliderThemeData.disabledActiveTrackColor],
///   [SliderThemeData.disabledInactiveTrackColor].
1709
///
1710
/// {@macro flutter.material.RangeSliderTickMarkShape.paint.trackSegment}
1711
///
1712 1713 1714
/// ![A range slider widget, consisting of 5 divisions and showing the rectangular range slider track shape.]
/// (https://flutter.github.io/assets-for-api-docs/assets/material/rectangular_range_slider_track_shape.png)
///
1715 1716
/// See also:
///
1717
///  * [RangeSlider], for the component that is meant to display this shape.
1718
///  * [SliderThemeData], where an instance of this class is set to inform the
1719
///    slider of the visual details of the its track.
1720
/// {@macro flutter.material.SliderTheme.rangeSliderTrackShape}
1721 1722 1723 1724
///  * [RoundedRectRangeSliderTrackShape], for a similar track with rounded
///    edges.
class RectangularRangeSliderTrackShape extends RangeSliderTrackShape {
  /// Create a slider track with rectangular outer edges.
1725
  ///
1726 1727
  /// The middle track segment is the selected range and is active, and the two
  /// outer track segments are inactive.
1728
  const RectangularRangeSliderTrackShape();
1729 1730 1731

  @override
  Rect getPreferredRect({
1732
    required RenderBox parentBox,
1733
    Offset offset = Offset.zero,
1734
    required SliderThemeData sliderTheme,
1735 1736
    bool isEnabled = false,
    bool isDiscrete = false,
1737
  }) {
1738
    assert(parentBox != null);
1739
    assert(offset != null);
1740
    assert(sliderTheme != null);
1741 1742 1743
    assert(sliderTheme.overlayShape != null);
    assert(isEnabled != null);
    assert(isDiscrete != null);
1744 1745
    final double overlayWidth = sliderTheme.overlayShape!.getPreferredSize(isEnabled, isDiscrete).width;
    final double trackHeight = sliderTheme.trackHeight!;
1746 1747 1748 1749 1750
    assert(overlayWidth >= 0);
    assert(trackHeight >= 0);

    final double trackLeft = offset.dx + overlayWidth / 2;
    final double trackTop = offset.dy + (parentBox.size.height - trackHeight) / 2;
1751 1752 1753 1754
    final double trackRight = trackLeft + parentBox.size.width - overlayWidth;
    final double trackBottom = trackTop + trackHeight;
    // If the parentBox'size less than slider's size the trackRight will be less than trackLeft, so switch them.
    return Rect.fromLTRB(math.min(trackLeft, trackRight), trackTop, math.max(trackLeft, trackRight), trackBottom);
1755 1756 1757 1758 1759 1760
  }

  @override
  void paint(
    PaintingContext context,
    Offset offset, {
1761 1762 1763 1764 1765
    required RenderBox parentBox,
    required SliderThemeData sliderTheme,
    required Animation<double>? enableAnimation,
    required Offset startThumbCenter,
    required Offset endThumbCenter,
1766
    bool isEnabled = false,
1767
    bool isDiscrete = false,
1768
    required TextDirection textDirection,
1769
  }) {
1770 1771 1772 1773
    assert(context != null);
    assert(offset != null);
    assert(parentBox != null);
    assert(sliderTheme != null);
1774 1775 1776 1777 1778
    assert(sliderTheme.disabledActiveTrackColor != null);
    assert(sliderTheme.disabledInactiveTrackColor != null);
    assert(sliderTheme.activeTrackColor != null);
    assert(sliderTheme.inactiveTrackColor != null);
    assert(sliderTheme.rangeThumbShape != null);
1779
    assert(enableAnimation != null);
1780 1781 1782 1783
    assert(startThumbCenter != null);
    assert(endThumbCenter != null);
    assert(isEnabled != null);
    assert(isDiscrete != null);
1784
    assert(textDirection != null);
1785 1786
    // Assign the track segment paints, which are left: active, right: inactive,
    // but reversed for right to left text.
1787 1788
    final ColorTween activeTrackColorTween = ColorTween(begin: sliderTheme.disabledActiveTrackColor, end: sliderTheme.activeTrackColor);
    final ColorTween inactiveTrackColorTween = ColorTween(begin: sliderTheme.disabledInactiveTrackColor, end: sliderTheme.inactiveTrackColor);
1789 1790
    final Paint activePaint = Paint()..color = activeTrackColorTween.evaluate(enableAnimation!)!;
    final Paint inactivePaint = Paint()..color = inactiveTrackColorTween.evaluate(enableAnimation)!;
1791

1792 1793
    final Offset leftThumbOffset;
    final Offset rightThumbOffset;
1794 1795 1796 1797 1798 1799 1800 1801 1802
    switch (textDirection) {
      case TextDirection.ltr:
        leftThumbOffset = startThumbCenter;
        rightThumbOffset = endThumbCenter;
        break;
      case TextDirection.rtl:
        leftThumbOffset = endThumbCenter;
        rightThumbOffset = startThumbCenter;
        break;
1803
    }
1804 1805 1806 1807 1808 1809 1810 1811

    final Rect trackRect = getPreferredRect(
      parentBox: parentBox,
      offset: offset,
      sliderTheme: sliderTheme,
      isEnabled: isEnabled,
      isDiscrete: isDiscrete,
    );
1812
    final Rect leftTrackSegment = Rect.fromLTRB(trackRect.left, trackRect.top, leftThumbOffset.dx, trackRect.bottom);
1813 1814
    if (!leftTrackSegment.isEmpty)
      context.canvas.drawRect(leftTrackSegment, inactivePaint);
1815
    final Rect middleTrackSegment = Rect.fromLTRB(leftThumbOffset.dx, trackRect.top, rightThumbOffset.dx, trackRect.bottom);
1816 1817
    if (!middleTrackSegment.isEmpty)
      context.canvas.drawRect(middleTrackSegment, activePaint);
1818
    final Rect rightTrackSegment = Rect.fromLTRB(rightThumbOffset.dx, trackRect.top, trackRect.right, trackRect.bottom);
1819 1820 1821 1822 1823 1824 1825 1826
    if (!rightTrackSegment.isEmpty)
      context.canvas.drawRect(rightTrackSegment, inactivePaint);
  }
}

/// The default shape of a [RangeSlider]'s track.
///
/// It paints a solid colored rectangle with rounded edges, vertically centered
1827 1828
/// in the `parentBox`. The track rectangle extends to the bounds of the
/// `parentBox`, but is padded by the larger of [RoundSliderOverlayShape]'s
1829 1830 1831 1832 1833 1834 1835 1836 1837
/// radius and [RoundRangeSliderThumbShape]'s radius. The height is defined by
/// the [SliderThemeData.trackHeight]. The color is determined by the
/// [RangeSlider]'s enabled state and the track segment's active state which are
/// defined by:
///   [SliderThemeData.activeTrackColor],
///   [SliderThemeData.inactiveTrackColor],
///   [SliderThemeData.disabledActiveTrackColor],
///   [SliderThemeData.disabledInactiveTrackColor].
///
1838
/// {@macro flutter.material.RangeSliderTickMarkShape.paint.trackSegment}
1839
///
1840 1841 1842
/// ![A range slider widget, consisting of 5 divisions and showing the rounded rect range slider track shape.]
/// (https://flutter.github.io/assets-for-api-docs/assets/material/rounded_rect_range_slider_track_shape.png)
///
1843 1844 1845 1846 1847
/// See also:
///
///  * [RangeSlider], for the component that is meant to display this shape.
///  * [SliderThemeData], where an instance of this class is set to inform the
///    slider of the visual details of the its track.
1848
/// {@macro flutter.material.SliderTheme.rangeSliderTrackShape}
1849 1850 1851 1852 1853 1854
///  * [RectangularRangeSliderTrackShape], for a similar track with sharp edges.
class RoundedRectRangeSliderTrackShape extends RangeSliderTrackShape {
  /// Create a slider track with rounded outer edges.
  ///
  /// The middle track segment is the selected range and is active, and the two
  /// outer track segments are inactive.
1855
  const RoundedRectRangeSliderTrackShape();
1856 1857 1858

  @override
  Rect getPreferredRect({
1859
    required RenderBox parentBox,
1860
    Offset offset = Offset.zero,
1861
    required SliderThemeData sliderTheme,
1862 1863 1864 1865 1866 1867 1868 1869 1870 1871
    bool isEnabled = false,
    bool isDiscrete = false,
  }) {
    assert(parentBox != null);
    assert(offset != null);
    assert(sliderTheme != null);
    assert(sliderTheme.overlayShape != null);
    assert(sliderTheme.trackHeight != null);
    assert(isEnabled != null);
    assert(isDiscrete != null);
1872 1873
    final double overlayWidth = sliderTheme.overlayShape!.getPreferredSize(isEnabled, isDiscrete).width;
    final double trackHeight = sliderTheme.trackHeight!;
1874 1875 1876 1877 1878
    assert(overlayWidth >= 0);
    assert(trackHeight >= 0);

    final double trackLeft = offset.dx + overlayWidth / 2;
    final double trackTop = offset.dy + (parentBox.size.height - trackHeight) / 2;
1879 1880 1881 1882
    final double trackRight = trackLeft + parentBox.size.width - overlayWidth;
    final double trackBottom = trackTop + trackHeight;
    // If the parentBox'size less than slider's size the trackRight will be less than trackLeft, so switch them.
    return Rect.fromLTRB(math.min(trackLeft, trackRight), trackTop, math.max(trackLeft, trackRight), trackBottom);
1883
  }
1884

1885 1886 1887 1888
  @override
  void paint(
    PaintingContext context,
    Offset offset, {
1889 1890 1891 1892 1893
    required RenderBox parentBox,
    required SliderThemeData sliderTheme,
    required Animation<double> enableAnimation,
    required Offset startThumbCenter,
    required Offset endThumbCenter,
1894 1895
    bool isEnabled = false,
    bool isDiscrete = false,
1896
    required TextDirection textDirection,
1897
    double additionalActiveTrackHeight = 2,
1898 1899 1900 1901 1902 1903 1904 1905 1906 1907 1908 1909 1910 1911 1912 1913
  }) {
    assert(context != null);
    assert(offset != null);
    assert(parentBox != null);
    assert(sliderTheme != null);
    assert(sliderTheme.disabledActiveTrackColor != null);
    assert(sliderTheme.disabledInactiveTrackColor != null);
    assert(sliderTheme.activeTrackColor != null);
    assert(sliderTheme.inactiveTrackColor != null);
    assert(sliderTheme.rangeThumbShape != null);
    assert(enableAnimation != null);
    assert(startThumbCenter != null);
    assert(endThumbCenter != null);
    assert(isEnabled != null);
    assert(isDiscrete != null);
    assert(textDirection != null);
1914

1915
    if (sliderTheme.trackHeight == null || sliderTheme.trackHeight! <= 0) {
1916 1917 1918
      return;
    }

1919 1920
    // Assign the track segment paints, which are left: active, right: inactive,
    // but reversed for right to left text.
1921 1922
    final ColorTween activeTrackColorTween = ColorTween(
      begin: sliderTheme.disabledActiveTrackColor,
1923 1924
      end: sliderTheme.activeTrackColor,
    );
1925 1926
    final ColorTween inactiveTrackColorTween = ColorTween(
      begin: sliderTheme.disabledInactiveTrackColor,
1927 1928
      end: sliderTheme.inactiveTrackColor,
    );
1929
    final Paint activePaint = Paint()
1930
      ..color = activeTrackColorTween.evaluate(enableAnimation)!;
1931
    final Paint inactivePaint = Paint()
1932
      ..color = inactiveTrackColorTween.evaluate(enableAnimation)!;
1933

1934 1935
    final Offset leftThumbOffset;
    final Offset rightThumbOffset;
1936 1937
    switch (textDirection) {
      case TextDirection.ltr:
1938 1939
        leftThumbOffset = startThumbCenter;
        rightThumbOffset = endThumbCenter;
1940 1941
        break;
      case TextDirection.rtl:
1942 1943
        leftThumbOffset = endThumbCenter;
        rightThumbOffset = startThumbCenter;
1944 1945
        break;
    }
1946
    final Size thumbSize = sliderTheme.rangeThumbShape!.getPreferredSize(isEnabled, isDiscrete);
1947 1948
    final double thumbRadius = thumbSize.width / 2;
    assert(thumbRadius > 0);
1949 1950

    final Rect trackRect = getPreferredRect(
1951 1952 1953 1954 1955
      parentBox: parentBox,
      offset: offset,
      sliderTheme: sliderTheme,
      isEnabled: isEnabled,
      isDiscrete: isDiscrete,
1956
    );
1957

1958 1959 1960 1961 1962 1963 1964 1965 1966 1967 1968 1969 1970 1971 1972 1973 1974 1975 1976 1977 1978 1979 1980 1981 1982 1983 1984 1985 1986 1987 1988 1989 1990
    final Radius trackRadius = Radius.circular(trackRect.height / 2);

    context.canvas.drawRRect(
      RRect.fromLTRBAndCorners(
        trackRect.left,
        trackRect.top,
        leftThumbOffset.dx,
        trackRect.bottom,
        topLeft: trackRadius,
        bottomLeft: trackRadius,
      ),
      inactivePaint,
    );
    context.canvas.drawRect(
      Rect.fromLTRB(
        leftThumbOffset.dx,
        trackRect.top - (additionalActiveTrackHeight / 2),
        rightThumbOffset.dx,
        trackRect.bottom + (additionalActiveTrackHeight / 2),
      ),
      activePaint,
    );
    context.canvas.drawRRect(
      RRect.fromLTRBAndCorners(
        rightThumbOffset.dx,
        trackRect.top,
        trackRect.right,
        trackRect.bottom,
        topRight: trackRadius,
        bottomRight: trackRadius,
      ),
      inactivePaint,
    );
1991 1992 1993
  }
}

1994
/// The default shape of each [Slider] tick mark.
1995 1996
///
/// Tick marks are only displayed if the slider is discrete, which can be done
1997
/// by setting the [Slider.divisions] to an integer value.
1998 1999 2000 2001 2002 2003 2004 2005 2006
///
/// It paints a solid circle, centered in the on the track.
/// The color is determined by the [Slider]'s enabled state and track's active
/// states. These colors are defined in:
///   [SliderThemeData.activeTrackColor],
///   [SliderThemeData.inactiveTrackColor],
///   [SliderThemeData.disabledActiveTrackColor],
///   [SliderThemeData.disabledInactiveTrackColor].
///
2007 2008 2009
/// ![A slider widget, consisting of 5 divisions and showing the round slider slider tick mark shape.]
/// (https://flutter.github.io/assets-for-api-docs/assets/material/rounded_slider_tick_mark_shape.png)
///
2010 2011 2012 2013 2014 2015
/// See also:
///
///  * [Slider], which includes tick marks defined by this shape.
///  * [SliderTheme], which can be used to configure the tick mark shape of all
///    sliders in a widget subtree.
class RoundSliderTickMarkShape extends SliderTickMarkShape {
2016
  /// Create a slider tick mark that draws a circle.
2017 2018 2019
  const RoundSliderTickMarkShape({
    this.tickMarkRadius,
  });
2020 2021 2022

  /// The preferred radius of the round tick mark.
  ///
2023
  /// If it is not provided, then 1/4 of the [SliderThemeData.trackHeight] is used.
2024
  final double? tickMarkRadius;
2025 2026

  @override
2027
  Size getPreferredSize({
2028
    required SliderThemeData sliderTheme,
2029
    required bool isEnabled,
2030 2031 2032 2033
  }) {
    assert(sliderTheme != null);
    assert(sliderTheme.trackHeight != null);
    assert(isEnabled != null);
2034 2035
    // The tick marks are tiny circles. If no radius is provided, then the
    // radius is defaulted to be a fraction of the
2036
    // [SliderThemeData.trackHeight]. The fraction is 1/4.
2037
    return Size.fromRadius(tickMarkRadius ?? sliderTheme.trackHeight! / 4);
2038 2039 2040 2041 2042 2043
  }

  @override
  void paint(
    PaintingContext context,
    Offset center, {
2044 2045 2046 2047 2048
    required RenderBox parentBox,
    required SliderThemeData sliderTheme,
    required Animation<double> enableAnimation,
    required TextDirection textDirection,
    required Offset thumbCenter,
2049
    required bool isEnabled,
2050 2051 2052 2053 2054 2055 2056 2057 2058 2059 2060 2061 2062 2063 2064
  }) {
    assert(context != null);
    assert(center != null);
    assert(parentBox != null);
    assert(sliderTheme != null);
    assert(sliderTheme.disabledActiveTickMarkColor != null);
    assert(sliderTheme.disabledInactiveTickMarkColor != null);
    assert(sliderTheme.activeTickMarkColor != null);
    assert(sliderTheme.inactiveTickMarkColor != null);
    assert(enableAnimation != null);
    assert(textDirection != null);
    assert(thumbCenter != null);
    assert(isEnabled != null);
    // The paint color of the tick mark depends on its position relative
    // to the thumb and the text direction.
2065 2066
    Color? begin;
    Color? end;
2067 2068 2069 2070 2071 2072 2073 2074 2075 2076 2077 2078
    switch (textDirection) {
      case TextDirection.ltr:
        final bool isTickMarkRightOfThumb = center.dx > thumbCenter.dx;
        begin = isTickMarkRightOfThumb ? sliderTheme.disabledInactiveTickMarkColor : sliderTheme.disabledActiveTickMarkColor;
        end = isTickMarkRightOfThumb ? sliderTheme.inactiveTickMarkColor : sliderTheme.activeTickMarkColor;
        break;
      case TextDirection.rtl:
        final bool isTickMarkLeftOfThumb = center.dx < thumbCenter.dx;
        begin = isTickMarkLeftOfThumb ? sliderTheme.disabledInactiveTickMarkColor : sliderTheme.disabledActiveTickMarkColor;
        end = isTickMarkLeftOfThumb ? sliderTheme.inactiveTickMarkColor : sliderTheme.activeTickMarkColor;
        break;
    }
2079
    final Paint paint = Paint()..color = ColorTween(begin: begin, end: end).evaluate(enableAnimation)!;
2080 2081 2082

    // The tick marks are tiny circles that are the same height as the track.
    final double tickMarkRadius = getPreferredSize(
2083 2084 2085
       isEnabled: isEnabled,
       sliderTheme: sliderTheme,
     ).width / 2;
2086 2087 2088 2089 2090 2091 2092 2093 2094 2095 2096 2097 2098 2099 2100 2101 2102 2103 2104
    if (tickMarkRadius > 0) {
      context.canvas.drawCircle(center, tickMarkRadius, paint);
    }
  }
}

/// The default shape of each [RangeSlider] tick mark.
///
/// Tick marks are only displayed if the slider is discrete, which can be done
/// by setting the [RangeSlider.divisions] to an integer value.
///
/// It paints a solid circle, centered on the track.
/// The color is determined by the [Slider]'s enabled state and track's active
/// states. These colors are defined in:
///   [SliderThemeData.activeTrackColor],
///   [SliderThemeData.inactiveTrackColor],
///   [SliderThemeData.disabledActiveTrackColor],
///   [SliderThemeData.disabledInactiveTrackColor].
///
2105 2106 2107
/// ![A slider widget, consisting of 5 divisions and showing the round range slider tick mark shape.]
/// (https://flutter.github.io/assets-for-api-docs/assets/material/round_range_slider_tick_mark_shape.png )
///
2108 2109 2110 2111 2112 2113 2114
/// See also:
///
///  * [RangeSlider], which includes tick marks defined by this shape.
///  * [SliderTheme], which can be used to configure the tick mark shape of all
///    sliders in a widget subtree.
class RoundRangeSliderTickMarkShape extends RangeSliderTickMarkShape {
  /// Create a range slider tick mark that draws a circle.
2115 2116 2117
  const RoundRangeSliderTickMarkShape({
    this.tickMarkRadius,
  });
2118 2119 2120

  /// The preferred radius of the round tick mark.
  ///
2121
  /// If it is not provided, then 1/4 of the [SliderThemeData.trackHeight] is used.
2122
  final double? tickMarkRadius;
2123 2124 2125

  @override
  Size getPreferredSize({
2126
    required SliderThemeData sliderTheme,
2127 2128 2129 2130 2131
    bool isEnabled = false,
  }) {
    assert(sliderTheme != null);
    assert(sliderTheme.trackHeight != null);
    assert(isEnabled != null);
2132
    return Size.fromRadius(tickMarkRadius ?? sliderTheme.trackHeight! / 4);
2133 2134 2135 2136 2137 2138
  }

  @override
  void paint(
    PaintingContext context,
    Offset center, {
2139 2140 2141 2142 2143
    required RenderBox parentBox,
    required SliderThemeData sliderTheme,
    required Animation<double> enableAnimation,
    required Offset startThumbCenter,
    required Offset endThumbCenter,
2144
    bool isEnabled = false,
2145
    required TextDirection textDirection,
2146 2147 2148 2149 2150 2151 2152 2153 2154 2155 2156 2157 2158 2159 2160
  }) {
    assert(context != null);
    assert(center != null);
    assert(parentBox != null);
    assert(sliderTheme != null);
    assert(sliderTheme.disabledActiveTickMarkColor != null);
    assert(sliderTheme.disabledInactiveTickMarkColor != null);
    assert(sliderTheme.activeTickMarkColor != null);
    assert(sliderTheme.inactiveTickMarkColor != null);
    assert(enableAnimation != null);
    assert(startThumbCenter != null);
    assert(endThumbCenter != null);
    assert(isEnabled != null);
    assert(textDirection != null);

2161
    final bool isBetweenThumbs;
2162 2163 2164 2165 2166 2167 2168 2169
    switch (textDirection) {
      case TextDirection.ltr:
        isBetweenThumbs = startThumbCenter.dx < center.dx && center.dx < endThumbCenter.dx;
        break;
      case TextDirection.rtl:
        isBetweenThumbs = endThumbCenter.dx < center.dx && center.dx < startThumbCenter.dx;
        break;
    }
2170 2171 2172
    final Color? begin = isBetweenThumbs ? sliderTheme.disabledActiveTickMarkColor : sliderTheme.disabledInactiveTickMarkColor;
    final Color? end = isBetweenThumbs ? sliderTheme.activeTickMarkColor : sliderTheme.inactiveTickMarkColor;
    final Paint paint = Paint()..color = ColorTween(begin: begin, end: end).evaluate(enableAnimation)!;
2173 2174 2175 2176 2177 2178 2179 2180 2181 2182 2183 2184 2185 2186 2187 2188 2189 2190 2191 2192 2193 2194

    // The tick marks are tiny circles that are the same height as the track.
    final double tickMarkRadius = getPreferredSize(
      isEnabled: isEnabled,
      sliderTheme: sliderTheme,
    ).width / 2;
    if (tickMarkRadius > 0) {
      context.canvas.drawCircle(center, tickMarkRadius, paint);
    }
  }
}

/// A special version of [SliderTickMarkShape] that has a zero size and paints
/// nothing.
///
/// This class is used to create a special instance of a [SliderTickMarkShape]
/// that will not paint any tick mark shape. A static reference is stored in
/// [SliderTickMarkShape.noTickMark]. When this value is specified for
/// [SliderThemeData.tickMarkShape], the tick mark painting is skipped.
class _EmptySliderTickMarkShape extends SliderTickMarkShape {
  @override
  Size getPreferredSize({
2195 2196
    required SliderThemeData sliderTheme,
    required bool isEnabled,
2197 2198 2199 2200 2201 2202 2203 2204
  }) {
    return Size.zero;
  }

  @override
  void paint(
    PaintingContext context,
    Offset center, {
2205 2206 2207 2208
    required RenderBox parentBox,
    required SliderThemeData sliderTheme,
    required Animation<double> enableAnimation,
    required Offset thumbCenter,
2209
    required bool isEnabled,
2210
    required TextDirection textDirection,
2211 2212 2213 2214 2215 2216 2217 2218 2219 2220 2221 2222
  }) {
    // no-op.
  }
}

/// A special version of [SliderComponentShape] that has a zero size and paints
/// nothing.
///
/// This class is used to create a special instance of a [SliderComponentShape]
/// that will not paint any component shape. A static reference is stored in
/// [SliderTickMarkShape.noThumb] and [SliderTickMarkShape.noOverlay]. When this value
/// is specified for [SliderThemeData.thumbShape], the thumb painting is
2223
/// skipped.  When this value is specified for [SliderThemeData.overlayShape],
2224 2225 2226 2227 2228 2229 2230 2231 2232
/// the overlay painting is skipped.
class _EmptySliderComponentShape extends SliderComponentShape {
  @override
  Size getPreferredSize(bool isEnabled, bool isDiscrete) => Size.zero;

  @override
  void paint(
    PaintingContext context,
    Offset center, {
2233 2234 2235 2236 2237 2238 2239 2240 2241 2242
    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,
2243 2244 2245 2246 2247 2248 2249
  }) {
    // no-op.
  }
}

/// The default shape of a [Slider]'s thumb.
///
2250
/// There is a shadow for the resting, pressed, hovered, and focused state.
2251
///
2252 2253 2254
/// ![A slider widget, consisting of 5 divisions and showing the round slider thumb shape.]
/// (https://flutter.github.io/assets-for-api-docs/assets/material/round_slider_thumb_shape.png)
///
2255 2256 2257 2258 2259 2260 2261 2262 2263 2264
/// See also:
///
///  * [Slider], which includes a thumb defined by this shape.
///  * [SliderTheme], which can be used to configure the thumb shape of all
///    sliders in a widget subtree.
class RoundSliderThumbShape extends SliderComponentShape {
  /// Create a slider thumb that draws a circle.
  const RoundSliderThumbShape({
    this.enabledThumbRadius = 10.0,
    this.disabledThumbRadius,
2265 2266
    this.elevation = 1.0,
    this.pressedElevation = 6.0,
2267 2268 2269 2270 2271 2272 2273 2274 2275 2276 2277
  });

  /// The preferred radius of the round thumb shape when the slider is enabled.
  ///
  /// If it is not provided, then the material default of 10 is used.
  final double enabledThumbRadius;

  /// The preferred radius of the round thumb shape when the slider is disabled.
  ///
  /// If no disabledRadius is provided, then it is equal to the
  /// [enabledThumbRadius]
2278
  final double? disabledThumbRadius;
2279 2280 2281 2282 2283 2284 2285 2286 2287 2288 2289 2290 2291 2292 2293 2294 2295 2296 2297
  double get _disabledThumbRadius => disabledThumbRadius ?? enabledThumbRadius;

  /// The resting elevation adds shadow to the unpressed thumb.
  ///
  /// The default is 1.
  ///
  /// Use 0 for no shadow. The higher the value, the larger the shadow. For
  /// example, a value of 12 will create a very large shadow.
  ///
  final double elevation;

  /// The pressed elevation adds shadow to the pressed thumb.
  ///
  /// The default is 6.
  ///
  /// Use 0 for no shadow. The higher the value, the larger the shadow. For
  /// example, a value of 12 will create a very large shadow.
  final double pressedElevation;

2298 2299 2300
  @override
  Size getPreferredSize(bool isEnabled, bool isDiscrete) {
    return Size.fromRadius(isEnabled == true ? enabledThumbRadius : _disabledThumbRadius);
2301 2302 2303 2304 2305 2306
  }

  @override
  void paint(
    PaintingContext context,
    Offset center, {
2307
    required Animation<double> activationAnimation,
2308
    required Animation<double> enableAnimation,
2309 2310 2311
    required bool isDiscrete,
    required TextPainter labelPainter,
    required RenderBox parentBox,
2312
    required SliderThemeData sliderTheme,
2313 2314 2315 2316
    required TextDirection textDirection,
    required double value,
    required double textScaleFactor,
    required Size sizeWithOverflow,
2317
  }) {
2318 2319 2320
    assert(context != null);
    assert(center != null);
    assert(enableAnimation != null);
2321 2322 2323
    assert(sliderTheme != null);
    assert(sliderTheme.disabledThumbColor != null);
    assert(sliderTheme.thumbColor != null);
2324

2325 2326 2327 2328 2329 2330 2331 2332 2333
    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,
    );
2334

2335
    final Color color = colorTween.evaluate(enableAnimation)!;
2336 2337
    final double radius = radiusTween.evaluate(enableAnimation);

2338 2339 2340 2341 2342
    final Tween<double> elevationTween = Tween<double>(
      begin: elevation,
      end: pressedElevation,
    );

2343
    final double evaluatedElevation = elevationTween.evaluate(activationAnimation);
2344 2345 2346
    final Path path = Path()
      ..addArc(Rect.fromCenter(center: center, width: 2 * radius, height: 2 * radius), 0, math.pi * 2);
    canvas.drawShadow(path, Colors.black, evaluatedElevation, true);
2347

2348 2349
    canvas.drawCircle(
      center,
2350 2351
      radius,
      Paint()..color = color,
2352
    );
2353 2354 2355
  }
}

2356
/// The default shape of a [RangeSlider]'s thumbs.
2357
///
2358
/// There is a shadow for the resting and pressed state.
2359
///
2360 2361 2362
/// ![A slider widget, consisting of 5 divisions and showing the round range slider thumb shape.]
/// (https://flutter.github.io/assets-for-api-docs/assets/material/round_range_slider_thumb_shape.png)
///
2363 2364
/// See also:
///
2365 2366 2367 2368
///  * [RangeSlider], which includes thumbs defined by this shape.
///  * [SliderTheme], which can be used to configure the thumb shapes of all
///    range sliders in a widget subtree.
class RoundRangeSliderThumbShape extends RangeSliderThumbShape {
2369
  /// Create a slider thumb that draws a circle.
2370
  const RoundRangeSliderThumbShape({
2371
    this.enabledThumbRadius = 10.0,
2372
    this.disabledThumbRadius,
2373 2374
    this.elevation = 1.0,
    this.pressedElevation = 6.0,
2375
  }) : assert(enabledThumbRadius != null);
2376 2377 2378

  /// The preferred radius of the round thumb shape when the slider is enabled.
  ///
2379
  /// If it is not provided, then the material default of 10 is used.
2380
  final double enabledThumbRadius;
2381

2382 2383
  /// The preferred radius of the round thumb shape when the slider is disabled.
  ///
2384
  /// If no disabledRadius is provided, then it is equal to the
2385
  /// [enabledThumbRadius].
2386
  final double? disabledThumbRadius;
2387 2388 2389 2390 2391 2392 2393 2394 2395 2396 2397
  double get _disabledThumbRadius => disabledThumbRadius ?? enabledThumbRadius;

  /// The resting elevation adds shadow to the unpressed thumb.
  ///
  /// The default is 1.
  final double elevation;

  /// The pressed elevation adds shadow to the pressed thumb.
  ///
  /// The default is 6.
  final double pressedElevation;
2398 2399 2400

  @override
  Size getPreferredSize(bool isEnabled, bool isDiscrete) {
2401
    return Size.fromRadius(isEnabled == true ? enabledThumbRadius : _disabledThumbRadius);
2402 2403 2404 2405 2406
  }

  @override
  void paint(
    PaintingContext context,
2407
    Offset center, {
2408 2409
    required Animation<double> activationAnimation,
    required Animation<double> enableAnimation,
2410
    bool isDiscrete = false,
2411
    bool isEnabled = false,
2412 2413 2414 2415 2416
    bool? isOnTop,
    required SliderThemeData sliderTheme,
    TextDirection? textDirection,
    Thumb? thumb,
    bool? isPressed,
2417
  }) {
2418 2419 2420 2421
    assert(context != null);
    assert(center != null);
    assert(activationAnimation != null);
    assert(sliderTheme != null);
2422 2423 2424
    assert(sliderTheme.showValueIndicator != null);
    assert(sliderTheme.overlappingShapeStrokeColor != null);
    assert(enableAnimation != null);
2425
    final Canvas canvas = context.canvas;
2426
    final Tween<double> radiusTween = Tween<double>(
2427
      begin: _disabledThumbRadius,
2428
      end: enabledThumbRadius,
2429
    );
2430
    final ColorTween colorTween = ColorTween(
2431 2432 2433
      begin: sliderTheme.disabledThumbColor,
      end: sliderTheme.thumbColor,
    );
2434
    final double radius = radiusTween.evaluate(enableAnimation);
2435 2436 2437 2438
    final Tween<double> elevationTween = Tween<double>(
      begin: elevation,
      end: pressedElevation,
    );
2439 2440 2441 2442

    // Add a stroke of 1dp around the circle if this thumb would overlap
    // the other thumb.
    if (isOnTop == true) {
2443
      final Paint strokePaint = Paint()
2444
        ..color = sliderTheme.overlappingShapeStrokeColor!
2445 2446 2447
        ..strokeWidth = 1.0
        ..style = PaintingStyle.stroke;
      canvas.drawCircle(center, radius, strokePaint);
2448 2449
    }

2450
    final Color color = colorTween.evaluate(enableAnimation)!;
2451

2452
    final double evaluatedElevation = isPressed! ? elevationTween.evaluate(activationAnimation) : elevation;
2453 2454 2455
    final Path shadowPath = Path()
      ..addArc(Rect.fromCenter(center: center, width: 2 * radius, height: 2 * radius), 0, math.pi * 2);
    canvas.drawShadow(shadowPath, Colors.black, evaluatedElevation, true);
2456

2457
    canvas.drawCircle(
2458
      center,
2459
      radius,
2460
      Paint()..color = color,
2461 2462 2463 2464
    );
  }
}

2465
/// The default shape of a [Slider]'s thumb overlay.
2466 2467 2468 2469 2470 2471 2472 2473
///
/// The shape of the overlay is a circle with the same center as the thumb, but
/// with a larger radius. It animates to full size when the thumb is pressed,
/// and animates back down to size 0 when it is released. It is painted behind
/// the thumb, and is expected to extend beyond the bounds of the thumb so that
/// it is visible.
///
/// The overlay color is defined by [SliderThemeData.overlayColor].
2474 2475 2476
///
/// See also:
///
2477 2478 2479 2480 2481
///  * [Slider], which includes an overlay defined by this shape.
///  * [SliderTheme], which can be used to configure the overlay shape of all
///    sliders in a widget subtree.
class RoundSliderOverlayShape extends SliderComponentShape {
  /// Create a slider thumb overlay that draws a circle.
2482
  const RoundSliderOverlayShape({ this.overlayRadius = 24.0 });
2483

2484 2485
  /// The preferred radius of the round thumb shape when enabled.
  ///
2486 2487
  /// If it is not provided, then half of the [SliderThemeData.trackHeight] is
  /// used.
2488
  final double overlayRadius;
2489 2490 2491

  @override
  Size getPreferredSize(bool isEnabled, bool isDiscrete) {
2492
    return Size.fromRadius(overlayRadius);
2493 2494 2495 2496 2497 2498
  }

  @override
  void paint(
    PaintingContext context,
    Offset center, {
2499 2500
    required Animation<double> activationAnimation,
    required Animation<double> enableAnimation,
2501
    required bool isDiscrete,
2502 2503 2504 2505 2506
    required TextPainter labelPainter,
    required RenderBox parentBox,
    required SliderThemeData sliderTheme,
    required TextDirection textDirection,
    required double value,
2507 2508
    required double textScaleFactor,
    required Size sizeWithOverflow,
2509
  }) {
2510 2511 2512 2513 2514 2515 2516 2517 2518
    assert(context != null);
    assert(center != null);
    assert(activationAnimation != null);
    assert(enableAnimation != null);
    assert(labelPainter != null);
    assert(parentBox != null);
    assert(sliderTheme != null);
    assert(textDirection != null);
    assert(value != null);
2519

2520 2521 2522
    final Canvas canvas = context.canvas;
    final Tween<double> radiusTween = Tween<double>(
      begin: 0.0,
2523
      end: overlayRadius,
2524 2525 2526 2527 2528
    );

    canvas.drawCircle(
      center,
      radiusTween.evaluate(activationAnimation),
2529
      Paint()..color = sliderTheme.overlayColor!,
2530 2531 2532 2533
    );
  }
}

2534
/// The default shape of a [Slider]'s value indicator.
2535
///
2536 2537 2538
/// ![A slider widget, consisting of 5 divisions and showing the rectangular slider value indicator shape.]
/// (https://flutter.github.io/assets-for-api-docs/assets/material/rectangular_slider_value_indicator_shape.png)
///
2539 2540 2541 2542 2543
/// See also:
///
///  * [Slider], which includes a value indicator defined by this shape.
///  * [SliderTheme], which can be used to configure the slider value indicator
///    of all sliders in a widget subtree.
2544 2545 2546 2547 2548 2549 2550 2551 2552 2553
class RectangularSliderValueIndicatorShape extends SliderComponentShape {
  /// Create a slider value indicator that resembles a rectangular tooltip.
  const RectangularSliderValueIndicatorShape();

  static const _RectangularSliderValueIndicatorPathPainter _pathPainter = _RectangularSliderValueIndicatorPathPainter();

  @override
  Size getPreferredSize(
     bool isEnabled,
     bool isDiscrete, {
2554 2555
     TextPainter? labelPainter,
     double? textScaleFactor,
2556 2557 2558
  }) {
     assert(labelPainter != null);
     assert(textScaleFactor != null && textScaleFactor >= 0);
2559
     return _pathPainter.getPreferredSize(labelPainter!, textScaleFactor!);
2560 2561 2562 2563 2564 2565
  }

  @override
  void paint(
    PaintingContext context,
    Offset center, {
2566 2567 2568 2569
    required Animation<double> activationAnimation,
    required Animation<double> enableAnimation,
    required bool isDiscrete,
    required TextPainter labelPainter,
2570
    required RenderBox parentBox,
2571 2572 2573 2574 2575
    required SliderThemeData sliderTheme,
    required TextDirection textDirection,
    required double value,
    required double textScaleFactor,
    required Size sizeWithOverflow,
2576 2577
  }) {
    final Canvas canvas = context.canvas;
2578
    final double scale = activationAnimation.value;
2579 2580 2581 2582 2583
    _pathPainter.paint(
      parentBox: parentBox,
      canvas: canvas,
      center: center,
      scale: scale,
2584 2585 2586
      labelPainter: labelPainter,
      textScaleFactor: textScaleFactor,
      sizeWithOverflow: sizeWithOverflow,
2587 2588
      backgroundPaintColor: sliderTheme.valueIndicatorColor!,
    );
2589 2590 2591 2592 2593
  }
}

/// The default shape of a [RangeSlider]'s value indicators.
///
2594 2595 2596
/// ![A slider widget, consisting of 5 divisions and showing the rectangular range slider value indicator shape.]
/// (https://flutter.github.io/assets-for-api-docs/assets/material/rectangular_range_slider_value_indicator_shape.png)
///
2597 2598 2599 2600 2601 2602 2603 2604 2605 2606 2607 2608 2609 2610 2611 2612
/// See also:
///
///  * [RangeSlider], which includes value indicators defined by this shape.
///  * [SliderTheme], which can be used to configure the range slider value
///    indicator of all sliders in a widget subtree.
class RectangularRangeSliderValueIndicatorShape
    extends RangeSliderValueIndicatorShape {
  /// Create a range slider value indicator that resembles a rectangular tooltip.
  const RectangularRangeSliderValueIndicatorShape();

  static const _RectangularSliderValueIndicatorPathPainter _pathPainter = _RectangularSliderValueIndicatorPathPainter();

  @override
  Size getPreferredSize(
    bool isEnabled,
    bool isDiscrete, {
2613 2614
    required TextPainter labelPainter,
    required double textScaleFactor,
2615 2616 2617
  }) {
    assert(labelPainter != null);
    assert(textScaleFactor != null && textScaleFactor >= 0);
2618
    return _pathPainter.getPreferredSize(labelPainter, textScaleFactor);
2619 2620 2621 2622
  }

  @override
  double getHorizontalShift({
2623 2624 2625 2626 2627 2628
    RenderBox? parentBox,
    Offset? center,
    TextPainter? labelPainter,
    Animation<double>? activationAnimation,
    double? textScaleFactor,
    Size? sizeWithOverflow,
2629 2630
  }) {
    return _pathPainter.getHorizontalShift(
2631 2632 2633 2634 2635 2636
      parentBox: parentBox!,
      center: center!,
      labelPainter: labelPainter!,
      textScaleFactor: textScaleFactor!,
      sizeWithOverflow: sizeWithOverflow!,
      scale: activationAnimation!.value,
2637 2638 2639 2640 2641 2642 2643
    );
  }

  @override
  void paint(
    PaintingContext context,
    Offset center, {
2644 2645 2646 2647 2648 2649 2650 2651 2652 2653 2654 2655
    Animation<double>? activationAnimation,
    Animation<double>? enableAnimation,
    bool? isDiscrete,
    bool? isOnTop,
    TextPainter? labelPainter,
    double? textScaleFactor,
    Size? sizeWithOverflow,
    RenderBox? parentBox,
    SliderThemeData? sliderTheme,
    TextDirection? textDirection,
    double? value,
    Thumb? thumb,
2656 2657
  }) {
    final Canvas canvas = context.canvas;
2658
    final double scale = activationAnimation!.value;
2659
    _pathPainter.paint(
2660
      parentBox: parentBox!,
2661 2662 2663
      canvas: canvas,
      center: center,
      scale: scale,
2664 2665 2666 2667 2668
      labelPainter: labelPainter!,
      textScaleFactor: textScaleFactor!,
      sizeWithOverflow: sizeWithOverflow!,
      backgroundPaintColor: sliderTheme!.valueIndicatorColor!,
      strokePaintColor: isOnTop! ? sliderTheme.overlappingShapeStrokeColor : null,
2669 2670 2671 2672 2673 2674 2675 2676 2677 2678 2679 2680 2681 2682 2683 2684 2685 2686 2687 2688 2689 2690 2691 2692 2693 2694 2695
    );
  }
}

class _RectangularSliderValueIndicatorPathPainter {
  const _RectangularSliderValueIndicatorPathPainter();

  static const double _triangleHeight = 8.0;
  static const double _labelPadding = 16.0;
  static const double _preferredHeight = 32.0;
  static const double _minLabelWidth = 16.0;
  static const double _bottomTipYOffset = 14.0;
  static const double _preferredHalfHeight = _preferredHeight / 2;
  static const double _upperRectRadius = 4;

  Size getPreferredSize(
    TextPainter labelPainter,
    double textScaleFactor,
  ) {
    assert(labelPainter != null);
    return Size(
      _upperRectangleWidth(labelPainter, 1, textScaleFactor),
      labelPainter.height + _labelPadding,
    );
  }

  double getHorizontalShift({
2696 2697 2698 2699 2700 2701
    required RenderBox parentBox,
    required Offset center,
    required TextPainter labelPainter,
    required double textScaleFactor,
    required Size sizeWithOverflow,
    required double scale,
2702 2703
  }) {
    assert(!sizeWithOverflow.isEmpty);
2704

2705 2706
    const double edgePadding = 8.0;
    final double rectangleWidth = _upperRectangleWidth(labelPainter, scale, textScaleFactor);
2707 2708 2709
    /// Value indicator draws on the Overlay and by using the global Offset
    /// we are making sure we use the bounds of the Overlay instead of the Slider.
    final Offset globalCenter = parentBox.localToGlobal(center);
2710 2711 2712 2713 2714

    // The rectangle must be shifted towards the center so that it minimizes the
    // chance of it rendering outside the bounds of the render box. If the shift
    // is negative, then the lobe is shifted from right to left, and if it is
    // positive, then the lobe is shifted from left to right.
2715 2716
    final double overflowLeft = math.max(0, rectangleWidth / 2 - globalCenter.dx + edgePadding);
    final double overflowRight = math.max(0, rectangleWidth / 2 - (sizeWithOverflow.width - globalCenter.dx - edgePadding));
2717 2718 2719 2720 2721 2722 2723 2724 2725 2726 2727 2728 2729 2730 2731 2732

    if (rectangleWidth < sizeWithOverflow.width) {
      return overflowLeft - overflowRight;
    } else if (overflowLeft - overflowRight > 0) {
      return overflowLeft - (edgePadding * textScaleFactor);
    } else {
      return -overflowRight + (edgePadding * textScaleFactor);
    }
  }

  double _upperRectangleWidth(TextPainter labelPainter, double scale, double textScaleFactor) {
    final double unscaledWidth = math.max(_minLabelWidth * textScaleFactor, labelPainter.width) + _labelPadding * 2;
    return unscaledWidth * scale;
  }

  void paint({
2733 2734 2735 2736 2737 2738 2739 2740 2741
    required RenderBox parentBox,
    required Canvas canvas,
    required Offset center,
    required double scale,
    required TextPainter labelPainter,
    required double textScaleFactor,
    required Size sizeWithOverflow,
    required Color backgroundPaintColor,
    Color? strokePaintColor,
2742 2743 2744 2745 2746 2747 2748 2749 2750 2751 2752 2753 2754 2755 2756 2757 2758 2759 2760 2761 2762 2763 2764 2765 2766 2767 2768 2769 2770 2771 2772 2773 2774 2775 2776 2777 2778 2779 2780 2781 2782 2783 2784 2785 2786 2787 2788 2789 2790 2791 2792 2793 2794 2795 2796 2797 2798 2799 2800 2801 2802
  }) {
    if (scale == 0.0) {
      // Zero scale essentially means "do not draw anything", so it's safe to just return.
      return;
    }
    assert(!sizeWithOverflow.isEmpty);

    final double rectangleWidth = _upperRectangleWidth(labelPainter, scale, textScaleFactor);
    final double horizontalShift = getHorizontalShift(
      parentBox: parentBox,
      center: center,
      labelPainter: labelPainter,
      textScaleFactor: textScaleFactor,
      sizeWithOverflow: sizeWithOverflow,
      scale: scale,
    );

    final double rectHeight = labelPainter.height + _labelPadding;
    final Rect upperRect = Rect.fromLTWH(
      -rectangleWidth / 2 + horizontalShift,
      -_triangleHeight - rectHeight,
      rectangleWidth,
      rectHeight,
    );

    final Path trianglePath = Path()
      ..lineTo(-_triangleHeight, -_triangleHeight)
      ..lineTo(_triangleHeight, -_triangleHeight)
      ..close();
    final Paint fillPaint = Paint()..color = backgroundPaintColor;
    final RRect upperRRect = RRect.fromRectAndRadius(upperRect, const Radius.circular(_upperRectRadius));
    trianglePath.addRRect(upperRRect);

    canvas.save();
    // Prepare the canvas for the base of the tooltip, which is relative to the
    // center of the thumb.
    canvas.translate(center.dx, center.dy - _bottomTipYOffset);
    canvas.scale(scale, scale);
    if (strokePaintColor != null) {
      final Paint strokePaint = Paint()
        ..color = strokePaintColor
        ..strokeWidth = 1.0
        ..style = PaintingStyle.stroke;
      canvas.drawPath(trianglePath, strokePaint);
    }
    canvas.drawPath(trianglePath, fillPaint);

    // The label text is centered within the value indicator.
    final double bottomTipToUpperRectTranslateY = -_preferredHalfHeight / 2 - upperRect.height;
    canvas.translate(0, bottomTipToUpperRectTranslateY);
    final Offset boxCenter = Offset(horizontalShift, upperRect.height / 2);
    final Offset halfLabelPainterOffset = Offset(labelPainter.width / 2, labelPainter.height / 2);
    final Offset labelOffset = boxCenter - halfLabelPainterOffset;
    labelPainter.paint(canvas, labelOffset);
    canvas.restore();
  }
}

/// A variant shape of a [Slider]'s value indicator . The value indicator is in
/// the shape of an upside-down pear.
///
2803 2804 2805
/// ![A slider widget, consisting of 5 divisions and showing the paddle slider value indicator shape.]
/// (https://flutter.github.io/assets-for-api-docs/assets/material/paddle_slider_value_indicator_shape.png)
///
2806 2807 2808 2809 2810
/// See also:
///
///  * [Slider], which includes a value indicator defined by this shape.
///  * [SliderTheme], which can be used to configure the slider value indicator
///    of all sliders in a widget subtree.
2811
class PaddleSliderValueIndicatorShape extends SliderComponentShape {
2812
  /// Create a slider value indicator in the shape of an upside-down pear.
2813 2814
  const PaddleSliderValueIndicatorShape();

2815
  static const _PaddleSliderValueIndicatorPathPainter _pathPainter = _PaddleSliderValueIndicatorPathPainter();
2816 2817

  @override
2818 2819 2820 2821 2822 2823
  Size getPreferredSize(
    bool isEnabled,
    bool isDiscrete, {
    TextPainter? labelPainter,
    double? textScaleFactor,
  }) {
2824
    assert(labelPainter != null);
2825
    assert(textScaleFactor != null && textScaleFactor >= 0);
2826
    return _pathPainter.getPreferredSize(labelPainter!, textScaleFactor!);
2827 2828 2829 2830 2831 2832
  }

  @override
  void paint(
    PaintingContext context,
    Offset center, {
2833 2834 2835 2836 2837 2838 2839 2840 2841 2842
    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,
2843 2844 2845 2846 2847 2848 2849 2850
  }) {
    assert(context != null);
    assert(center != null);
    assert(activationAnimation != null);
    assert(enableAnimation != null);
    assert(labelPainter != null);
    assert(parentBox != null);
    assert(sliderTheme != null);
2851
    assert(!sizeWithOverflow.isEmpty);
2852
    final ColorTween enableColor = ColorTween(
2853
      begin: sliderTheme.disabledThumbColor,
2854 2855
      end: sliderTheme.valueIndicatorColor,
    );
2856
    _pathPainter.paint(
2857 2858
      context.canvas,
      center,
2859 2860 2861 2862 2863
      Paint()..color = enableColor.evaluate(enableAnimation)!,
      activationAnimation.value,
      labelPainter,
      textScaleFactor,
      sizeWithOverflow,
2864 2865 2866 2867 2868
      null,
    );
  }
}

2869 2870
/// A variant shape of a [RangeSlider]'s value indicators. The value indicator
/// is in the shape of an upside-down pear.
2871
///
2872 2873 2874
/// ![A slider widget, consisting of 5 divisions and showing the paddle range slider value indicator shape.]
/// (https://flutter.github.io/assets-for-api-docs/assets/material/paddle_range_slider_value_indicator_shape.png)
///
2875 2876 2877 2878 2879 2880 2881 2882 2883
/// See also:
///
///  * [RangeSlider], which includes value indicators defined by this shape.
///  * [SliderTheme], which can be used to configure the range slider value
///    indicator of all sliders in a widget subtree.
class PaddleRangeSliderValueIndicatorShape extends RangeSliderValueIndicatorShape {
  /// Create a slider value indicator in the shape of an upside-down pear.
  const PaddleRangeSliderValueIndicatorShape();

2884
  static const _PaddleSliderValueIndicatorPathPainter _pathPainter = _PaddleSliderValueIndicatorPathPainter();
2885 2886

  @override
2887 2888 2889
  Size getPreferredSize(
    bool isEnabled,
    bool isDiscrete, {
2890 2891
    required TextPainter labelPainter,
    required double textScaleFactor,
2892
  }) {
2893
    assert(labelPainter != null);
2894
    assert(textScaleFactor != null && textScaleFactor >= 0);
2895
    return _pathPainter.getPreferredSize(labelPainter, textScaleFactor);
2896 2897
  }

2898 2899
  @override
  double getHorizontalShift({
2900 2901 2902 2903 2904 2905
    RenderBox? parentBox,
    Offset? center,
    TextPainter? labelPainter,
    Animation<double>? activationAnimation,
    double? textScaleFactor,
    Size? sizeWithOverflow,
2906 2907
  }) {
    return _pathPainter.getHorizontalShift(
2908 2909 2910 2911 2912
      center: center!,
      labelPainter: labelPainter!,
      scale: activationAnimation!.value,
      textScaleFactor: textScaleFactor!,
      sizeWithOverflow: sizeWithOverflow!,
2913 2914 2915
    );
  }

2916 2917 2918 2919
  @override
  void paint(
    PaintingContext context,
    Offset center, {
2920 2921 2922
    required Animation<double> activationAnimation,
    required Animation<double> enableAnimation,
    bool? isDiscrete,
2923
    bool isOnTop = false,
2924 2925 2926 2927 2928 2929 2930 2931
    required TextPainter labelPainter,
    required RenderBox parentBox,
    required SliderThemeData sliderTheme,
    TextDirection? textDirection,
    Thumb? thumb,
    double? value,
    double? textScaleFactor,
    Size? sizeWithOverflow,
2932 2933 2934 2935 2936 2937 2938 2939
  }) {
    assert(context != null);
    assert(center != null);
    assert(activationAnimation != null);
    assert(enableAnimation != null);
    assert(labelPainter != null);
    assert(parentBox != null);
    assert(sliderTheme != null);
2940
    assert(!sizeWithOverflow!.isEmpty);
2941 2942 2943 2944 2945
    final ColorTween enableColor = ColorTween(
      begin: sliderTheme.disabledThumbColor,
      end: sliderTheme.valueIndicatorColor,
    );
    // Add a stroke of 1dp around the top paddle.
2946
    _pathPainter.paint(
2947 2948
      context.canvas,
      center,
2949
      Paint()..color = enableColor.evaluate(enableAnimation)!,
2950 2951
      activationAnimation.value,
      labelPainter,
2952 2953
      textScaleFactor!,
      sizeWithOverflow!,
2954 2955 2956 2957 2958
      isOnTop ? sliderTheme.overlappingShapeStrokeColor : null,
    );
  }
}

2959 2960
class _PaddleSliderValueIndicatorPathPainter {
  const _PaddleSliderValueIndicatorPathPainter();
2961

2962 2963 2964 2965 2966 2967 2968 2969
  // These constants define the shape of the default value indicator.
  // The value indicator changes shape based on the size of
  // the label: The top lobe spreads horizontally, and the
  // top arc on the neck moves down to keep it merging smoothly
  // with the top lobe as it expands.

  // Radius of the top lobe of the value indicator.
  static const double _topLobeRadius = 16.0;
2970
  static const double _minLabelWidth = 16.0;
2971
  // Radius of the bottom lobe of the value indicator.
2972
  static const double _bottomLobeRadius = 10.0;
2973 2974
  static const double _labelPadding = 8.0;
  static const double _distanceBetweenTopBottomCenters = 40.0;
2975
  static const double _middleNeckWidth = 3.0;
2976 2977 2978 2979 2980 2981
  static const double _bottomNeckRadius = 4.5;
  // The base of the triangle between the top lobe center and the centers of
  // the two top neck arcs.
  static const double _neckTriangleBase = _topNeckRadius + _middleNeckWidth / 2;
  static const double _rightBottomNeckCenterX = _middleNeckWidth / 2 + _bottomNeckRadius;
  static const double _rightBottomNeckAngleStart = math.pi;
2982
  static const Offset _topLobeCenter = Offset(0.0, -_distanceBetweenTopBottomCenters);
2983
  static const double _topNeckRadius = 13.0;
2984 2985 2986 2987 2988 2989 2990 2991
  // The length of the hypotenuse of the triangle formed by the center
  // of the left top lobe arc and the center of the top left neck arc.
  // Used to calculate the position of the center of the arc.
  static const double _neckTriangleHypotenuse = _topLobeRadius + _topNeckRadius;
  // Some convenience values to help readability.
  static const double _twoSeventyDegrees = 3.0 * math.pi / 2.0;
  static const double _ninetyDegrees = math.pi / 2.0;
  static const double _thirtyDegrees = math.pi / 6.0;
2992
  static const double _preferredHeight = _distanceBetweenTopBottomCenters + _topLobeRadius + _bottomLobeRadius;
2993 2994 2995 2996 2997
  // Set to true if you want a rectangle to be drawn around the label bubble.
  // This helps with building tests that check that the label draws in the right
  // place (because it prints the rect in the failed test output). It should not
  // be checked in while set to "true".
  static const bool _debuggingLabelLocation = false;
2998

2999 3000
  Size getPreferredSize(
    TextPainter labelPainter,
3001
    double textScaleFactor,
3002 3003
  ) {
    assert(labelPainter != null);
3004 3005 3006
    assert(textScaleFactor != null && textScaleFactor >= 0);
    final double width = math.max(_minLabelWidth * textScaleFactor, labelPainter.width) + _labelPadding * 2 * textScaleFactor;
    return Size(width, _preferredHeight * textScaleFactor);
3007
  }
3008 3009 3010 3011

  // Adds an arc to the path that has the attributes passed in. This is
  // a convenience to make adding arcs have less boilerplate.
  static void _addArc(Path path, Offset center, double radius, double startAngle, double endAngle) {
3012
    assert(center.isFinite);
3013
    final Rect arcRect = Rect.fromCircle(center: center, radius: radius);
3014 3015 3016
    path.arcTo(arcRect, startAngle, endAngle - startAngle, false);
  }

3017
  double getHorizontalShift({
3018 3019 3020 3021 3022
    required Offset center,
    required TextPainter labelPainter,
    required double scale,
    required double textScaleFactor,
    required Size sizeWithOverflow,
3023
  }) {
3024
    assert(!sizeWithOverflow.isEmpty);
3025 3026 3027 3028 3029
    final double inverseTextScale = textScaleFactor != 0 ? 1.0 / textScaleFactor : 0.0;
    final double labelHalfWidth = labelPainter.width / 2.0;
    final double halfWidthNeeded = math.max(
      0.0,
      inverseTextScale * labelHalfWidth - (_topLobeRadius - _labelPadding),
3030
    );
3031
    final double shift = _getIdealOffset(halfWidthNeeded, textScaleFactor * scale, center, sizeWithOverflow.width);
3032
    return shift * textScaleFactor;
3033 3034
  }

3035 3036
  // Determines the "best" offset to keep the bubble within the slider. The
  // calling code will bound that with the available movement in the paddle shape.
3037 3038 3039 3040
  double _getIdealOffset(
    double halfWidthNeeded,
    double scale,
    Offset center,
3041
    double widthWithOverflow,
3042
  ) {
3043
    const double edgeMargin = 8.0;
3044
    final Rect topLobeRect = Rect.fromLTWH(
3045 3046 3047 3048 3049 3050 3051 3052 3053 3054
      -_topLobeRadius - halfWidthNeeded,
      -_topLobeRadius - _distanceBetweenTopBottomCenters,
      2.0 * (_topLobeRadius + halfWidthNeeded),
      2.0 * _topLobeRadius,
    );
    // We can just multiply by scale instead of a transform, since we're scaling
    // around (0, 0).
    final Offset topLeft = (topLobeRect.topLeft * scale) + center;
    final Offset bottomRight = (topLobeRect.bottomRight * scale) + center;
    double shift = 0.0;
3055

3056 3057
    if (topLeft.dx < edgeMargin) {
      shift = edgeMargin - topLeft.dx;
3058
    }
3059

3060
    final double endGlobal = widthWithOverflow;
3061 3062
    if (bottomRight.dx > endGlobal - edgeMargin) {
      shift = endGlobal - edgeMargin - bottomRight.dx;
3063
    }
3064

3065
    shift = scale == 0.0 ? 0.0 : shift / scale;
3066 3067 3068 3069 3070 3071 3072
    if (shift < 0.0) {
      // Shifting to the left.
      shift = math.max(shift, -halfWidthNeeded);
    } else {
      // Shifting to the right.
      shift = math.min(shift, halfWidthNeeded);
    }
3073 3074 3075
    return shift;
  }

3076
  void paint(
3077 3078 3079 3080 3081
    Canvas canvas,
    Offset center,
    Paint paint,
    double scale,
    TextPainter labelPainter,
3082 3083
    double textScaleFactor,
    Size sizeWithOverflow,
3084
    Color? strokePaintColor,
3085
  ) {
3086 3087 3088 3089 3090
    if (scale == 0.0) {
      // Zero scale essentially means "do not draw anything", so it's safe to just return. Otherwise,
      // our math below will attempt to divide by zero and send needless NaNs to the engine.
      return;
    }
3091
    assert(!sizeWithOverflow.isEmpty);
3092

3093
    // The entire value indicator should scale with the size of the label,
3094
    // to keep it large enough to encompass the label text.
3095 3096
    final double overallScale = scale * textScaleFactor;
    final double inverseTextScale = textScaleFactor != 0 ? 1.0 / textScaleFactor : 0.0;
3097 3098
    final double labelHalfWidth = labelPainter.width / 2.0;

3099 3100 3101 3102 3103 3104 3105 3106 3107 3108 3109 3110 3111 3112 3113 3114 3115 3116 3117 3118 3119 3120 3121 3122 3123 3124 3125 3126 3127 3128
    canvas.save();
    canvas.translate(center.dx, center.dy);
    canvas.scale(overallScale, overallScale);

    final double bottomNeckTriangleHypotenuse = _bottomNeckRadius + _bottomLobeRadius / overallScale;
    final double rightBottomNeckCenterY = -math.sqrt(math.pow(bottomNeckTriangleHypotenuse, 2) - math.pow(_rightBottomNeckCenterX, 2));
    final double rightBottomNeckAngleEnd = math.pi + math.atan(rightBottomNeckCenterY / _rightBottomNeckCenterX);
    final Path path = Path()..moveTo(_middleNeckWidth / 2, rightBottomNeckCenterY);
    _addArc(
      path,
      Offset(_rightBottomNeckCenterX, rightBottomNeckCenterY),
      _bottomNeckRadius,
      _rightBottomNeckAngleStart,
      rightBottomNeckAngleEnd,
    );
    _addArc(
      path,
      Offset.zero,
      _bottomLobeRadius / overallScale,
      rightBottomNeckAngleEnd - math.pi,
      2 * math.pi - rightBottomNeckAngleEnd,
    );
    _addArc(
      path,
      Offset(-_rightBottomNeckCenterX, rightBottomNeckCenterY),
      _bottomNeckRadius,
      math.pi - rightBottomNeckAngleEnd,
      0,
    );

3129 3130
    // This is the needed extra width for the label.  It is only positive when
    // the label exceeds the minimum size contained by the round top lobe.
3131 3132 3133 3134 3135
    final double halfWidthNeeded = math.max(
      0.0,
      inverseTextScale * labelHalfWidth - (_topLobeRadius - _labelPadding),
    );

3136
    final double shift = _getIdealOffset( halfWidthNeeded, overallScale, center, sizeWithOverflow.width);
3137 3138
    final double leftWidthNeeded = halfWidthNeeded - shift;
    final double rightWidthNeeded = halfWidthNeeded + shift;
3139

3140 3141
    // The parameter that describes how far along the transition from round to
    // stretched we are.
3142 3143
    final double leftAmount = math.max(0.0, math.min(1.0, leftWidthNeeded / _neckTriangleBase));
    final double rightAmount = math.max(0.0, math.min(1.0, rightWidthNeeded / _neckTriangleBase));
3144
    // The angle between the top neck arc's center and the top lobe's center
3145 3146
    // and vertical. The base amount is chosen so that the neck is smooth,
    // even when the lobe is shifted due to its size.
3147 3148
    final double leftTheta = (1.0 - leftAmount) * _thirtyDegrees;
    final double rightTheta = (1.0 - rightAmount) * _thirtyDegrees;
3149
    // The center of the top left neck arc.
3150 3151
    final Offset leftTopNeckCenter = Offset(
      -_neckTriangleBase,
3152 3153
      _topLobeCenter.dy + math.cos(leftTheta) * _neckTriangleHypotenuse,
    );
3154
    final Offset neckRightCenter = Offset(
3155
      _neckTriangleBase,
3156 3157 3158 3159
      _topLobeCenter.dy + math.cos(rightTheta) * _neckTriangleHypotenuse,
    );
    final double leftNeckArcAngle = _ninetyDegrees - leftTheta;
    final double rightNeckArcAngle = math.pi + _ninetyDegrees - rightTheta;
3160 3161 3162
    // The distance between the end of the bottom neck arc and the beginning of
    // the top neck arc. We use this to shrink/expand it based on the scale
    // factor of the value indicator.
3163
    final double neckStretchBaseline = math.max(0.0, rightBottomNeckCenterY - math.max(leftTopNeckCenter.dy, neckRightCenter.dy));
3164
    final double t = math.pow(inverseTextScale, 3.0) as double;
3165
    final double stretch = (neckStretchBaseline * t).clamp(0.0, 10.0 * neckStretchBaseline);
3166
    final Offset neckStretch = Offset(0.0, neckStretchBaseline - stretch);
3167

3168 3169 3170 3171 3172 3173 3174 3175 3176 3177 3178 3179 3180 3181 3182 3183
    assert(!_debuggingLabelLocation || () {
      final Offset leftCenter = _topLobeCenter - Offset(leftWidthNeeded, 0.0) + neckStretch;
      final Offset rightCenter = _topLobeCenter + Offset(rightWidthNeeded, 0.0) + neckStretch;
      final Rect valueRect = Rect.fromLTRB(
        leftCenter.dx - _topLobeRadius,
        leftCenter.dy - _topLobeRadius,
        rightCenter.dx + _topLobeRadius,
        rightCenter.dy + _topLobeRadius,
      );
      final Paint outlinePaint = Paint()
        ..color = const Color(0xffff0000)
        ..style = PaintingStyle.stroke
        ..strokeWidth = 1.0;
      canvas.drawRect(valueRect, outlinePaint);
      return true;
    }());
3184

3185 3186
    _addArc(
      path,
3187
      leftTopNeckCenter + neckStretch,
3188 3189
      _topNeckRadius,
      0.0,
3190 3191 3192 3193
      -leftNeckArcAngle,
    );
    _addArc(
      path,
3194
      _topLobeCenter - Offset(leftWidthNeeded, 0.0) + neckStretch,
3195 3196 3197 3198 3199 3200
      _topLobeRadius,
      _ninetyDegrees + leftTheta,
      _twoSeventyDegrees,
    );
    _addArc(
      path,
3201
      _topLobeCenter + Offset(rightWidthNeeded, 0.0) + neckStretch,
3202 3203 3204
      _topLobeRadius,
      _twoSeventyDegrees,
      _twoSeventyDegrees + math.pi - rightTheta,
3205 3206 3207
    );
    _addArc(
      path,
3208
      neckRightCenter + neckStretch,
3209
      _topNeckRadius,
3210
      rightNeckArcAngle,
3211 3212
      math.pi,
    );
3213 3214 3215 3216 3217 3218 3219 3220 3221

    if (strokePaintColor != null) {
      final Paint strokePaint = Paint()
        ..color = strokePaintColor
        ..strokeWidth = 1.0
        ..style = PaintingStyle.stroke;
      canvas.drawPath(path, strokePaint);
    }

3222 3223 3224 3225
    canvas.drawPath(path, paint);

    // Draw the label.
    canvas.save();
3226
    canvas.translate(shift, -_distanceBetweenTopBottomCenters + neckStretch.dy);
3227
    canvas.scale(inverseTextScale, inverseTextScale);
3228
    labelPainter.paint(canvas, Offset.zero - Offset(labelHalfWidth, labelPainter.height / 2.0));
3229 3230 3231
    canvas.restore();
    canvas.restore();
  }
3232
}
3233

3234
/// A callback that formats a numeric value from a [Slider] or [RangeSlider] widget.
3235 3236 3237
///
/// See also:
///
3238
///  * [Slider.semanticFormatterCallback], which shows an example use case.
3239
///  * [RangeSlider.semanticFormatterCallback], which shows an example use case.
3240
typedef SemanticFormatterCallback = String Function(double value);
3241 3242 3243 3244 3245 3246 3247

/// Decides which thumbs (if any) should be selected.
///
/// The default finds the closest thumb, but if the thumbs are close to each
/// other, it waits for movement defined by [dx] to determine the selected
/// thumb.
///
3248
/// Override [SliderThemeData.thumbSelector] for custom thumb selection.
3249
typedef RangeThumbSelector = Thumb? Function(
3250 3251 3252 3253 3254 3255 3256
  TextDirection textDirection,
  RangeValues values,
  double tapValue,
  Size thumbSize,
  Size trackSize,
  double dx,
);
3257 3258 3259 3260

/// Object for representing range slider thumb values.
///
/// This object is passed into [RangeSlider.values] to set its values, and it
3261
/// is emitted in [RangeSlider.onChanged], [RangeSlider.onChangeStart], and
3262
/// [RangeSlider.onChangeEnd] when the values change.
3263
@immutable
3264 3265 3266 3267 3268 3269 3270 3271 3272 3273 3274 3275 3276 3277 3278 3279 3280 3281 3282 3283
class RangeValues {
  /// Creates pair of start and end values.
  const RangeValues(this.start, this.end);

  /// The value of the start thumb.
  ///
  /// For LTR text direction, the start is the left thumb, and for RTL text
  /// direction, the start is the right thumb.
  final double start;

  /// The value of the end thumb.
  ///
  /// For LTR text direction, the end is the right thumb, and for RTL text
  /// direction, the end is the left thumb.
  final double end;

  @override
  bool operator ==(Object other) {
    if (other.runtimeType != runtimeType)
      return false;
3284 3285 3286
    return other is RangeValues
        && other.start == start
        && other.end == end;
3287 3288 3289 3290 3291 3292 3293
  }

  @override
  int get hashCode => hashValues(start, end);

  @override
  String toString() {
3294
    return '${objectRuntimeType(this, 'RangeValues')}($start, $end)';
3295 3296 3297 3298 3299 3300
  }
}

/// Object for setting range slider label values that appear in the value
/// indicator for each thumb.
///
3301
/// Used in combination with [SliderThemeData.showValueIndicator] to display
3302
/// labels above the thumbs.
3303
@immutable
3304 3305 3306 3307 3308 3309 3310 3311 3312 3313 3314 3315 3316 3317 3318 3319 3320 3321 3322 3323
class RangeLabels {
  /// Creates pair of start and end labels.
  const RangeLabels(this.start, this.end);

  /// The label of the start thumb.
  ///
  /// For LTR text direction, the start is the left thumb, and for RTL text
  /// direction, the start is the right thumb.
  final String start;

  /// The label of the end thumb.
  ///
  /// For LTR text direction, the end is the right thumb, and for RTL text
  /// direction, the end is the left thumb.
  final String end;

  @override
  bool operator ==(Object other) {
    if (other.runtimeType != runtimeType)
      return false;
3324 3325 3326
    return other is RangeLabels
        && other.start == start
        && other.end == end;
3327 3328 3329 3330 3331 3332 3333
  }

  @override
  int get hashCode => hashValues(start, end);

  @override
  String toString() {
3334
    return '${objectRuntimeType(this, 'RangeLabels')}($start, $end)';
3335
  }
3336
}