[Material] Create a themable Range Slider (continuous and discrete) (#31681)

Creates a Material Design range slider.

The range slider is based off the updated slider, with the main difference being that it has 2 thumbs.
By default, the thumbs cannot pass each other and both the thumb and the value indicator create a stroke when they are overlapping for better visibility.

packages/flutter/lib/material.dart

@@ -87,6 +87,7 @@ export 'src/material/progress_indicator.dart';
 export 'src/material/radio.dart';
 export 'src/material/radio_list_tile.dart';
 export 'src/material/raised_button.dart';
+export 'src/material/range_slider.dart';
 export 'src/material/refresh_indicator.dart';
 export 'src/material/reorderable_list.dart';
 export 'src/material/scaffold.dart';

packages/flutter/test/material/slider_theme_test.dart

@@ -12,6 +12,89 @@ import 'package:flutter/painting.dart';
 import '../rendering/mock_canvas.dart';
 
 void main() {
+  test('SliderThemeData copyWith, ==, hashCode basics', () {
+    expect(const SliderThemeData(), const SliderThemeData().copyWith());
+    expect(const SliderThemeData().hashCode, const SliderThemeData().copyWith().hashCode);
+  });
+
+  testWidgets('Default SliderThemeData debugFillProperties', (WidgetTester tester) async {
+    final DiagnosticPropertiesBuilder builder = DiagnosticPropertiesBuilder();
+    const SliderThemeData().debugFillProperties(builder);
+
+    final List<String> description = builder.properties
+        .where((DiagnosticsNode node) => !node.isFiltered(DiagnosticLevel.info))
+        .map((DiagnosticsNode node) => node.toString())
+        .toList();
+
+    expect(description, <String>[]);
+  });
+
+
+  testWidgets('SliderThemeData implements debugFillProperties', (WidgetTester tester) async {
+    final DiagnosticPropertiesBuilder builder = DiagnosticPropertiesBuilder();
+    const SliderThemeData(
+      trackHeight: 7.0,
+      activeTrackColor: Color(0xFF000001),
+      inactiveTrackColor: Color(0xFF000002),
+      disabledActiveTrackColor: Color(0xFF000003),
+      disabledInactiveTrackColor: Color(0xFF000004),
+      activeTickMarkColor: Color(0xFF000005),
+      inactiveTickMarkColor: Color(0xFF000006),
+      disabledActiveTickMarkColor: Color(0xFF000007),
+      disabledInactiveTickMarkColor: Color(0xFF000008),
+      thumbColor: Color(0xFF000009),
+      overlappingShapeStrokeColor: Color(0xFF000010),
+      disabledThumbColor: Color(0xFF000011),
+      overlayColor: Color(0xFF000012),
+      valueIndicatorColor: Color(0xFF000013),
+      overlayShape: RoundSliderOverlayShape(),
+      tickMarkShape: RoundSliderTickMarkShape(),
+      thumbShape: RoundSliderThumbShape(),
+      trackShape: RoundedRectSliderTrackShape(),
+      valueIndicatorShape: PaddleSliderValueIndicatorShape(),
+      rangeTickMarkShape: RoundRangeSliderTickMarkShape(),
+      rangeThumbShape: RoundRangeSliderThumbShape(),
+      rangeTrackShape: RoundedRectRangeSliderTrackShape(),
+      rangeValueIndicatorShape: PaddleRangeSliderValueIndicatorShape(),
+      showValueIndicator: ShowValueIndicator.always,
+      valueIndicatorTextStyle: TextStyle(color: Colors.black),
+    ).debugFillProperties(builder);
+
+    final List<String> description = builder.properties
+        .where((DiagnosticsNode node) => !node.isFiltered(DiagnosticLevel.info))
+        .map((DiagnosticsNode node) => node.toString())
+        .toList();
+
+    expect(description, <String>[
+      'trackHeight: 7.0',
+      'activeTrackColor: Color(0xff000001)',
+      'activeTrackColor: Color(0xff000001)',
+      'inactiveTrackColor: Color(0xff000002)',
+      'disabledActiveTrackColor: Color(0xff000003)',
+      'disabledInactiveTrackColor: Color(0xff000004)',
+      'activeTickMarkColor: Color(0xff000005)',
+      'inactiveTickMarkColor: Color(0xff000006)',
+      'disabledActiveTickMarkColor: Color(0xff000007)',
+      'disabledInactiveTickMarkColor: Color(0xff000008)',
+      'thumbColor: Color(0xff000009)',
+      'overlappingShapeStrokeColor: Color(0xff000010)',
+      'disabledThumbColor: Color(0xff000011)',
+      'overlayColor: Color(0xff000012)',
+      'valueIndicatorColor: Color(0xff000013)',
+      'overlayShape: Instance of \'RoundSliderOverlayShape\'',
+      'tickMarkShape: Instance of \'RoundSliderTickMarkShape\'',
+      'thumbShape: Instance of \'RoundSliderThumbShape\'',
+      'trackShape: Instance of \'RoundedRectSliderTrackShape\'',
+      'valueIndicatorShape: Instance of \'PaddleSliderValueIndicatorShape\'',
+      'rangeTickMarkShape: Instance of \'RoundRangeSliderTickMarkShape\'',
+      'rangeThumbShape: Instance of \'RoundRangeSliderThumbShape\'',
+      'rangeTrackShape: Instance of \'RoundedRectRangeSliderTrackShape\'',
+      'rangeValueIndicatorShape: Instance of \'PaddleRangeSliderValueIndicatorShape\'',
+      'showValueIndicator: always',
+      'valueIndicatorTextStyle: TextStyle(inherit: true, color: Color(0xff000000))'
+    ]);
+  });
+
   testWidgets('Slider uses ThemeData slider theme if present', (WidgetTester tester) async {
     final ThemeData theme = ThemeData(
       platform: TargetPlatform.android,
@@ -615,6 +698,9 @@ void main() {
         overlayShape: SliderComponentShape.noOverlay,
         thumbShape: SliderComponentShape.noThumb,
         showValueIndicator: ShowValueIndicator.never,
+        // When the track is hidden to 0 height, a tick mark radius
+        // must be provided to get a non-zero radius.
+        tickMarkShape: const RoundSliderTickMarkShape(tickMarkRadius: 1),
       ),
       value: 0.5,
       divisions: 4,
@@ -707,6 +793,8 @@ void main() {
   });
 }
 
+
+
 Widget _buildApp(
   SliderThemeData sliderTheme, {
   double value = 0.0,
@@ -730,3 +818,5 @@ Widget _buildApp(
     ),
   );
 }
+
+