Add CupertinoSlider
example (#93633)
This commit is contained in:
parent
79df99d182
commit
19a380ffe7
85
examples/api/lib/cupertino/slider/cupertino_slider.0.dart
Normal file
85
examples/api/lib/cupertino/slider/cupertino_slider.0.dart
Normal file
@ -0,0 +1,85 @@
|
|||||||
|
// Copyright 2014 The Flutter Authors. All rights reserved.
|
||||||
|
// Use of this source code is governed by a BSD-style license that can be
|
||||||
|
// found in the LICENSE file.
|
||||||
|
|
||||||
|
// Flutter code sample for CupertinoSlider
|
||||||
|
|
||||||
|
import 'package:flutter/cupertino.dart';
|
||||||
|
|
||||||
|
void main() => runApp(const MyApp());
|
||||||
|
|
||||||
|
class MyApp extends StatelessWidget {
|
||||||
|
const MyApp({Key? key}) : super(key: key);
|
||||||
|
|
||||||
|
static const String _title = 'Flutter Code Sample';
|
||||||
|
|
||||||
|
@override
|
||||||
|
Widget build(BuildContext context) {
|
||||||
|
return const CupertinoApp(
|
||||||
|
title: _title,
|
||||||
|
home: CupertinoSliderSample(),
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
class CupertinoSliderSample extends StatefulWidget {
|
||||||
|
const CupertinoSliderSample({Key? key}) : super(key: key);
|
||||||
|
|
||||||
|
@override
|
||||||
|
State<CupertinoSliderSample> createState() => _CupertinoSliderSampleState();
|
||||||
|
}
|
||||||
|
|
||||||
|
class _CupertinoSliderSampleState extends State<CupertinoSliderSample> {
|
||||||
|
double _currentSliderValue = 0.0;
|
||||||
|
String? _sliderStatus;
|
||||||
|
|
||||||
|
@override
|
||||||
|
Widget build(BuildContext context) {
|
||||||
|
return CupertinoPageScaffold(
|
||||||
|
child: Center(
|
||||||
|
child: Column(
|
||||||
|
mainAxisSize: MainAxisSize.min,
|
||||||
|
children: <Widget>[
|
||||||
|
// Display the current slider value.
|
||||||
|
Text('$_currentSliderValue'),
|
||||||
|
CupertinoSlider(
|
||||||
|
key: const Key('slider'),
|
||||||
|
value: _currentSliderValue,
|
||||||
|
// This allows the slider to jump between divisions.
|
||||||
|
// If null, the slide movement is continuous.
|
||||||
|
divisions: 5,
|
||||||
|
// The maximum slider value
|
||||||
|
max: 100,
|
||||||
|
activeColor: CupertinoColors.systemPurple,
|
||||||
|
thumbColor: CupertinoColors.systemPurple,
|
||||||
|
// This is called when sliding is started.
|
||||||
|
onChangeStart: (double value) {
|
||||||
|
setState(() {
|
||||||
|
_sliderStatus = 'Sliding';
|
||||||
|
});
|
||||||
|
},
|
||||||
|
// This is called when sliding has ended.
|
||||||
|
onChangeEnd: (double value) {
|
||||||
|
setState(() {
|
||||||
|
_sliderStatus = 'Finished sliding';
|
||||||
|
});
|
||||||
|
},
|
||||||
|
// This is called when slider value is changed.
|
||||||
|
onChanged: (double value) {
|
||||||
|
setState(() {
|
||||||
|
_currentSliderValue = value;
|
||||||
|
});
|
||||||
|
},
|
||||||
|
),
|
||||||
|
Text(
|
||||||
|
_sliderStatus ?? '',
|
||||||
|
style: CupertinoTheme.of(context).textTheme.textStyle.copyWith(
|
||||||
|
fontSize: 12,
|
||||||
|
),
|
||||||
|
),
|
||||||
|
],
|
||||||
|
),
|
||||||
|
),
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
@ -0,0 +1,31 @@
|
|||||||
|
// Copyright 2014 The Flutter Authors. All rights reserved.
|
||||||
|
// Use of this source code is governed by a BSD-style license that can be
|
||||||
|
// found in the LICENSE file.
|
||||||
|
|
||||||
|
import 'package:flutter/cupertino.dart';
|
||||||
|
import 'package:flutter_api_samples/cupertino/slider/cupertino_slider.0.dart' as example;
|
||||||
|
import 'package:flutter_test/flutter_test.dart';
|
||||||
|
|
||||||
|
void main() {
|
||||||
|
Future<void> _dragSlider(WidgetTester tester, Key sliderKey) {
|
||||||
|
final Offset topLeft = tester.getTopLeft(find.byKey(sliderKey));
|
||||||
|
const double unit = CupertinoThumbPainter.radius;
|
||||||
|
const double delta = 3.0 * unit;
|
||||||
|
return tester.dragFrom(topLeft + const Offset(unit, unit), const Offset(delta, 0.0));
|
||||||
|
}
|
||||||
|
|
||||||
|
testWidgets('Can change value using CupertinoSlider', (WidgetTester tester) async {
|
||||||
|
await tester.pumpWidget(
|
||||||
|
const example.MyApp(),
|
||||||
|
);
|
||||||
|
|
||||||
|
// Check for the initial slider value.
|
||||||
|
expect(find.text('0.0'), findsOneWidget);
|
||||||
|
|
||||||
|
await _dragSlider(tester, const Key('slider'));
|
||||||
|
await tester.pumpAndSettle();
|
||||||
|
|
||||||
|
// Check for the updated slider value.
|
||||||
|
expect(find.text('40.0'), findsOneWidget);
|
||||||
|
});
|
||||||
|
}
|
@ -35,6 +35,12 @@ import 'thumb_painter.dart';
|
|||||||
/// that use a slider will listen for the [onChanged] callback and rebuild the
|
/// that use a slider will listen for the [onChanged] callback and rebuild the
|
||||||
/// slider with a new [value] to update the visual appearance of the slider.
|
/// slider with a new [value] to update the visual appearance of the slider.
|
||||||
///
|
///
|
||||||
|
/// {@tool dartpad}
|
||||||
|
/// This example shows how to show the current slider value as it changes.
|
||||||
|
///
|
||||||
|
/// ** See code in examples/api/lib/cupertino/slider/cupertino_slider.0.dart **
|
||||||
|
/// {@end-tool}
|
||||||
|
///
|
||||||
/// See also:
|
/// See also:
|
||||||
///
|
///
|
||||||
/// * <https://developer.apple.com/ios/human-interface-guidelines/controls/sliders/>
|
/// * <https://developer.apple.com/ios/human-interface-guidelines/controls/sliders/>
|
||||||
|
Loading…
x
Reference in New Issue
Block a user