slider_theme.dart 131 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
import 'material_state.dart';
14 15
import 'theme.dart';

16 17 18 19 20 21 22 23 24 25 26 27
/// 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,
28
/// and the [SliderTickMarkShape.getPreferredSize] of the tick mark shape.
29 30 31 32 33
///
/// See also:
///
///  * [SliderThemeData], which describes the actual configuration of a slider
///    theme.
34 35 36 37 38 39 40 41 42 43 44 45 46 47 48
///  * [SliderComponentShape], which can be used to create custom shapes for
///    the [Slider]'s thumb, overlay, and value indicator and the
///    [RangeSlider]'s overlay.
///  * [SliderTrackShape], which can be used to create custom shapes for the
///    [Slider]'s track.
///  * [SliderTickMarkShape], which can be used to create custom shapes for the
///    [Slider]'s tick marks.
///  * [RangeSliderThumbShape], which can be used to create custom shapes for
///    the [RangeSlider]'s thumb.
///  * [RangeSliderValueIndicatorShape], which can be used to create custom
///    shapes for the [RangeSlider]'s value indicator.
///  * [RangeSliderTrackShape], which can be used to create custom shapes for
///    the [RangeSlider]'s track.
///  * [RangeSliderTickMarkShape], which can be used to create custom shapes for
///    the [RangeSlider]'s tick marks.
49
class SliderTheme extends InheritedTheme {
50 51 52 53
  /// Applies the given theme [data] to [child].
  ///
  /// The [data] and [child] arguments must not be null.
  const SliderTheme({
54 55 56
    Key? key,
    required this.data,
    required Widget child,
57 58 59
  }) : assert(child != null),
       assert(data != null),
       super(key: key, child: child);
60 61 62 63 64 65 66 67 68 69

  /// 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.
  ///
70
  /// {@tool snippet}
71 72
  ///
  /// ```dart
73
  /// class Launch extends StatefulWidget {
74 75
  ///   const Launch({Key? key}) : super(key: key);
  ///
76
  ///   @override
77
  ///   State createState() => LaunchState();
78
  /// }
79
  ///
80
  /// class LaunchState extends State<Launch> {
81
  ///   double _rocketThrust = 0;
82
  ///
83 84
  ///   @override
  ///   Widget build(BuildContext context) {
85
  ///     return SliderTheme(
86
  ///       data: SliderTheme.of(context).copyWith(activeTrackColor: const Color(0xff804040)),
87
  ///       child: Slider(
88 89 90 91 92
  ///         onChanged: (double value) { setState(() { _rocketThrust = value; }); },
  ///         value: _rocketThrust,
  ///       ),
  ///     );
  ///   }
93 94
  /// }
  /// ```
95
  /// {@end-tool}
96 97 98 99 100 101
  ///
  /// See also:
  ///
  ///  * [SliderThemeData], which describes the actual configuration of a slider
  ///    theme.
  static SliderThemeData of(BuildContext context) {
102
    final SliderTheme? inheritedTheme = context.dependOnInheritedWidgetOfExactType<SliderTheme>();
103
    return inheritedTheme != null ? inheritedTheme.data : Theme.of(context).sliderTheme;
104 105
  }

106 107
  @override
  Widget wrap(BuildContext context, Widget child) {
108
    return SliderTheme(data: data, child: child);
109 110
  }

111
  @override
112
  bool updateShouldNotify(SliderTheme oldWidget) => data != oldWidget.data;
113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138
}

/// 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,
}

139 140 141 142 143 144 145 146 147 148 149 150 151 152 153
/// 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,
}

154 155 156 157 158 159 160 161
/// 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].
///
162 163 164 165 166 167 168 169
/// 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].
///
170 171 172 173
/// The parts of a slider are:
///
///  * The "thumb", which is a shape that slides horizontally when the user
///    drags it.
174
///  * The "track", which is the line that the slider thumb slides along.
175 176 177 178 179 180 181 182
///  * 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.
183 184 185 186 187 188 189
///  * 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.
///
190 191 192 193
/// The thumb, track, tick marks, value indicator, and overlay can be customized
/// by creating subclasses of [SliderTrackShape],
/// [SliderComponentShape], and/or [SliderTickMarkShape]. See
/// [RoundSliderThumbShape], [RectangularSliderTrackShape],
194
/// [RoundSliderTickMarkShape], [RectangularSliderValueIndicatorShape], and
195
/// [RoundSliderOverlayShape] for examples.
196
///
197 198 199 200 201 202 203 204 205 206
/// 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].
///
207 208 209 210 211 212 213
/// 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].
214 215 216 217 218 219 220 221 222 223 224 225 226 227 228
///  * [SliderComponentShape], which can be used to create custom shapes for
///    the [Slider]'s thumb, overlay, and value indicator and the
///    [RangeSlider]'s overlay.
///  * [SliderTrackShape], which can be used to create custom shapes for the
///    [Slider]'s track.
///  * [SliderTickMarkShape], which can be used to create custom shapes for the
///    [Slider]'s tick marks.
///  * [RangeSliderThumbShape], which can be used to create custom shapes for
///    the [RangeSlider]'s thumb.
///  * [RangeSliderValueIndicatorShape], which can be used to create custom
///    shapes for the [RangeSlider]'s value indicator.
///  * [RangeSliderTrackShape], which can be used to create custom shapes for
///    the [RangeSlider]'s track.
///  * [RangeSliderTickMarkShape], which can be used to create custom shapes for
///    the [RangeSlider]'s tick marks.
229
@immutable
230
class SliderThemeData with Diagnosticable {
231
  /// Create a [SliderThemeData] given a set of exact values.
232 233 234 235 236 237
  ///
  /// 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
238 239
  /// entirely new one with [SliderThemeData.fromPrimaryColors].
  ///
240
  /// {@tool snippet}
241 242 243
  ///
  /// ```dart
  /// class Blissful extends StatefulWidget {
244 245
  ///   const Blissful({Key? key}) : super(key: key);
  ///
246
  ///   @override
247
  ///   State createState() => BlissfulState();
248 249 250
  /// }
  ///
  /// class BlissfulState extends State<Blissful> {
251
  ///   double _bliss = 0;
252 253 254
  ///
  ///   @override
  ///   Widget build(BuildContext context) {
255
  ///     return SliderTheme(
256
  ///       data: SliderTheme.of(context).copyWith(activeTrackColor: const Color(0xff404080)),
257
  ///       child: Slider(
258 259 260 261 262 263 264
  ///         onChanged: (double value) { setState(() { _bliss = value; }); },
  ///         value: _bliss,
  ///       ),
  ///     );
  ///   }
  /// }
  /// ```
265
  /// {@end-tool}
266
  const SliderThemeData({
267 268 269 270 271 272 273 274 275 276
    this.trackHeight,
    this.activeTrackColor,
    this.inactiveTrackColor,
    this.disabledActiveTrackColor,
    this.disabledInactiveTrackColor,
    this.activeTickMarkColor,
    this.inactiveTickMarkColor,
    this.disabledActiveTickMarkColor,
    this.disabledInactiveTickMarkColor,
    this.thumbColor,
277
    this.overlappingShapeStrokeColor,
278 279 280
    this.disabledThumbColor,
    this.overlayColor,
    this.valueIndicatorColor,
281
    this.overlayShape,
282 283
    this.tickMarkShape,
    this.thumbShape,
284
    this.trackShape,
285
    this.valueIndicatorShape,
286 287 288 289
    this.rangeTickMarkShape,
    this.rangeThumbShape,
    this.rangeTrackShape,
    this.rangeValueIndicatorShape,
290 291
    this.showValueIndicator,
    this.valueIndicatorTextStyle,
292 293
    this.minThumbSeparation,
    this.thumbSelector,
294
    this.mouseCursor,
295
  });
296 297 298 299 300 301 302 303 304 305

  /// 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].
306
  factory SliderThemeData.fromPrimaryColors({
307 308 309 310
    required Color primaryColor,
    required Color primaryColorDark,
    required Color primaryColorLight,
    required TextStyle valueIndicatorTextStyle,
311 312 313 314
  }) {
    assert(primaryColor != null);
    assert(primaryColorDark != null);
    assert(primaryColorLight != null);
315
    assert(valueIndicatorTextStyle != null);
316 317 318

    // These are Material Design defaults, and are used to derive
    // component Colors (with opacity) from base colors.
319 320 321 322
    const int activeTrackAlpha = 0xff;
    const int inactiveTrackAlpha = 0x3d; // 24% opacity
    const int disabledActiveTrackAlpha = 0x52; // 32% opacity
    const int disabledInactiveTrackAlpha = 0x1f; // 12% opacity
323 324 325 326 327 328
    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
329
    const int overlayAlpha = 0x1f; // 12% opacity
330 331
    const int valueIndicatorAlpha = 0xff;

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

361
  /// The height of the [Slider] track.
362
  final double? trackHeight;
363

364
  /// The color of the [Slider] track between the [Slider.min] position and the
365
  /// current thumb position.
366
  final Color? activeTrackColor;
367

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

372
  /// The color of the [Slider] track between the [Slider.min] position and the
373
  /// current thumb position when the [Slider] is disabled.
374
  final Color? disabledActiveTrackColor;
375

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

380
  /// The color of the track's tick marks that are drawn between the [Slider.min]
381
  /// position and the current thumb position.
382
  final Color? activeTickMarkColor;
383

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

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

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

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

400 401 402
  /// 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.
403
  final Color? overlappingShapeStrokeColor;
404

405 406
  /// The color given to the [thumbShape] to draw itself with when the
  /// [Slider] is disabled.
407
  final Color? disabledThumbColor;
408

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

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

418

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

  /// 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].
  ///
435
  /// See also:
436
  ///
Shi-Hao Hong's avatar
Shi-Hao Hong committed
437
  ///  * [RoundRangeSliderTickMarkShape], which is the default tick mark
438
  ///    shape for the range slider.
439
  final SliderTickMarkShape? tickMarkShape;
440 441

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

451 452 453 454 455 456 457 458 459 460 461
  /// 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
462
  ///  * [RoundedRectRangeSliderTrackShape], which is the default track
463
  ///    shape for the [RangeSlider].
464
  final SliderTrackShape? trackShape;
465

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

477 478 479 480 481 482 483 484 485 486
  /// 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
487
  ///  * [RoundSliderTickMarkShape], which is the default tick mark shape
488
  ///    for the [Slider].
489
  final RangeSliderTickMarkShape? rangeTickMarkShape;
490 491 492 493 494 495 496 497 498 499 500

  /// 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
501
  ///  * [RoundSliderThumbShape], which is the default thumb shape for the
502
  ///    [Slider].
503
  final RangeSliderThumbShape? rangeThumbShape;
504 505 506

  /// The shape that will be used to draw the [RangeSlider]'s track.
  ///
507
  /// The [SliderTrackShape.getPreferredRect] method is used to map
508 509 510 511 512 513 514 515
  /// 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
516
  ///  * [RoundedRectSliderTrackShape], which is the default track
517
  ///    shape for the [Slider].
518
  final RangeSliderTrackShape? rangeTrackShape;
519 520 521 522 523 524 525 526 527 528 529 530

  /// 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
531
  ///  * [PaddleSliderValueIndicatorShape], which is the default value
532
  ///    indicator shape for the [Slider].
533
  final RangeSliderValueIndicatorShape? rangeValueIndicatorShape;
534

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

543
  /// The text style for the text on the value indicator.
544
  final TextStyle? valueIndicatorTextStyle;
545

546 547 548 549 550
  /// 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
551
  /// real values, rather than logical pixels, the values can be restricted by
552
  /// the parent.
553
  final double? minThumbSeparation;
554 555 556 557 558 559 560 561 562 563

  /// 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.
564
  final RangeThumbSelector? thumbSelector;
565

566 567 568 569 570
  /// {@macro flutter.material.slider.mouseCursor}
  ///
  /// If specified, overrides the default value of [Slider.mouseCursor].
  final MaterialStateProperty<MouseCursor?>? mouseCursor;

571 572
  /// Creates a copy of this object but with the given fields replaced with the
  /// new values.
573
  SliderThemeData copyWith({
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 600
    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,
601
    MaterialStateProperty<MouseCursor?>? mouseCursor,
602
  }) {
603
    return SliderThemeData(
604
      trackHeight: trackHeight ?? this.trackHeight,
605 606 607 608
      activeTrackColor: activeTrackColor ?? this.activeTrackColor,
      inactiveTrackColor: inactiveTrackColor ?? this.inactiveTrackColor,
      disabledActiveTrackColor: disabledActiveTrackColor ?? this.disabledActiveTrackColor,
      disabledInactiveTrackColor: disabledInactiveTrackColor ?? this.disabledInactiveTrackColor,
609 610 611
      activeTickMarkColor: activeTickMarkColor ?? this.activeTickMarkColor,
      inactiveTickMarkColor: inactiveTickMarkColor ?? this.inactiveTickMarkColor,
      disabledActiveTickMarkColor: disabledActiveTickMarkColor ?? this.disabledActiveTickMarkColor,
612
      disabledInactiveTickMarkColor: disabledInactiveTickMarkColor ?? this.disabledInactiveTickMarkColor,
613
      thumbColor: thumbColor ?? this.thumbColor,
614
      overlappingShapeStrokeColor: overlappingShapeStrokeColor ?? this.overlappingShapeStrokeColor,
615 616 617
      disabledThumbColor: disabledThumbColor ?? this.disabledThumbColor,
      overlayColor: overlayColor ?? this.overlayColor,
      valueIndicatorColor: valueIndicatorColor ?? this.valueIndicatorColor,
618
      overlayShape: overlayShape ?? this.overlayShape,
619
      tickMarkShape: tickMarkShape ?? this.tickMarkShape,
620
      thumbShape: thumbShape ?? this.thumbShape,
621
      trackShape: trackShape ?? this.trackShape,
622
      valueIndicatorShape: valueIndicatorShape ?? this.valueIndicatorShape,
623 624 625 626
      rangeTickMarkShape: rangeTickMarkShape ?? this.rangeTickMarkShape,
      rangeThumbShape: rangeThumbShape ?? this.rangeThumbShape,
      rangeTrackShape: rangeTrackShape ?? this.rangeTrackShape,
      rangeValueIndicatorShape: rangeValueIndicatorShape ?? this.rangeValueIndicatorShape,
627
      showValueIndicator: showValueIndicator ?? this.showValueIndicator,
628
      valueIndicatorTextStyle: valueIndicatorTextStyle ?? this.valueIndicatorTextStyle,
629 630
      minThumbSeparation: minThumbSeparation ?? this.minThumbSeparation,
      thumbSelector: thumbSelector ?? this.thumbSelector,
631
      mouseCursor: mouseCursor ?? this.mouseCursor,
632 633 634 635 636 637 638
    );
  }

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

  @override
677 678 679 680 681 682 683 684 685 686 687 688 689 690 691 692 693 694 695 696 697
  int get hashCode => Object.hash(
    trackHeight,
    activeTrackColor,
    inactiveTrackColor,
    disabledActiveTrackColor,
    disabledInactiveTrackColor,
    activeTickMarkColor,
    inactiveTickMarkColor,
    disabledActiveTickMarkColor,
    disabledInactiveTickMarkColor,
    thumbColor,
    overlappingShapeStrokeColor,
    disabledThumbColor,
    overlayColor,
    valueIndicatorColor,
    overlayShape,
    tickMarkShape,
    thumbShape,
    trackShape,
    valueIndicatorShape,
    Object.hash(
698 699 700 701
      rangeTickMarkShape,
      rangeThumbShape,
      rangeTrackShape,
      rangeValueIndicatorShape,
702
      showValueIndicator,
703
      valueIndicatorTextStyle,
704 705
      minThumbSeparation,
      thumbSelector,
706
      mouseCursor,
707 708
    ),
  );
709 710 711

  @override
  bool operator ==(Object other) {
712 713 714
    if (identical(this, other)) {
      return true;
    }
715 716 717
    if (other.runtimeType != runtimeType) {
      return false;
    }
718 719 720 721 722 723 724 725 726 727 728 729 730 731 732 733 734 735 736 737 738 739 740 741 742 743 744
    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
745 746
        && other.thumbSelector == thumbSelector
        && other.mouseCursor == mouseCursor;
747 748 749
  }

  @override
750 751
  void debugFillProperties(DiagnosticPropertiesBuilder properties) {
    super.debugFillProperties(properties);
752
    const SliderThemeData defaultData = SliderThemeData();
753
    properties.add(DoubleProperty('trackHeight', trackHeight, defaultValue: defaultData.trackHeight));
754 755 756 757 758 759 760 761 762 763 764 765 766
    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));
767 768 769 770 771 772 773 774 775
    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));
776 777
    properties.add(EnumProperty<ShowValueIndicator>('showValueIndicator', showValueIndicator, defaultValue: defaultData.showValueIndicator));
    properties.add(DiagnosticsProperty<TextStyle>('valueIndicatorTextStyle', valueIndicatorTextStyle, defaultValue: defaultData.valueIndicatorTextStyle));
778
    properties.add(DoubleProperty('minThumbSeparation', minThumbSeparation, defaultValue: defaultData.minThumbSeparation));
779
    properties.add(DiagnosticsProperty<RangeThumbSelector>('thumbSelector', thumbSelector, defaultValue: defaultData.thumbSelector));
780
    properties.add(DiagnosticsProperty<MaterialStateProperty<MouseCursor?>>('mouseCursor', mouseCursor, defaultValue: defaultData.mouseCursor));
781 782 783
  }
}

784
/// Base class for slider thumb, thumb overlay, and value indicator shapes.
785
///
786
/// Create a subclass of this if you would like a custom shape.
787
///
788 789 790 791 792 793 794 795
/// 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].
796 797 798
///
/// See also:
///
799 800 801
///  * [RoundSliderThumbShape], which is the default [Slider]'s thumb shape that
///    paints a solid circle.
///  * [RoundSliderOverlayShape], which is the default [Slider] and
802
///    [RangeSlider]'s overlay shape that paints a transparent circle.
803 804
///  * [PaddleSliderValueIndicatorShape], which is the default [Slider]'s value
///    indicator shape that paints a custom path with text in it.
805 806
abstract class SliderComponentShape {
  /// This abstract const constructor enables subclasses to provide
807
  /// const constructors so that they can be used in const expressions.
808
  const SliderComponentShape();
809

810 811 812 813
  /// 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.
814
  ///
815
  /// {@template flutter.material.SliderComponentShape.paint.context}
816 817 818
  /// The `context` argument is the same as the one that includes the [Slider]'s
  /// render box.
  /// {@endtemplate}
819
  ///
820
  /// {@template flutter.material.SliderComponentShape.paint.center}
821 822 823
  /// 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}
824
  ///
825 826
  /// The `activationAnimation` argument is an animation triggered when the user
  /// begins to interact with the slider. It reverses when the user stops interacting
827
  /// with the slider.
828
  ///
829
  /// {@template flutter.material.SliderComponentShape.paint.enableAnimation}
830
  /// The `enableAnimation` argument is an animation triggered when the [Slider]
831 832 833
  /// 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.
834
  /// {@endtemplate}
835
  ///
836
  /// {@template flutter.material.SliderComponentShape.paint.isDiscrete}
837 838 839
  /// 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}
840
  ///
841 842 843 844
  /// 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].
845
  ///
846
  /// {@template flutter.material.SliderComponentShape.paint.parentBox}
847 848 849
  /// The `parentBox` argument is the [RenderBox] of the [Slider]. Its attributes,
  /// such as size, can be used to assist in painting this shape.
  /// {@endtemplate}
850
  ///
851
  /// {@template flutter.material.SliderComponentShape.paint.sliderTheme}
852 853 854
  /// the `sliderTheme` argument is the theme assigned to the [Slider] that this
  /// shape belongs to.
  /// {@endtemplate}
855
  ///
856 857 858
  /// 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.
859
  ///
860 861
  /// The `value` argument is the current parametric value (from 0.0 to 1.0) of
  /// the slider.
862
  ///
863
  /// {@template flutter.material.SliderComponentShape.paint.textScaleFactor}
864 865 866 867
  /// 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].
868 869
  /// {@endtemplate}
  ///
870
  /// {@template flutter.material.SliderComponentShape.paint.sizeWithOverflow}
871 872 873 874 875
  /// 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.
876
  /// {@endtemplate}
877 878
  void paint(
    PaintingContext context,
879
    Offset center, {
880 881
    required Animation<double> activationAnimation,
    required Animation<double> enableAnimation,
882
    required bool isDiscrete,
883 884 885 886 887
    required TextPainter labelPainter,
    required RenderBox parentBox,
    required SliderThemeData sliderTheme,
    required TextDirection textDirection,
    required double value,
888 889
    required double textScaleFactor,
    required Size sizeWithOverflow,
890
  });
891 892 893 894 895 896 897 898 899 900 901 902 903 904 905 906

  /// 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();
907 908
}

909
/// Base class for [Slider] tick mark shapes.
910
///
911
/// Create a subclass of this if you would like a custom slider tick mark shape.
912
///
913 914 915
/// The tick mark painting can be skipped by specifying [noTickMark] for
/// [SliderThemeData.tickMarkShape].
///
916 917
/// See also:
///
918 919
///  * [RoundSliderTickMarkShape], which is the default [Slider]'s tick mark
///    shape that paints a solid circle.
920 921 922 923 924
///  * [SliderTrackShape], which can be used to create custom shapes for the
///    [Slider]'s track.
///  * [SliderComponentShape], which can be used to create custom shapes for
///    the [Slider]'s thumb, overlay, and value indicator and the
///    [RangeSlider]'s overlay.
925
abstract class SliderTickMarkShape {
926
  /// This abstract const constructor enables subclasses to provide
927 928 929 930 931 932 933
  /// 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.
  ///
934
  /// {@macro flutter.material.SliderComponentShape.paint.sliderTheme}
935
  ///
936
  /// {@template flutter.material.SliderTickMarkShape.getPreferredSize.isEnabled}
937 938
  /// The `isEnabled` argument is false when [Slider.onChanged] is null and true
  /// otherwise. When true, the slider will respond to input.
939
  /// {@endtemplate}
940
  Size getPreferredSize({
941
    required SliderThemeData sliderTheme,
942
    required bool isEnabled,
943 944 945 946
  });

  /// Paints the slider track.
  ///
947
  /// {@macro flutter.material.SliderComponentShape.paint.context}
948
  ///
949
  /// {@macro flutter.material.SliderComponentShape.paint.center}
950
  ///
951
  /// {@macro flutter.material.SliderComponentShape.paint.parentBox}
952
  ///
953
  /// {@macro flutter.material.SliderComponentShape.paint.sliderTheme}
954
  ///
955
  /// {@macro flutter.material.SliderComponentShape.paint.enableAnimation}
956
  ///
957
  /// {@macro flutter.material.SliderTickMarkShape.getPreferredSize.isEnabled}
958
  ///
959 960 961 962 963 964 965
  /// 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.
966 967 968
  void paint(
    PaintingContext context,
    Offset center, {
969 970 971 972
    required RenderBox parentBox,
    required SliderThemeData sliderTheme,
    required Animation<double> enableAnimation,
    required Offset thumbCenter,
973
    required bool isEnabled,
974
    required TextDirection textDirection,
975
  });
976 977 978 979 980

  /// Special instance of [SliderTickMarkShape] to skip the tick mark painting.
  ///
  /// See also:
  ///
981 982
  ///  * [SliderThemeData.tickMarkShape], which is the shape that the [Slider]
  ///    uses when painting tick marks.
983 984 985
  static final SliderTickMarkShape noTickMark = _EmptySliderTickMarkShape();
}

986
/// Base class for slider track shapes.
987
///
988 989 990 991 992 993 994 995 996
/// 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:
///
997 998
///  * [RoundedRectSliderTrackShape] for the default [Slider]'s track shape that
///    paints a stadium-like track.
999 1000 1001 1002 1003
///  * [SliderTickMarkShape], which can be used to create custom shapes for the
///    [Slider]'s tick marks.
///  * [SliderComponentShape], which can be used to create custom shapes for
///    the [Slider]'s thumb, overlay, and value indicator and the
///    [RangeSlider]'s overlay.
1004 1005 1006 1007 1008 1009 1010 1011 1012 1013
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.
  ///
1014
  /// The `parentBox` argument can be used to help determine the preferredRect relative to
1015 1016
  /// attributes of the render box of the slider itself, such as size.
  ///
1017
  /// The `offset` argument is relative to the caller's bounding box. It can be used to
1018 1019
  /// convert gesture coordinates from global to slider-relative coordinates.
  ///
1020
  /// {@macro flutter.material.SliderComponentShape.paint.sliderTheme}
1021
  ///
1022
  /// {@macro flutter.material.SliderTickMarkShape.getPreferredSize.isEnabled}
1023
  ///
1024
  /// {@macro flutter.material.SliderComponentShape.paint.isDiscrete}
1025
  Rect getPreferredRect({
1026
    required RenderBox parentBox,
1027
    Offset offset = Offset.zero,
1028
    required SliderThemeData sliderTheme,
1029
    bool isEnabled,
1030 1031
    bool isDiscrete,
  });
1032

1033 1034
  /// Paints the track shape based on the state passed to it.
  ///
1035
  /// {@macro flutter.material.SliderComponentShape.paint.context}
1036
  ///
1037 1038 1039
  /// 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].
1040
  ///
1041
  /// {@macro flutter.material.SliderComponentShape.paint.parentBox}
1042
  ///
1043
  /// {@macro flutter.material.SliderComponentShape.paint.sliderTheme}
1044
  ///
1045
  /// {@macro flutter.material.SliderComponentShape.paint.enableAnimation}
1046
  ///
1047 1048 1049
  /// 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.
1050
  ///
1051
  /// {@macro flutter.material.SliderTickMarkShape.getPreferredSize.isEnabled}
1052
  ///
1053
  /// {@macro flutter.material.SliderComponentShape.paint.isDiscrete}
1054
  ///
1055 1056
  /// The `textDirection` argument can be used to determine how the track
  /// segments are painted depending on whether they are active or not.
1057
  ///
1058
  /// {@template flutter.material.SliderTrackShape.paint.trackSegment}
1059 1060 1061 1062 1063 1064
  /// 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}
1065 1066
  void paint(
    PaintingContext context,
1067
    Offset offset, {
1068 1069 1070 1071
    required RenderBox parentBox,
    required SliderThemeData sliderTheme,
    required Animation<double> enableAnimation,
    required Offset thumbCenter,
1072
    bool isEnabled,
1073
    bool isDiscrete,
1074
    required TextDirection textDirection,
1075
  });
1076 1077
}

1078
/// Base class for [RangeSlider] thumb shapes.
1079
///
1080 1081
/// See also:
///
1082 1083
///  * [RoundRangeSliderThumbShape] for the default [RangeSlider]'s thumb shape
///    that paints a solid circle.
1084 1085 1086 1087 1088 1089 1090 1091 1092
///  * [RangeSliderTickMarkShape], which can be used to create custom shapes for
///    the [RangeSlider]'s tick marks.
///  * [RangeSliderTrackShape], which can be used to create custom shapes for
///    the [RangeSlider]'s track.
///  * [RangeSliderValueIndicatorShape], which can be used to create custom
///    shapes for the [RangeSlider]'s value indicator.
///  * [SliderComponentShape], which can be used to create custom shapes for
///    the [Slider]'s thumb, overlay, and value indicator and the
///    [RangeSlider]'s overlay.
1093 1094
abstract class RangeSliderThumbShape {
  /// This abstract const constructor enables subclasses to provide
1095
  /// const constructors so that they can be used in const expressions.
1096
  const RangeSliderThumbShape();
1097 1098

  /// Returns the preferred size of the shape, based on the given conditions.
1099
  ///
1100
  /// {@template flutter.material.RangeSliderThumbShape.getPreferredSize.isDiscrete}
1101 1102 1103
  /// 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}
1104
  ///
1105
  /// {@template flutter.material.RangeSliderThumbShape.getPreferredSize.isEnabled}
1106 1107
  /// The `isEnabled` argument is false when [RangeSlider.onChanged] is null and
  /// true otherwise. When true, the slider will respond to input.
1108
  /// {@endtemplate}
1109 1110
  Size getPreferredSize(bool isEnabled, bool isDiscrete);

1111
  /// Paints the thumb shape based on the state passed to it.
1112
  ///
1113
  /// {@template flutter.material.RangeSliderThumbShape.paint.context}
1114 1115
  /// The `context` argument represents the [RangeSlider]'s render box.
  /// {@endtemplate}
1116
  ///
1117
  /// {@macro flutter.material.SliderComponentShape.paint.center}
1118
  ///
1119
  /// {@template flutter.material.RangeSliderThumbShape.paint.activationAnimation}
1120 1121 1122 1123
  /// 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}
1124
  ///
1125
  /// {@template flutter.material.RangeSliderThumbShape.paint.enableAnimation}
1126
  /// The `enableAnimation` argument is an animation triggered when the
1127 1128 1129 1130
  /// [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.
1131
  /// {@endtemplate}
1132
  ///
1133
  /// {@macro flutter.material.RangeSliderThumbShape.getPreferredSize.isDiscrete}
1134
  ///
1135
  /// {@macro flutter.material.RangeSliderThumbShape.getPreferredSize.isEnabled}
1136
  ///
1137 1138 1139
  /// 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.
1140
  ///
1141
  /// {@template flutter.material.RangeSliderThumbShape.paint.sliderTheme}
1142 1143 1144
  /// The `sliderTheme` argument is the theme assigned to the [RangeSlider] that
  /// this shape belongs to.
  /// {@endtemplate}
1145
  ///
1146 1147 1148
  /// 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.
1149
  ///
1150
  /// {@template flutter.material.RangeSliderThumbShape.paint.thumb}
1151 1152 1153
  /// The `thumb` argument is the specifier for which of the two thumbs this
  /// method should paint (start or end).
  /// {@endtemplate}
1154
  ///
1155 1156 1157
  /// The `isPressed` argument can be used to give the selected thumb
  /// additional selected or pressed state visual feedback, such as a larger
  /// shadow.
1158 1159 1160
  void paint(
    PaintingContext context,
    Offset center, {
1161 1162
    required Animation<double> activationAnimation,
    required Animation<double> enableAnimation,
1163 1164 1165
    bool isDiscrete,
    bool isEnabled,
    bool isOnTop,
1166
    TextDirection textDirection,
1167
    required SliderThemeData sliderTheme,
1168
    Thumb thumb,
1169
    bool isPressed,
1170 1171 1172 1173 1174 1175 1176
  });
}

/// Base class for [RangeSlider] value indicator shapes.
///
/// See also:
///
1177 1178
///  * [PaddleRangeSliderValueIndicatorShape] for the default [RangeSlider]'s
///    value indicator shape that paints a custom path with text in it.
1179 1180 1181 1182 1183 1184 1185 1186 1187
///  * [RangeSliderTickMarkShape], which can be used to create custom shapes for
///    the [RangeSlider]'s tick marks.
///  * [RangeSliderThumbShape], which can be used to create custom shapes for
///    the [RangeSlider]'s thumb.
///  * [RangeSliderTrackShape], which can be used to create custom shapes for
///    the [RangeSlider]'s track.
///  * [SliderComponentShape], which can be used to create custom shapes for
///    the [Slider]'s thumb, overlay, and value indicator and the
///    [RangeSlider]'s overlay.
1188 1189 1190 1191 1192 1193 1194
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.
  ///
1195
  /// {@macro flutter.material.RangeSliderThumbShape.getPreferredSize.isEnabled}
1196
  ///
1197
  /// {@macro flutter.material.RangeSliderThumbShape.getPreferredSize.isDiscrete}
1198
  ///
1199 1200
  /// The `labelPainter` argument helps determine the width of the shape. It is
  /// variable width because it is derived from a formatted string.
1201
  ///
1202
  /// {@macro flutter.material.SliderComponentShape.paint.textScaleFactor}
1203 1204 1205
  Size getPreferredSize(
    bool isEnabled,
    bool isDiscrete, {
1206 1207
    required TextPainter labelPainter,
    required double textScaleFactor,
1208
  });
1209

1210 1211 1212 1213 1214
  /// 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({
1215 1216 1217 1218 1219 1220
    RenderBox? parentBox,
    Offset? center,
    TextPainter? labelPainter,
    Animation<double>? activationAnimation,
    double? textScaleFactor,
    Size? sizeWithOverflow,
1221 1222 1223 1224
  }) {
    return 0;
  }

1225 1226
  /// Paints the value indicator shape based on the state passed to it.
  ///
1227
  /// {@macro flutter.material.RangeSliderThumbShape.paint.context}
1228
  ///
1229
  /// {@macro flutter.material.SliderComponentShape.paint.center}
1230
  ///
1231
  /// {@macro flutter.material.RangeSliderThumbShape.paint.activationAnimation}
1232
  ///
1233
  /// {@macro flutter.material.RangeSliderThumbShape.paint.enableAnimation}
1234
  ///
1235
  /// {@macro flutter.material.RangeSliderThumbShape.getPreferredSize.isDiscrete}
1236
  ///
1237
  /// The `isOnTop` argument is the top-most value indicator between the two value
1238 1239 1240 1241
  /// 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.
  ///
1242
  /// {@macro flutter.material.SliderComponentShape.paint.textScaleFactor}
1243
  ///
1244
  /// {@macro flutter.material.SliderComponentShape.paint.sizeWithOverflow}
1245
  ///
1246
  /// {@template flutter.material.RangeSliderValueIndicatorShape.paint.parentBox}
1247 1248 1249
  /// The `parentBox` argument is the [RenderBox] of the [RangeSlider]. Its
  /// attributes, such as size, can be used to assist in painting this shape.
  /// {@endtemplate}
1250
  ///
1251
  /// {@macro flutter.material.RangeSliderThumbShape.paint.sliderTheme}
1252
  ///
1253 1254 1255 1256
  /// 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.
1257
  ///
1258 1259
  /// The `value` argument is the current parametric value (from 0.0 to 1.0) of
  /// the slider.
1260
  ///
1261
  /// {@macro flutter.material.RangeSliderThumbShape.paint.thumb}
1262 1263
  void paint(
    PaintingContext context,
1264
    Offset center, {
1265 1266
    required Animation<double> activationAnimation,
    required Animation<double> enableAnimation,
1267
    bool isDiscrete,
1268
    bool isOnTop,
1269
    required TextPainter labelPainter,
1270 1271
    double textScaleFactor,
    Size sizeWithOverflow,
1272 1273
    required RenderBox parentBox,
    required SliderThemeData sliderTheme,
1274 1275
    TextDirection textDirection,
    double value,
1276
    Thumb thumb,
1277
  });
1278
}
1279

1280 1281 1282 1283 1284 1285 1286
/// 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:
///
1287 1288
///  * [RoundRangeSliderTickMarkShape] for the default [RangeSlider]'s tick mark
///    shape that paints a solid circle.
1289 1290 1291 1292 1293 1294 1295 1296 1297
///  * [RangeSliderThumbShape], which can be used to create custom shapes for
///    the [RangeSlider]'s thumb.
///  * [RangeSliderTrackShape], which can be used to create custom shapes for
///    the [RangeSlider]'s track.
///  * [RangeSliderValueIndicatorShape], which can be used to create custom
///    shapes for the [RangeSlider]'s value indicator.
///  * [SliderComponentShape], which can be used to create custom shapes for
///    the [Slider]'s thumb, overlay, and value indicator and the
///    [RangeSlider]'s overlay.
1298 1299 1300 1301 1302 1303
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.
1304
  ///
1305
  /// It is used to help position the tick marks within the slider.
1306
  ///
1307
  /// {@macro flutter.material.RangeSliderThumbShape.paint.sliderTheme}
1308
  ///
1309
  /// {@macro flutter.material.RangeSliderThumbShape.getPreferredSize.isEnabled}
1310
  Size getPreferredSize({
1311
    required SliderThemeData sliderTheme,
1312 1313
    bool isEnabled,
  });
1314

1315
  /// Paints the slider track.
1316
  ///
1317
  /// {@macro flutter.material.RangeSliderThumbShape.paint.context}
1318
  ///
1319
  /// {@macro flutter.material.SliderComponentShape.paint.center}
1320
  ///
1321
  /// {@macro flutter.material.RangeSliderValueIndicatorShape.paint.parentBox}
1322
  ///
1323
  /// {@macro flutter.material.RangeSliderThumbShape.paint.sliderTheme}
1324
  ///
1325
  /// {@macro flutter.material.RangeSliderThumbShape.paint.enableAnimation}
1326
  ///
1327
  /// {@macro flutter.material.RangeSliderThumbShape.getPreferredSize.isEnabled}
1328
  ///
1329 1330
  /// 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.
1331
  ///
1332
  /// {@template flutter.material.RangeSliderTickMarkShape.paint.trackSegment}
1333 1334 1335 1336 1337
  /// 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}
1338 1339 1340
  void paint(
    PaintingContext context,
    Offset center, {
1341 1342 1343 1344 1345
    required RenderBox parentBox,
    required SliderThemeData sliderTheme,
    required Animation<double> enableAnimation,
    required Offset startThumbCenter,
    required Offset endThumbCenter,
1346
    bool isEnabled,
1347
    required TextDirection textDirection,
1348
  });
1349 1350
}

1351
/// Base class for [RangeSlider] track shapes.
1352
///
1353 1354 1355 1356 1357 1358 1359 1360 1361
/// 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:
///
1362 1363
///  * [RoundedRectRangeSliderTrackShape] for the default [RangeSlider]'s track
///    shape that paints a stadium-like track.
1364 1365 1366 1367 1368 1369 1370 1371 1372
///  * [RangeSliderTickMarkShape], which can be used to create custom shapes for
///    the [RangeSlider]'s tick marks.
///  * [RangeSliderThumbShape], which can be used to create custom shapes for
///    the [RangeSlider]'s thumb.
///  * [RangeSliderValueIndicatorShape], which can be used to create custom
///    shapes for the [RangeSlider]'s value indicator.
///  * [SliderComponentShape], which can be used to create custom shapes for
///    the [Slider]'s thumb, overlay, and value indicator and the
///    [RangeSlider]'s overlay.
1373 1374 1375 1376
abstract class RangeSliderTrackShape {
  /// This abstract const constructor enables subclasses to provide
  /// const constructors so that they can be used in const expressions.
  const RangeSliderTrackShape();
1377

1378 1379 1380 1381 1382 1383
  /// 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.
  ///
1384 1385 1386
  /// 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.
1387
  ///
1388 1389 1390
  /// 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.
1391
  ///
1392
  /// {@macro flutter.material.RangeSliderThumbShape.paint.sliderTheme}
1393
  ///
1394
  /// {@macro flutter.material.RangeSliderThumbShape.getPreferredSize.isEnabled}
1395
  ///
1396
  /// {@macro flutter.material.RangeSliderThumbShape.getPreferredSize.isDiscrete}
1397
  Rect getPreferredRect({
1398
    required RenderBox parentBox,
1399
    Offset offset = Offset.zero,
1400
    required SliderThemeData sliderTheme,
1401 1402 1403 1404 1405 1406
    bool isEnabled,
    bool isDiscrete,
  });

  /// Paints the track shape based on the state passed to it.
  ///
1407
  /// {@macro flutter.material.SliderComponentShape.paint.context}
1408 1409 1410 1411
  ///
  /// 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].
1412
  ///
1413
  /// {@macro flutter.material.RangeSliderValueIndicatorShape.paint.parentBox}
1414
  ///
1415
  /// {@macro flutter.material.RangeSliderThumbShape.paint.sliderTheme}
1416
  ///
1417
  /// {@macro flutter.material.RangeSliderThumbShape.paint.enableAnimation}
1418
  ///
1419 1420 1421
  /// 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.
1422
  ///
1423 1424 1425
  /// 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.
1426
  ///
1427
  /// {@macro flutter.material.RangeSliderThumbShape.getPreferredSize.isEnabled}
1428
  ///
1429
  /// {@macro flutter.material.RangeSliderThumbShape.getPreferredSize.isDiscrete}
1430
  ///
1431 1432 1433
  /// 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.
1434
  ///
1435
  /// {@macro flutter.material.RangeSliderTickMarkShape.paint.trackSegment}
1436 1437
  void paint(
    PaintingContext context,
1438
    Offset offset, {
1439 1440 1441 1442 1443 1444 1445 1446
    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,
1447
  });
1448 1449
}

1450 1451 1452
/// Base track shape that provides an implementation of [getPreferredRect] for
/// default sizing.
///
1453 1454 1455 1456
/// 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].
///
1457 1458
/// See also:
///
1459 1460 1461 1462
///  * [RectangularSliderTrackShape], which is a track shape with sharp
///    rectangular edges
///  * [RoundedRectSliderTrackShape], which is a track shape with round
///    stadium-like edges.
1463
mixin BaseSliderTrackShape {
1464 1465 1466
  /// Returns a rect that represents the track bounds that fits within the
  /// [Slider].
  ///
1467 1468
  /// 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
1469 1470 1471 1472 1473
  /// [SliderThemeData.trackHeight].
  ///
  /// The [Rect] is centered both horizontally and vertically within the slider
  /// bounds.
  Rect getPreferredRect({
1474
    required RenderBox parentBox,
1475
    Offset offset = Offset.zero,
1476
    required SliderThemeData sliderTheme,
1477 1478 1479
    bool isEnabled = false,
    bool isDiscrete = false,
  }) {
1480 1481
    assert(isEnabled != null);
    assert(isDiscrete != null);
1482
    assert(parentBox != null);
1483
    assert(sliderTheme != null);
1484 1485 1486
    final double thumbWidth = sliderTheme.thumbShape!.getPreferredSize(isEnabled, isDiscrete).width;
    final double overlayWidth = sliderTheme.overlayShape!.getPreferredSize(isEnabled, isDiscrete).width;
    final double trackHeight = sliderTheme.trackHeight!;
1487 1488 1489
    assert(overlayWidth >= 0);
    assert(trackHeight >= 0);

1490
    final double trackLeft = offset.dx + math.max(overlayWidth / 2, thumbWidth / 2);
1491
    final double trackTop = offset.dy + (parentBox.size.height - trackHeight) / 2;
1492 1493 1494 1495
    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);
1496 1497
  }
}
1498

1499
/// A [Slider] track that's a simple rectangle.
1500
///
1501
/// It paints a solid colored rectangle, vertically centered in the
1502
/// `parentBox`. The track rectangle extends to the bounds of the `parentBox`,
1503 1504
/// but is padded by the [RoundSliderOverlayShape] radius. The height is defined
/// by the [SliderThemeData.trackHeight]. The color is determined by the
1505
/// [Slider]'s enabled state and the track segment's active state which are
1506
/// defined by:
1507 1508 1509 1510 1511
///   [SliderThemeData.activeTrackColor],
///   [SliderThemeData.inactiveTrackColor],
///   [SliderThemeData.disabledActiveTrackColor],
///   [SliderThemeData.disabledInactiveTrackColor].
///
1512
/// {@macro flutter.material.SliderTrackShape.paint.trackSegment}
1513
///
1514 1515 1516
/// ![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)
///
1517 1518 1519 1520 1521
/// 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.
1522 1523
///  * [SliderTrackShape], which can be used to create custom shapes for the
///    [Slider]'s track.
1524 1525 1526
///  * [RoundedRectSliderTrackShape], for a similar track with rounded edges.
class RectangularSliderTrackShape extends SliderTrackShape with BaseSliderTrackShape {
  /// Creates a slider track that draws 2 rectangles.
1527
  const RectangularSliderTrackShape();
1528 1529 1530 1531 1532

  @override
  void paint(
    PaintingContext context,
    Offset offset, {
1533 1534 1535 1536 1537
    required RenderBox parentBox,
    required SliderThemeData sliderTheme,
    required Animation<double> enableAnimation,
    required TextDirection textDirection,
    required Offset thumbCenter,
1538 1539 1540 1541 1542 1543 1544
    bool isDiscrete = false,
    bool isEnabled = false,
  }) {
    assert(context != null);
    assert(offset != null);
    assert(parentBox != null);
    assert(sliderTheme != null);
1545 1546 1547 1548 1549 1550 1551 1552 1553 1554
    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);
1555 1556 1557
    // 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.
1558
    if (sliderTheme.trackHeight! <= 0) {
1559 1560 1561 1562 1563
      return;
    }

    // Assign the track segment paints, which are left: active, right: inactive,
    // but reversed for right to left text.
1564 1565
    final ColorTween activeTrackColorTween = ColorTween(begin: sliderTheme.disabledActiveTrackColor, end: sliderTheme.activeTrackColor);
    final ColorTween inactiveTrackColorTween = ColorTween(begin: sliderTheme.disabledInactiveTrackColor, end: sliderTheme.inactiveTrackColor);
1566 1567
    final Paint activePaint = Paint()..color = activeTrackColorTween.evaluate(enableAnimation)!;
    final Paint inactivePaint = Paint()..color = inactiveTrackColorTween.evaluate(enableAnimation)!;
1568 1569
    final Paint leftTrackPaint;
    final Paint rightTrackPaint;
1570 1571 1572 1573 1574 1575 1576 1577 1578 1579 1580 1581 1582 1583 1584 1585 1586 1587 1588
    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,
    );

1589
    final Rect leftTrackSegment = Rect.fromLTRB(trackRect.left, trackRect.top, thumbCenter.dx, trackRect.bottom);
1590 1591
    if (!leftTrackSegment.isEmpty)
      context.canvas.drawRect(leftTrackSegment, leftTrackPaint);
1592
    final Rect rightTrackSegment = Rect.fromLTRB(thumbCenter.dx, trackRect.top, trackRect.right, trackRect.bottom);
1593 1594 1595 1596 1597 1598 1599 1600
    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
1601 1602
/// in the `parentBox`. The track rectangle extends to the bounds of the
/// `parentBox`, but is padded by the larger of [RoundSliderOverlayShape]'s
1603 1604 1605 1606 1607 1608 1609 1610
/// 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].
///
1611
/// {@macro flutter.material.SliderTrackShape.paint.trackSegment}
1612
///
1613 1614 1615
/// ![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)
///
1616 1617 1618 1619 1620
/// 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.
1621 1622
///  * [SliderTrackShape], which can be used to create custom shapes for the
///    [Slider]'s track.
1623 1624 1625
///  * [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.
1626
  const RoundedRectSliderTrackShape();
1627 1628 1629

  @override
  void paint(
1630 1631
    PaintingContext context,
    Offset offset, {
1632 1633 1634 1635 1636
    required RenderBox parentBox,
    required SliderThemeData sliderTheme,
    required Animation<double> enableAnimation,
    required TextDirection textDirection,
    required Offset thumbCenter,
1637 1638
    bool isDiscrete = false,
    bool isEnabled = false,
1639
    double additionalActiveTrackHeight = 2,
1640
  }) {
1641 1642 1643 1644 1645 1646 1647 1648 1649
    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);
1650 1651 1652
    assert(enableAnimation != null);
    assert(textDirection != null);
    assert(thumbCenter != null);
1653 1654 1655
    // 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.
1656
    if (sliderTheme.trackHeight == null || sliderTheme.trackHeight! <= 0) {
1657 1658 1659 1660 1661 1662 1663
      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);
1664 1665
    final Paint activePaint = Paint()..color = activeTrackColorTween.evaluate(enableAnimation)!;
    final Paint inactivePaint = Paint()..color = inactiveTrackColorTween.evaluate(enableAnimation)!;
1666 1667
    final Paint leftTrackPaint;
    final Paint rightTrackPaint;
1668 1669 1670 1671 1672 1673 1674 1675 1676 1677 1678 1679 1680 1681 1682 1683 1684 1685
    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,
    );
1686
    final Radius trackRadius = Radius.circular(trackRect.height / 2);
1687
    final Radius activeTrackRadius = Radius.circular((trackRect.height + additionalActiveTrackHeight) / 2);
1688

1689 1690 1691 1692 1693 1694 1695 1696 1697 1698 1699 1700 1701 1702 1703 1704 1705 1706 1707 1708 1709 1710
    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,
    );
1711 1712 1713
  }
}

1714
/// A [RangeSlider] track that's a simple rectangle.
1715
///
1716
/// It paints a solid colored rectangle, vertically centered in the
1717
/// `parentBox`. The track rectangle extends to the bounds of the `parentBox`,
1718 1719
/// but is padded by the [RoundSliderOverlayShape] radius. The height is
/// defined by the [SliderThemeData.trackHeight]. The color is determined by the
1720
/// [Slider]'s enabled state and the track segment's active state which are
1721 1722 1723 1724 1725
/// defined by:
///   [SliderThemeData.activeTrackColor],
///   [SliderThemeData.inactiveTrackColor],
///   [SliderThemeData.disabledActiveTrackColor],
///   [SliderThemeData.disabledInactiveTrackColor].
1726
///
1727
/// {@macro flutter.material.RangeSliderTickMarkShape.paint.trackSegment}
1728
///
1729 1730 1731
/// ![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)
///
1732 1733
/// See also:
///
1734
///  * [RangeSlider], for the component that is meant to display this shape.
1735
///  * [SliderThemeData], where an instance of this class is set to inform the
1736
///    slider of the visual details of the its track.
1737 1738
///  * [RangeSliderTrackShape], which can be used to create custom shapes for
///    the [RangeSlider]'s track.
1739 1740 1741 1742
///  * [RoundedRectRangeSliderTrackShape], for a similar track with rounded
///    edges.
class RectangularRangeSliderTrackShape extends RangeSliderTrackShape {
  /// Create a slider track with rectangular outer edges.
1743
  ///
1744 1745
  /// The middle track segment is the selected range and is active, and the two
  /// outer track segments are inactive.
1746
  const RectangularRangeSliderTrackShape();
1747 1748 1749

  @override
  Rect getPreferredRect({
1750
    required RenderBox parentBox,
1751
    Offset offset = Offset.zero,
1752
    required SliderThemeData sliderTheme,
1753 1754
    bool isEnabled = false,
    bool isDiscrete = false,
1755
  }) {
1756
    assert(parentBox != null);
1757
    assert(offset != null);
1758
    assert(sliderTheme != null);
1759 1760 1761
    assert(sliderTheme.overlayShape != null);
    assert(isEnabled != null);
    assert(isDiscrete != null);
1762 1763
    final double overlayWidth = sliderTheme.overlayShape!.getPreferredSize(isEnabled, isDiscrete).width;
    final double trackHeight = sliderTheme.trackHeight!;
1764 1765 1766 1767 1768
    assert(overlayWidth >= 0);
    assert(trackHeight >= 0);

    final double trackLeft = offset.dx + overlayWidth / 2;
    final double trackTop = offset.dy + (parentBox.size.height - trackHeight) / 2;
1769 1770 1771 1772
    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);
1773 1774 1775 1776 1777 1778
  }

  @override
  void paint(
    PaintingContext context,
    Offset offset, {
1779 1780 1781 1782 1783
    required RenderBox parentBox,
    required SliderThemeData sliderTheme,
    required Animation<double>? enableAnimation,
    required Offset startThumbCenter,
    required Offset endThumbCenter,
1784
    bool isEnabled = false,
1785
    bool isDiscrete = false,
1786
    required TextDirection textDirection,
1787
  }) {
1788 1789 1790 1791
    assert(context != null);
    assert(offset != null);
    assert(parentBox != null);
    assert(sliderTheme != null);
1792 1793 1794 1795 1796
    assert(sliderTheme.disabledActiveTrackColor != null);
    assert(sliderTheme.disabledInactiveTrackColor != null);
    assert(sliderTheme.activeTrackColor != null);
    assert(sliderTheme.inactiveTrackColor != null);
    assert(sliderTheme.rangeThumbShape != null);
1797
    assert(enableAnimation != null);
1798 1799 1800 1801
    assert(startThumbCenter != null);
    assert(endThumbCenter != null);
    assert(isEnabled != null);
    assert(isDiscrete != null);
1802
    assert(textDirection != null);
1803 1804
    // Assign the track segment paints, which are left: active, right: inactive,
    // but reversed for right to left text.
1805 1806
    final ColorTween activeTrackColorTween = ColorTween(begin: sliderTheme.disabledActiveTrackColor, end: sliderTheme.activeTrackColor);
    final ColorTween inactiveTrackColorTween = ColorTween(begin: sliderTheme.disabledInactiveTrackColor, end: sliderTheme.inactiveTrackColor);
1807 1808
    final Paint activePaint = Paint()..color = activeTrackColorTween.evaluate(enableAnimation!)!;
    final Paint inactivePaint = Paint()..color = inactiveTrackColorTween.evaluate(enableAnimation)!;
1809

1810 1811
    final Offset leftThumbOffset;
    final Offset rightThumbOffset;
1812 1813 1814 1815 1816 1817 1818 1819 1820
    switch (textDirection) {
      case TextDirection.ltr:
        leftThumbOffset = startThumbCenter;
        rightThumbOffset = endThumbCenter;
        break;
      case TextDirection.rtl:
        leftThumbOffset = endThumbCenter;
        rightThumbOffset = startThumbCenter;
        break;
1821
    }
1822 1823 1824 1825 1826 1827 1828 1829

    final Rect trackRect = getPreferredRect(
      parentBox: parentBox,
      offset: offset,
      sliderTheme: sliderTheme,
      isEnabled: isEnabled,
      isDiscrete: isDiscrete,
    );
1830
    final Rect leftTrackSegment = Rect.fromLTRB(trackRect.left, trackRect.top, leftThumbOffset.dx, trackRect.bottom);
1831 1832
    if (!leftTrackSegment.isEmpty)
      context.canvas.drawRect(leftTrackSegment, inactivePaint);
1833
    final Rect middleTrackSegment = Rect.fromLTRB(leftThumbOffset.dx, trackRect.top, rightThumbOffset.dx, trackRect.bottom);
1834 1835
    if (!middleTrackSegment.isEmpty)
      context.canvas.drawRect(middleTrackSegment, activePaint);
1836
    final Rect rightTrackSegment = Rect.fromLTRB(rightThumbOffset.dx, trackRect.top, trackRect.right, trackRect.bottom);
1837 1838 1839 1840 1841 1842 1843 1844
    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
1845 1846
/// in the `parentBox`. The track rectangle extends to the bounds of the
/// `parentBox`, but is padded by the larger of [RoundSliderOverlayShape]'s
1847 1848 1849 1850 1851 1852 1853 1854 1855
/// 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].
///
1856
/// {@macro flutter.material.RangeSliderTickMarkShape.paint.trackSegment}
1857
///
1858 1859 1860
/// ![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)
///
1861 1862 1863 1864 1865
/// 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.
1866 1867
///  * [RangeSliderTrackShape], which can be used to create custom shapes for
///    the [RangeSlider]'s track.
1868 1869 1870 1871 1872 1873
///  * [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.
1874
  const RoundedRectRangeSliderTrackShape();
1875 1876 1877

  @override
  Rect getPreferredRect({
1878
    required RenderBox parentBox,
1879
    Offset offset = Offset.zero,
1880
    required SliderThemeData sliderTheme,
1881 1882 1883 1884 1885 1886 1887 1888 1889 1890
    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);
1891 1892
    final double overlayWidth = sliderTheme.overlayShape!.getPreferredSize(isEnabled, isDiscrete).width;
    final double trackHeight = sliderTheme.trackHeight!;
1893 1894 1895 1896 1897
    assert(overlayWidth >= 0);
    assert(trackHeight >= 0);

    final double trackLeft = offset.dx + overlayWidth / 2;
    final double trackTop = offset.dy + (parentBox.size.height - trackHeight) / 2;
1898 1899 1900 1901
    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);
1902
  }
1903

1904 1905 1906 1907
  @override
  void paint(
    PaintingContext context,
    Offset offset, {
1908 1909 1910 1911 1912
    required RenderBox parentBox,
    required SliderThemeData sliderTheme,
    required Animation<double> enableAnimation,
    required Offset startThumbCenter,
    required Offset endThumbCenter,
1913 1914
    bool isEnabled = false,
    bool isDiscrete = false,
1915
    required TextDirection textDirection,
1916
    double additionalActiveTrackHeight = 2,
1917 1918 1919 1920 1921 1922 1923 1924 1925 1926 1927 1928 1929 1930 1931 1932
  }) {
    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);
1933

1934
    if (sliderTheme.trackHeight == null || sliderTheme.trackHeight! <= 0) {
1935 1936 1937
      return;
    }

1938 1939
    // Assign the track segment paints, which are left: active, right: inactive,
    // but reversed for right to left text.
1940 1941
    final ColorTween activeTrackColorTween = ColorTween(
      begin: sliderTheme.disabledActiveTrackColor,
1942 1943
      end: sliderTheme.activeTrackColor,
    );
1944 1945
    final ColorTween inactiveTrackColorTween = ColorTween(
      begin: sliderTheme.disabledInactiveTrackColor,
1946 1947
      end: sliderTheme.inactiveTrackColor,
    );
1948
    final Paint activePaint = Paint()
1949
      ..color = activeTrackColorTween.evaluate(enableAnimation)!;
1950
    final Paint inactivePaint = Paint()
1951
      ..color = inactiveTrackColorTween.evaluate(enableAnimation)!;
1952

1953 1954
    final Offset leftThumbOffset;
    final Offset rightThumbOffset;
1955 1956
    switch (textDirection) {
      case TextDirection.ltr:
1957 1958
        leftThumbOffset = startThumbCenter;
        rightThumbOffset = endThumbCenter;
1959 1960
        break;
      case TextDirection.rtl:
1961 1962
        leftThumbOffset = endThumbCenter;
        rightThumbOffset = startThumbCenter;
1963 1964
        break;
    }
1965
    final Size thumbSize = sliderTheme.rangeThumbShape!.getPreferredSize(isEnabled, isDiscrete);
1966 1967
    final double thumbRadius = thumbSize.width / 2;
    assert(thumbRadius > 0);
1968 1969

    final Rect trackRect = getPreferredRect(
1970 1971 1972 1973 1974
      parentBox: parentBox,
      offset: offset,
      sliderTheme: sliderTheme,
      isEnabled: isEnabled,
      isDiscrete: isDiscrete,
1975
    );
1976

1977 1978 1979 1980 1981 1982 1983 1984 1985 1986 1987 1988 1989 1990 1991 1992 1993 1994 1995 1996 1997 1998 1999 2000 2001 2002 2003 2004 2005 2006 2007 2008 2009
    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,
    );
2010 2011 2012
  }
}

2013
/// The default shape of each [Slider] tick mark.
2014 2015
///
/// Tick marks are only displayed if the slider is discrete, which can be done
2016
/// by setting the [Slider.divisions] to an integer value.
2017 2018 2019 2020 2021 2022 2023 2024 2025
///
/// 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].
///
nt4f04uNd's avatar
nt4f04uNd committed
2026
/// ![A slider widget, consisting of 5 divisions and showing the round slider tick mark shape.]
2027 2028
/// (https://flutter.github.io/assets-for-api-docs/assets/material/rounded_slider_tick_mark_shape.png)
///
2029 2030 2031 2032 2033 2034
/// 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 {
2035
  /// Create a slider tick mark that draws a circle.
2036 2037 2038
  const RoundSliderTickMarkShape({
    this.tickMarkRadius,
  });
2039 2040 2041

  /// The preferred radius of the round tick mark.
  ///
2042
  /// If it is not provided, then 1/4 of the [SliderThemeData.trackHeight] is used.
2043
  final double? tickMarkRadius;
2044 2045

  @override
2046
  Size getPreferredSize({
2047
    required SliderThemeData sliderTheme,
2048
    required bool isEnabled,
2049 2050 2051 2052
  }) {
    assert(sliderTheme != null);
    assert(sliderTheme.trackHeight != null);
    assert(isEnabled != null);
2053 2054
    // The tick marks are tiny circles. If no radius is provided, then the
    // radius is defaulted to be a fraction of the
2055
    // [SliderThemeData.trackHeight]. The fraction is 1/4.
2056
    return Size.fromRadius(tickMarkRadius ?? sliderTheme.trackHeight! / 4);
2057 2058 2059 2060 2061 2062
  }

  @override
  void paint(
    PaintingContext context,
    Offset center, {
2063 2064 2065 2066 2067
    required RenderBox parentBox,
    required SliderThemeData sliderTheme,
    required Animation<double> enableAnimation,
    required TextDirection textDirection,
    required Offset thumbCenter,
2068
    required bool isEnabled,
2069 2070 2071 2072 2073 2074 2075 2076 2077 2078 2079 2080 2081 2082 2083
  }) {
    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.
2084 2085
    Color? begin;
    Color? end;
2086 2087 2088 2089 2090 2091 2092 2093 2094 2095 2096 2097
    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;
    }
2098
    final Paint paint = Paint()..color = ColorTween(begin: begin, end: end).evaluate(enableAnimation)!;
2099 2100 2101

    // The tick marks are tiny circles that are the same height as the track.
    final double tickMarkRadius = getPreferredSize(
2102 2103 2104
       isEnabled: isEnabled,
       sliderTheme: sliderTheme,
     ).width / 2;
2105 2106 2107 2108 2109 2110 2111 2112 2113 2114 2115 2116 2117 2118 2119 2120 2121 2122 2123
    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].
///
2124 2125 2126
/// ![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 )
///
2127 2128 2129 2130 2131 2132 2133
/// 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.
2134 2135 2136
  const RoundRangeSliderTickMarkShape({
    this.tickMarkRadius,
  });
2137 2138 2139

  /// The preferred radius of the round tick mark.
  ///
2140
  /// If it is not provided, then 1/4 of the [SliderThemeData.trackHeight] is used.
2141
  final double? tickMarkRadius;
2142 2143 2144

  @override
  Size getPreferredSize({
2145
    required SliderThemeData sliderTheme,
2146 2147 2148 2149 2150
    bool isEnabled = false,
  }) {
    assert(sliderTheme != null);
    assert(sliderTheme.trackHeight != null);
    assert(isEnabled != null);
2151
    return Size.fromRadius(tickMarkRadius ?? sliderTheme.trackHeight! / 4);
2152 2153 2154 2155 2156 2157
  }

  @override
  void paint(
    PaintingContext context,
    Offset center, {
2158 2159 2160 2161 2162
    required RenderBox parentBox,
    required SliderThemeData sliderTheme,
    required Animation<double> enableAnimation,
    required Offset startThumbCenter,
    required Offset endThumbCenter,
2163
    bool isEnabled = false,
2164
    required TextDirection textDirection,
2165 2166 2167 2168 2169 2170 2171 2172 2173 2174 2175 2176 2177 2178 2179
  }) {
    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);

2180
    final bool isBetweenThumbs;
2181 2182 2183 2184 2185 2186 2187 2188
    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;
    }
2189 2190 2191
    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)!;
2192 2193 2194 2195 2196 2197 2198 2199 2200 2201 2202 2203 2204 2205 2206 2207 2208 2209 2210 2211 2212 2213

    // 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({
2214 2215
    required SliderThemeData sliderTheme,
    required bool isEnabled,
2216 2217 2218 2219 2220 2221 2222 2223
  }) {
    return Size.zero;
  }

  @override
  void paint(
    PaintingContext context,
    Offset center, {
2224 2225 2226 2227
    required RenderBox parentBox,
    required SliderThemeData sliderTheme,
    required Animation<double> enableAnimation,
    required Offset thumbCenter,
2228
    required bool isEnabled,
2229
    required TextDirection textDirection,
2230 2231 2232 2233 2234 2235 2236 2237 2238 2239 2240 2241
  }) {
    // 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
2242
/// skipped.  When this value is specified for [SliderThemeData.overlayShape],
2243 2244 2245 2246 2247 2248 2249 2250 2251
/// 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, {
2252 2253 2254 2255 2256 2257 2258 2259 2260 2261
    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,
2262 2263 2264 2265 2266 2267 2268
  }) {
    // no-op.
  }
}

/// The default shape of a [Slider]'s thumb.
///
2269
/// There is a shadow for the resting, pressed, hovered, and focused state.
2270
///
2271 2272 2273
/// ![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)
///
2274 2275 2276 2277 2278 2279 2280 2281 2282 2283
/// 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,
2284 2285
    this.elevation = 1.0,
    this.pressedElevation = 6.0,
2286 2287 2288 2289 2290 2291 2292 2293 2294 2295 2296
  });

  /// 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]
2297
  final double? disabledThumbRadius;
2298 2299 2300 2301 2302 2303 2304 2305 2306 2307 2308 2309 2310 2311 2312 2313 2314 2315 2316
  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;

2317 2318 2319
  @override
  Size getPreferredSize(bool isEnabled, bool isDiscrete) {
    return Size.fromRadius(isEnabled == true ? enabledThumbRadius : _disabledThumbRadius);
2320 2321 2322 2323 2324 2325
  }

  @override
  void paint(
    PaintingContext context,
    Offset center, {
2326
    required Animation<double> activationAnimation,
2327
    required Animation<double> enableAnimation,
2328 2329 2330
    required bool isDiscrete,
    required TextPainter labelPainter,
    required RenderBox parentBox,
2331
    required SliderThemeData sliderTheme,
2332 2333 2334 2335
    required TextDirection textDirection,
    required double value,
    required double textScaleFactor,
    required Size sizeWithOverflow,
2336
  }) {
2337 2338 2339
    assert(context != null);
    assert(center != null);
    assert(enableAnimation != null);
2340 2341 2342
    assert(sliderTheme != null);
    assert(sliderTheme.disabledThumbColor != null);
    assert(sliderTheme.thumbColor != null);
2343

2344 2345 2346 2347 2348 2349 2350 2351 2352
    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,
    );
2353

2354
    final Color color = colorTween.evaluate(enableAnimation)!;
2355 2356
    final double radius = radiusTween.evaluate(enableAnimation);

2357 2358 2359 2360 2361
    final Tween<double> elevationTween = Tween<double>(
      begin: elevation,
      end: pressedElevation,
    );

2362
    final double evaluatedElevation = elevationTween.evaluate(activationAnimation);
2363 2364 2365
    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);
2366

2367 2368
    canvas.drawCircle(
      center,
2369 2370
      radius,
      Paint()..color = color,
2371
    );
2372 2373 2374
  }
}

2375
/// The default shape of a [RangeSlider]'s thumbs.
2376
///
2377
/// There is a shadow for the resting and pressed state.
2378
///
2379 2380 2381
/// ![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)
///
2382 2383
/// See also:
///
2384 2385 2386 2387
///  * [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 {
2388
  /// Create a slider thumb that draws a circle.
2389
  const RoundRangeSliderThumbShape({
2390
    this.enabledThumbRadius = 10.0,
2391
    this.disabledThumbRadius,
2392 2393
    this.elevation = 1.0,
    this.pressedElevation = 6.0,
2394
  }) : assert(enabledThumbRadius != null);
2395 2396 2397

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

2401 2402
  /// The preferred radius of the round thumb shape when the slider is disabled.
  ///
2403
  /// If no disabledRadius is provided, then it is equal to the
2404
  /// [enabledThumbRadius].
2405
  final double? disabledThumbRadius;
2406 2407 2408 2409 2410 2411 2412 2413 2414 2415 2416
  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;
2417 2418 2419

  @override
  Size getPreferredSize(bool isEnabled, bool isDiscrete) {
2420
    return Size.fromRadius(isEnabled == true ? enabledThumbRadius : _disabledThumbRadius);
2421 2422 2423 2424 2425
  }

  @override
  void paint(
    PaintingContext context,
2426
    Offset center, {
2427 2428
    required Animation<double> activationAnimation,
    required Animation<double> enableAnimation,
2429
    bool isDiscrete = false,
2430
    bool isEnabled = false,
2431 2432 2433 2434 2435
    bool? isOnTop,
    required SliderThemeData sliderTheme,
    TextDirection? textDirection,
    Thumb? thumb,
    bool? isPressed,
2436
  }) {
2437 2438 2439 2440
    assert(context != null);
    assert(center != null);
    assert(activationAnimation != null);
    assert(sliderTheme != null);
2441 2442 2443
    assert(sliderTheme.showValueIndicator != null);
    assert(sliderTheme.overlappingShapeStrokeColor != null);
    assert(enableAnimation != null);
2444
    final Canvas canvas = context.canvas;
2445
    final Tween<double> radiusTween = Tween<double>(
2446
      begin: _disabledThumbRadius,
2447
      end: enabledThumbRadius,
2448
    );
2449
    final ColorTween colorTween = ColorTween(
2450 2451 2452
      begin: sliderTheme.disabledThumbColor,
      end: sliderTheme.thumbColor,
    );
2453
    final double radius = radiusTween.evaluate(enableAnimation);
2454 2455 2456 2457
    final Tween<double> elevationTween = Tween<double>(
      begin: elevation,
      end: pressedElevation,
    );
2458 2459 2460

    // Add a stroke of 1dp around the circle if this thumb would overlap
    // the other thumb.
2461
    if (isOnTop ?? false) {
2462
      final Paint strokePaint = Paint()
2463
        ..color = sliderTheme.overlappingShapeStrokeColor!
2464 2465 2466
        ..strokeWidth = 1.0
        ..style = PaintingStyle.stroke;
      canvas.drawCircle(center, radius, strokePaint);
2467 2468
    }

2469
    final Color color = colorTween.evaluate(enableAnimation)!;
2470

2471
    final double evaluatedElevation = isPressed! ? elevationTween.evaluate(activationAnimation) : elevation;
2472 2473 2474
    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);
2475

2476
    canvas.drawCircle(
2477
      center,
2478
      radius,
2479
      Paint()..color = color,
2480 2481 2482 2483
    );
  }
}

2484
/// The default shape of a [Slider]'s thumb overlay.
2485 2486 2487 2488 2489 2490 2491 2492
///
/// 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].
2493 2494 2495
///
/// See also:
///
2496 2497 2498 2499 2500
///  * [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.
2501
  const RoundSliderOverlayShape({ this.overlayRadius = 24.0 });
2502

2503 2504
  /// The preferred radius of the round thumb shape when enabled.
  ///
2505 2506
  /// If it is not provided, then half of the [SliderThemeData.trackHeight] is
  /// used.
2507
  final double overlayRadius;
2508 2509 2510

  @override
  Size getPreferredSize(bool isEnabled, bool isDiscrete) {
2511
    return Size.fromRadius(overlayRadius);
2512 2513 2514 2515 2516 2517
  }

  @override
  void paint(
    PaintingContext context,
    Offset center, {
2518 2519
    required Animation<double> activationAnimation,
    required Animation<double> enableAnimation,
2520
    required bool isDiscrete,
2521 2522 2523 2524 2525
    required TextPainter labelPainter,
    required RenderBox parentBox,
    required SliderThemeData sliderTheme,
    required TextDirection textDirection,
    required double value,
2526 2527
    required double textScaleFactor,
    required Size sizeWithOverflow,
2528
  }) {
2529 2530 2531 2532 2533 2534 2535 2536 2537
    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);
2538

2539 2540 2541
    final Canvas canvas = context.canvas;
    final Tween<double> radiusTween = Tween<double>(
      begin: 0.0,
2542
      end: overlayRadius,
2543 2544 2545 2546 2547
    );

    canvas.drawCircle(
      center,
      radiusTween.evaluate(activationAnimation),
2548
      Paint()..color = sliderTheme.overlayColor!,
2549 2550 2551 2552
    );
  }
}

2553
/// The default shape of a [Slider]'s value indicator.
2554
///
2555 2556 2557
/// ![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)
///
2558 2559 2560 2561 2562
/// 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.
2563 2564 2565 2566 2567 2568 2569 2570
class RectangularSliderValueIndicatorShape extends SliderComponentShape {
  /// Create a slider value indicator that resembles a rectangular tooltip.
  const RectangularSliderValueIndicatorShape();

  static const _RectangularSliderValueIndicatorPathPainter _pathPainter = _RectangularSliderValueIndicatorPathPainter();

  @override
  Size getPreferredSize(
2571 2572 2573 2574
    bool isEnabled,
    bool isDiscrete, {
    TextPainter? labelPainter,
    double? textScaleFactor,
2575
  }) {
2576 2577 2578
    assert(labelPainter != null);
    assert(textScaleFactor != null && textScaleFactor >= 0);
    return _pathPainter.getPreferredSize(labelPainter!, textScaleFactor!);
2579 2580 2581 2582 2583 2584
  }

  @override
  void paint(
    PaintingContext context,
    Offset center, {
2585 2586 2587 2588
    required Animation<double> activationAnimation,
    required Animation<double> enableAnimation,
    required bool isDiscrete,
    required TextPainter labelPainter,
2589
    required RenderBox parentBox,
2590 2591 2592 2593 2594
    required SliderThemeData sliderTheme,
    required TextDirection textDirection,
    required double value,
    required double textScaleFactor,
    required Size sizeWithOverflow,
2595 2596
  }) {
    final Canvas canvas = context.canvas;
2597
    final double scale = activationAnimation.value;
2598 2599 2600 2601 2602
    _pathPainter.paint(
      parentBox: parentBox,
      canvas: canvas,
      center: center,
      scale: scale,
2603 2604 2605
      labelPainter: labelPainter,
      textScaleFactor: textScaleFactor,
      sizeWithOverflow: sizeWithOverflow,
2606 2607
      backgroundPaintColor: sliderTheme.valueIndicatorColor!,
    );
2608 2609 2610 2611 2612
  }
}

/// The default shape of a [RangeSlider]'s value indicators.
///
2613 2614 2615
/// ![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)
///
2616 2617 2618 2619 2620 2621 2622 2623 2624 2625 2626 2627 2628 2629 2630 2631
/// 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, {
2632 2633
    required TextPainter labelPainter,
    required double textScaleFactor,
2634 2635 2636
  }) {
    assert(labelPainter != null);
    assert(textScaleFactor != null && textScaleFactor >= 0);
2637
    return _pathPainter.getPreferredSize(labelPainter, textScaleFactor);
2638 2639 2640 2641
  }

  @override
  double getHorizontalShift({
2642 2643 2644 2645 2646 2647
    RenderBox? parentBox,
    Offset? center,
    TextPainter? labelPainter,
    Animation<double>? activationAnimation,
    double? textScaleFactor,
    Size? sizeWithOverflow,
2648 2649
  }) {
    return _pathPainter.getHorizontalShift(
2650 2651 2652 2653 2654 2655
      parentBox: parentBox!,
      center: center!,
      labelPainter: labelPainter!,
      textScaleFactor: textScaleFactor!,
      sizeWithOverflow: sizeWithOverflow!,
      scale: activationAnimation!.value,
2656 2657 2658 2659 2660 2661 2662
    );
  }

  @override
  void paint(
    PaintingContext context,
    Offset center, {
2663 2664 2665 2666 2667 2668 2669 2670 2671 2672 2673 2674
    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,
2675 2676
  }) {
    final Canvas canvas = context.canvas;
2677
    final double scale = activationAnimation!.value;
2678
    _pathPainter.paint(
2679
      parentBox: parentBox!,
2680 2681 2682
      canvas: canvas,
      center: center,
      scale: scale,
2683 2684 2685 2686 2687
      labelPainter: labelPainter!,
      textScaleFactor: textScaleFactor!,
      sizeWithOverflow: sizeWithOverflow!,
      backgroundPaintColor: sliderTheme!.valueIndicatorColor!,
      strokePaintColor: isOnTop! ? sliderTheme.overlappingShapeStrokeColor : null,
2688 2689 2690 2691 2692 2693 2694 2695 2696 2697 2698 2699 2700 2701 2702 2703 2704 2705 2706 2707 2708 2709 2710 2711 2712 2713 2714
    );
  }
}

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({
2715 2716 2717 2718 2719 2720
    required RenderBox parentBox,
    required Offset center,
    required TextPainter labelPainter,
    required double textScaleFactor,
    required Size sizeWithOverflow,
    required double scale,
2721 2722
  }) {
    assert(!sizeWithOverflow.isEmpty);
2723

2724 2725
    const double edgePadding = 8.0;
    final double rectangleWidth = _upperRectangleWidth(labelPainter, scale, textScaleFactor);
2726 2727 2728
    /// 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);
2729 2730 2731 2732 2733

    // 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.
2734 2735
    final double overflowLeft = math.max(0, rectangleWidth / 2 - globalCenter.dx + edgePadding);
    final double overflowRight = math.max(0, rectangleWidth / 2 - (sizeWithOverflow.width - globalCenter.dx - edgePadding));
2736 2737 2738 2739 2740 2741 2742 2743 2744 2745 2746 2747 2748 2749 2750 2751

    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({
2752 2753 2754 2755 2756 2757 2758 2759 2760
    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,
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 2803 2804 2805 2806 2807 2808 2809 2810 2811 2812 2813 2814 2815 2816 2817 2818 2819 2820 2821
  }) {
    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.
///
2822 2823 2824
/// ![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)
///
2825 2826 2827 2828 2829
/// 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.
2830
class PaddleSliderValueIndicatorShape extends SliderComponentShape {
2831
  /// Create a slider value indicator in the shape of an upside-down pear.
2832 2833
  const PaddleSliderValueIndicatorShape();

2834
  static const _PaddleSliderValueIndicatorPathPainter _pathPainter = _PaddleSliderValueIndicatorPathPainter();
2835 2836

  @override
2837 2838 2839 2840 2841 2842
  Size getPreferredSize(
    bool isEnabled,
    bool isDiscrete, {
    TextPainter? labelPainter,
    double? textScaleFactor,
  }) {
2843
    assert(labelPainter != null);
2844
    assert(textScaleFactor != null && textScaleFactor >= 0);
2845
    return _pathPainter.getPreferredSize(labelPainter!, textScaleFactor!);
2846 2847 2848 2849 2850 2851
  }

  @override
  void paint(
    PaintingContext context,
    Offset center, {
2852 2853 2854 2855 2856 2857 2858 2859 2860 2861
    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,
2862 2863 2864 2865 2866 2867 2868 2869
  }) {
    assert(context != null);
    assert(center != null);
    assert(activationAnimation != null);
    assert(enableAnimation != null);
    assert(labelPainter != null);
    assert(parentBox != null);
    assert(sliderTheme != null);
2870
    assert(!sizeWithOverflow.isEmpty);
2871
    final ColorTween enableColor = ColorTween(
2872
      begin: sliderTheme.disabledThumbColor,
2873 2874
      end: sliderTheme.valueIndicatorColor,
    );
2875
    _pathPainter.paint(
2876 2877
      context.canvas,
      center,
2878 2879 2880 2881 2882
      Paint()..color = enableColor.evaluate(enableAnimation)!,
      activationAnimation.value,
      labelPainter,
      textScaleFactor,
      sizeWithOverflow,
2883 2884 2885 2886 2887
      null,
    );
  }
}

2888 2889
/// A variant shape of a [RangeSlider]'s value indicators. The value indicator
/// is in the shape of an upside-down pear.
2890
///
2891 2892 2893
/// ![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)
///
2894 2895 2896 2897 2898 2899 2900 2901 2902
/// 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();

2903
  static const _PaddleSliderValueIndicatorPathPainter _pathPainter = _PaddleSliderValueIndicatorPathPainter();
2904 2905

  @override
2906 2907 2908
  Size getPreferredSize(
    bool isEnabled,
    bool isDiscrete, {
2909 2910
    required TextPainter labelPainter,
    required double textScaleFactor,
2911
  }) {
2912
    assert(labelPainter != null);
2913
    assert(textScaleFactor != null && textScaleFactor >= 0);
2914
    return _pathPainter.getPreferredSize(labelPainter, textScaleFactor);
2915 2916
  }

2917 2918
  @override
  double getHorizontalShift({
2919 2920 2921 2922 2923 2924
    RenderBox? parentBox,
    Offset? center,
    TextPainter? labelPainter,
    Animation<double>? activationAnimation,
    double? textScaleFactor,
    Size? sizeWithOverflow,
2925 2926
  }) {
    return _pathPainter.getHorizontalShift(
2927 2928 2929 2930 2931
      center: center!,
      labelPainter: labelPainter!,
      scale: activationAnimation!.value,
      textScaleFactor: textScaleFactor!,
      sizeWithOverflow: sizeWithOverflow!,
2932 2933 2934
    );
  }

2935 2936 2937 2938
  @override
  void paint(
    PaintingContext context,
    Offset center, {
2939 2940 2941
    required Animation<double> activationAnimation,
    required Animation<double> enableAnimation,
    bool? isDiscrete,
2942
    bool isOnTop = false,
2943 2944 2945 2946 2947 2948 2949 2950
    required TextPainter labelPainter,
    required RenderBox parentBox,
    required SliderThemeData sliderTheme,
    TextDirection? textDirection,
    Thumb? thumb,
    double? value,
    double? textScaleFactor,
    Size? sizeWithOverflow,
2951 2952 2953 2954 2955 2956 2957 2958
  }) {
    assert(context != null);
    assert(center != null);
    assert(activationAnimation != null);
    assert(enableAnimation != null);
    assert(labelPainter != null);
    assert(parentBox != null);
    assert(sliderTheme != null);
2959
    assert(!sizeWithOverflow!.isEmpty);
2960 2961 2962 2963 2964
    final ColorTween enableColor = ColorTween(
      begin: sliderTheme.disabledThumbColor,
      end: sliderTheme.valueIndicatorColor,
    );
    // Add a stroke of 1dp around the top paddle.
2965
    _pathPainter.paint(
2966 2967
      context.canvas,
      center,
2968
      Paint()..color = enableColor.evaluate(enableAnimation)!,
2969 2970
      activationAnimation.value,
      labelPainter,
2971 2972
      textScaleFactor!,
      sizeWithOverflow!,
2973 2974 2975 2976 2977
      isOnTop ? sliderTheme.overlappingShapeStrokeColor : null,
    );
  }
}

2978 2979
class _PaddleSliderValueIndicatorPathPainter {
  const _PaddleSliderValueIndicatorPathPainter();
2980

2981 2982 2983 2984 2985 2986 2987 2988
  // 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;
2989
  static const double _minLabelWidth = 16.0;
2990
  // Radius of the bottom lobe of the value indicator.
2991
  static const double _bottomLobeRadius = 10.0;
2992 2993
  static const double _labelPadding = 8.0;
  static const double _distanceBetweenTopBottomCenters = 40.0;
2994
  static const double _middleNeckWidth = 3.0;
2995 2996 2997 2998 2999 3000
  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;
3001
  static const Offset _topLobeCenter = Offset(0.0, -_distanceBetweenTopBottomCenters);
3002
  static const double _topNeckRadius = 13.0;
3003 3004 3005 3006 3007 3008 3009 3010
  // 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;
3011
  static const double _preferredHeight = _distanceBetweenTopBottomCenters + _topLobeRadius + _bottomLobeRadius;
3012 3013 3014 3015 3016
  // 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;
3017

3018 3019
  Size getPreferredSize(
    TextPainter labelPainter,
3020
    double textScaleFactor,
3021 3022
  ) {
    assert(labelPainter != null);
3023 3024 3025
    assert(textScaleFactor != null && textScaleFactor >= 0);
    final double width = math.max(_minLabelWidth * textScaleFactor, labelPainter.width) + _labelPadding * 2 * textScaleFactor;
    return Size(width, _preferredHeight * textScaleFactor);
3026
  }
3027 3028 3029 3030

  // 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) {
3031
    assert(center.isFinite);
3032
    final Rect arcRect = Rect.fromCircle(center: center, radius: radius);
3033 3034 3035
    path.arcTo(arcRect, startAngle, endAngle - startAngle, false);
  }

3036
  double getHorizontalShift({
3037 3038 3039 3040 3041
    required Offset center,
    required TextPainter labelPainter,
    required double scale,
    required double textScaleFactor,
    required Size sizeWithOverflow,
3042
  }) {
3043
    assert(!sizeWithOverflow.isEmpty);
3044 3045 3046 3047 3048
    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),
3049
    );
3050
    final double shift = _getIdealOffset(halfWidthNeeded, textScaleFactor * scale, center, sizeWithOverflow.width);
3051
    return shift * textScaleFactor;
3052 3053
  }

3054 3055
  // 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.
3056 3057 3058 3059
  double _getIdealOffset(
    double halfWidthNeeded,
    double scale,
    Offset center,
3060
    double widthWithOverflow,
3061
  ) {
3062
    const double edgeMargin = 8.0;
3063
    final Rect topLobeRect = Rect.fromLTWH(
3064 3065 3066 3067 3068 3069 3070 3071 3072 3073
      -_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;
3074

3075 3076
    if (topLeft.dx < edgeMargin) {
      shift = edgeMargin - topLeft.dx;
3077
    }
3078

3079
    final double endGlobal = widthWithOverflow;
3080 3081
    if (bottomRight.dx > endGlobal - edgeMargin) {
      shift = endGlobal - edgeMargin - bottomRight.dx;
3082
    }
3083

3084
    shift = scale == 0.0 ? 0.0 : shift / scale;
3085 3086 3087 3088 3089 3090 3091
    if (shift < 0.0) {
      // Shifting to the left.
      shift = math.max(shift, -halfWidthNeeded);
    } else {
      // Shifting to the right.
      shift = math.min(shift, halfWidthNeeded);
    }
3092 3093 3094
    return shift;
  }

3095
  void paint(
3096 3097 3098 3099 3100
    Canvas canvas,
    Offset center,
    Paint paint,
    double scale,
    TextPainter labelPainter,
3101 3102
    double textScaleFactor,
    Size sizeWithOverflow,
3103
    Color? strokePaintColor,
3104
  ) {
3105 3106 3107 3108 3109
    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;
    }
3110
    assert(!sizeWithOverflow.isEmpty);
3111

3112
    // The entire value indicator should scale with the size of the label,
3113
    // to keep it large enough to encompass the label text.
3114 3115
    final double overallScale = scale * textScaleFactor;
    final double inverseTextScale = textScaleFactor != 0 ? 1.0 / textScaleFactor : 0.0;
3116 3117
    final double labelHalfWidth = labelPainter.width / 2.0;

3118 3119 3120 3121 3122 3123 3124 3125 3126 3127 3128 3129 3130 3131 3132 3133 3134 3135 3136 3137 3138 3139 3140 3141 3142 3143 3144 3145 3146 3147
    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,
    );

3148 3149
    // 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.
3150 3151 3152 3153 3154
    final double halfWidthNeeded = math.max(
      0.0,
      inverseTextScale * labelHalfWidth - (_topLobeRadius - _labelPadding),
    );

3155
    final double shift = _getIdealOffset( halfWidthNeeded, overallScale, center, sizeWithOverflow.width);
3156 3157
    final double leftWidthNeeded = halfWidthNeeded - shift;
    final double rightWidthNeeded = halfWidthNeeded + shift;
3158

3159 3160
    // The parameter that describes how far along the transition from round to
    // stretched we are.
3161 3162
    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));
3163
    // The angle between the top neck arc's center and the top lobe's center
3164 3165
    // and vertical. The base amount is chosen so that the neck is smooth,
    // even when the lobe is shifted due to its size.
3166 3167
    final double leftTheta = (1.0 - leftAmount) * _thirtyDegrees;
    final double rightTheta = (1.0 - rightAmount) * _thirtyDegrees;
3168
    // The center of the top left neck arc.
3169 3170
    final Offset leftTopNeckCenter = Offset(
      -_neckTriangleBase,
3171 3172
      _topLobeCenter.dy + math.cos(leftTheta) * _neckTriangleHypotenuse,
    );
3173
    final Offset neckRightCenter = Offset(
3174
      _neckTriangleBase,
3175 3176 3177 3178
      _topLobeCenter.dy + math.cos(rightTheta) * _neckTriangleHypotenuse,
    );
    final double leftNeckArcAngle = _ninetyDegrees - leftTheta;
    final double rightNeckArcAngle = math.pi + _ninetyDegrees - rightTheta;
3179 3180 3181
    // 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.
3182
    final double neckStretchBaseline = math.max(0.0, rightBottomNeckCenterY - math.max(leftTopNeckCenter.dy, neckRightCenter.dy));
3183
    final double t = math.pow(inverseTextScale, 3.0) as double;
3184
    final double stretch = (neckStretchBaseline * t).clamp(0.0, 10.0 * neckStretchBaseline);
3185
    final Offset neckStretch = Offset(0.0, neckStretchBaseline - stretch);
3186

3187 3188 3189 3190 3191 3192 3193 3194 3195 3196 3197 3198 3199 3200 3201 3202
    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;
    }());
3203

3204 3205
    _addArc(
      path,
3206
      leftTopNeckCenter + neckStretch,
3207 3208
      _topNeckRadius,
      0.0,
3209 3210 3211 3212
      -leftNeckArcAngle,
    );
    _addArc(
      path,
3213
      _topLobeCenter - Offset(leftWidthNeeded, 0.0) + neckStretch,
3214 3215 3216 3217 3218 3219
      _topLobeRadius,
      _ninetyDegrees + leftTheta,
      _twoSeventyDegrees,
    );
    _addArc(
      path,
3220
      _topLobeCenter + Offset(rightWidthNeeded, 0.0) + neckStretch,
3221 3222 3223
      _topLobeRadius,
      _twoSeventyDegrees,
      _twoSeventyDegrees + math.pi - rightTheta,
3224 3225 3226
    );
    _addArc(
      path,
3227
      neckRightCenter + neckStretch,
3228
      _topNeckRadius,
3229
      rightNeckArcAngle,
3230 3231
      math.pi,
    );
3232 3233 3234 3235 3236 3237 3238 3239 3240

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

3241 3242 3243 3244
    canvas.drawPath(path, paint);

    // Draw the label.
    canvas.save();
3245
    canvas.translate(shift, -_distanceBetweenTopBottomCenters + neckStretch.dy);
3246
    canvas.scale(inverseTextScale, inverseTextScale);
3247
    labelPainter.paint(canvas, Offset.zero - Offset(labelHalfWidth, labelPainter.height / 2.0));
3248 3249 3250
    canvas.restore();
    canvas.restore();
  }
3251
}
3252

3253
/// A callback that formats a numeric value from a [Slider] or [RangeSlider] widget.
3254 3255 3256
///
/// See also:
///
3257
///  * [Slider.semanticFormatterCallback], which shows an example use case.
3258
///  * [RangeSlider.semanticFormatterCallback], which shows an example use case.
3259
typedef SemanticFormatterCallback = String Function(double value);
3260 3261 3262 3263 3264 3265 3266

/// 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.
///
3267
/// Override [SliderThemeData.thumbSelector] for custom thumb selection.
3268
typedef RangeThumbSelector = Thumb? Function(
3269 3270 3271 3272 3273 3274 3275
  TextDirection textDirection,
  RangeValues values,
  double tapValue,
  Size thumbSize,
  Size trackSize,
  double dx,
);
3276 3277 3278 3279

/// Object for representing range slider thumb values.
///
/// This object is passed into [RangeSlider.values] to set its values, and it
3280
/// is emitted in [RangeSlider.onChanged], [RangeSlider.onChangeStart], and
3281
/// [RangeSlider.onChangeEnd] when the values change.
3282
@immutable
3283 3284 3285 3286 3287 3288 3289 3290 3291 3292 3293 3294 3295 3296 3297 3298 3299 3300 3301 3302
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;
3303 3304 3305
    return other is RangeValues
        && other.start == start
        && other.end == end;
3306 3307 3308
  }

  @override
3309
  int get hashCode => Object.hash(start, end);
3310 3311 3312

  @override
  String toString() {
3313
    return '${objectRuntimeType(this, 'RangeValues')}($start, $end)';
3314 3315 3316 3317 3318 3319
  }
}

/// Object for setting range slider label values that appear in the value
/// indicator for each thumb.
///
3320
/// Used in combination with [SliderThemeData.showValueIndicator] to display
3321
/// labels above the thumbs.
3322
@immutable
3323 3324 3325 3326 3327 3328 3329 3330 3331 3332 3333 3334 3335 3336 3337 3338 3339 3340 3341 3342
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;
3343 3344 3345
    return other is RangeLabels
        && other.start == start
        && other.end == end;
3346 3347 3348
  }

  @override
3349
  int get hashCode => Object.hash(start, end);
3350 3351 3352

  @override
  String toString() {
3353
    return '${objectRuntimeType(this, 'RangeLabels')}($start, $end)';
3354
  }
3355
}