-
Notifications
You must be signed in to change notification settings - Fork 4
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
feat: Created Range Selector test: wrote 1 test for range selector test: testing range selector docs: widgetbook and example for range selector test: created interaction tests test: adjusted golden tolerance fix: removed rounded from widgetbook fix: removed large thumbs fix: removed defaults to true on showValues
- Loading branch information
Showing
21 changed files
with
1,271 additions
and
0 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
202 changes: 202 additions & 0 deletions
202
example/lib/pages/components/range_selector_example.dart
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,202 @@ | ||
| import 'package:flutter/material.dart'; | ||
| import 'package:zeta_example/widgets.dart'; | ||
| import 'package:zeta_flutter/zeta_flutter.dart'; | ||
|
|
||
| class RangeSelectorExample extends StatefulWidget { | ||
| static const String name = 'RangeSelector'; | ||
|
|
||
| const RangeSelectorExample({super.key}); | ||
|
|
||
| @override | ||
| State<RangeSelectorExample> createState() => _RangeSelectorExampleState(); | ||
| } | ||
|
|
||
| class _RangeSelectorExampleState extends State<RangeSelectorExample> { | ||
| double value = 0.5; | ||
|
|
||
| @override | ||
| Widget build(BuildContext context) { | ||
| return ExampleScaffold( | ||
| name: RangeSelectorExample.name, | ||
| child: SingleChildScrollView( | ||
| child: Container( | ||
| padding: const EdgeInsets.symmetric(horizontal: 16), | ||
| child: Column( | ||
| children: [ | ||
| Column( | ||
| crossAxisAlignment: CrossAxisAlignment.start, | ||
| children: [ | ||
| Text('Range Slider - Rounded - Continuous', style: ZetaTextStyles.bodyLarge), | ||
| ZetaRangeSelector( | ||
| onChange: (value) { | ||
| print(value.start); | ||
| print(value.end); | ||
| }, | ||
| initialValues: RangeValues(20, 80), | ||
| min: 0, | ||
| max: 100, | ||
| showValues: false, | ||
| ), | ||
| ].gap(12), | ||
| ), | ||
| Column( | ||
| crossAxisAlignment: CrossAxisAlignment.start, | ||
| children: [ | ||
| Text('Range Slider - Rounded - Stepped', style: ZetaTextStyles.bodyLarge), | ||
| ZetaRangeSelector( | ||
| onChange: (value) {}, | ||
| initialValues: RangeValues(20, 80), | ||
| min: 0, | ||
| max: 100, | ||
| showValues: false, | ||
| divisions: 10, | ||
| ), | ||
| ].gap(12), | ||
| ), | ||
| Column( | ||
| crossAxisAlignment: CrossAxisAlignment.start, | ||
| children: [ | ||
| Text('Range Slider - Rounded - Disabled', style: ZetaTextStyles.bodyLarge), | ||
| ZetaRangeSelector( | ||
| initialValues: RangeValues(20, 80), | ||
| min: 0, | ||
| max: 100, | ||
| showValues: false, | ||
| ), | ||
| ].gap(12), | ||
| ), | ||
| Column( | ||
| crossAxisAlignment: CrossAxisAlignment.start, | ||
| children: [ | ||
| Text('Range Slider - Sharp - Continuous', style: ZetaTextStyles.bodyLarge), | ||
| ZetaRangeSelector( | ||
| onChange: (value) {}, | ||
| initialValues: RangeValues(20, 80), | ||
| min: 0, | ||
| max: 100, | ||
| showValues: false, | ||
| rounded: false, | ||
| ), | ||
| ].gap(12), | ||
| ), | ||
| Column( | ||
| crossAxisAlignment: CrossAxisAlignment.start, | ||
| children: [ | ||
| Text('Range Slider - Sharp - Stepped', style: ZetaTextStyles.bodyLarge), | ||
| ZetaRangeSelector( | ||
| onChange: (value) {}, | ||
| initialValues: RangeValues(20, 80), | ||
| min: 0, | ||
| max: 100, | ||
| showValues: false, | ||
| divisions: 10, | ||
| rounded: false, | ||
| ), | ||
| ].gap(12), | ||
| ), | ||
| Column( | ||
| crossAxisAlignment: CrossAxisAlignment.start, | ||
| children: [ | ||
| Text('Range Slider - Sharp - Disabled', style: ZetaTextStyles.bodyLarge), | ||
| ZetaRangeSelector( | ||
| initialValues: RangeValues(20, 80), | ||
| min: 0, | ||
| max: 100, | ||
| showValues: false, | ||
| rounded: false, | ||
| ), | ||
| ].gap(12), | ||
| ), | ||
| SizedBox( | ||
| height: 32, | ||
| ), | ||
| Column( | ||
| crossAxisAlignment: CrossAxisAlignment.start, | ||
| children: [ | ||
| Text('Range Selector - Rounded - Continuous', style: ZetaTextStyles.bodyLarge), | ||
| ZetaRangeSelector( | ||
| onChange: (value) {}, | ||
| initialValues: RangeValues(20, 80), | ||
| min: 0, | ||
| max: 100, | ||
| label: 'Label', | ||
| ), | ||
| ].gap(12), | ||
| ), | ||
| Column( | ||
| crossAxisAlignment: CrossAxisAlignment.start, | ||
| children: [ | ||
| Text('Range Selector - Rounded - Stepped', style: ZetaTextStyles.bodyLarge), | ||
| ZetaRangeSelector( | ||
| onChange: (value) {}, | ||
| initialValues: RangeValues(20, 80), | ||
| min: 0, | ||
| max: 100, | ||
| label: 'Label', | ||
| divisions: 10, | ||
| ), | ||
| ].gap(12), | ||
| ), | ||
| Column( | ||
| crossAxisAlignment: CrossAxisAlignment.start, | ||
| children: [ | ||
| Text('Range Selector - Rounded - Disabled', style: ZetaTextStyles.bodyLarge), | ||
| ZetaRangeSelector( | ||
| initialValues: RangeValues(20, 80), | ||
| min: 0, | ||
| max: 100, | ||
| label: 'Label', | ||
| divisions: 10, | ||
| ), | ||
| ].gap(12), | ||
| ), | ||
| Column( | ||
| crossAxisAlignment: CrossAxisAlignment.start, | ||
| children: [ | ||
| Text('Range Selector - Sharp - Continuous', style: ZetaTextStyles.bodyLarge), | ||
| ZetaRangeSelector( | ||
| onChange: (value) {}, | ||
| initialValues: RangeValues(20, 80), | ||
| min: 0, | ||
| max: 100, | ||
| label: 'Label', | ||
| rounded: false, | ||
| ), | ||
| ].gap(12), | ||
| ), | ||
| Column( | ||
| crossAxisAlignment: CrossAxisAlignment.start, | ||
| children: [ | ||
| Text('Range Selector - Sharp - Stepped', style: ZetaTextStyles.bodyLarge), | ||
| ZetaRangeSelector( | ||
| onChange: (value) {}, | ||
| initialValues: RangeValues(20, 80), | ||
| min: 0, | ||
| max: 100, | ||
| label: 'Label', | ||
| rounded: false, | ||
| divisions: 10, | ||
| ), | ||
| ].gap(12), | ||
| ), | ||
| Column( | ||
| crossAxisAlignment: CrossAxisAlignment.start, | ||
| children: [ | ||
| Text('Range Selector - Sharp - Disabled', style: ZetaTextStyles.bodyLarge), | ||
| ZetaRangeSelector( | ||
| initialValues: RangeValues(20, 80), | ||
| min: 0, | ||
| max: 100, | ||
| label: 'Label', | ||
| rounded: false, | ||
| divisions: 10, | ||
| ), | ||
| ].gap(12), | ||
| ), | ||
| ].gap(32), | ||
| ).paddingVertical(32), | ||
| ), | ||
| ), | ||
| ); | ||
| } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
33 changes: 33 additions & 0 deletions
33
example/widgetbook/pages/components/range_selector_widgetbook.dart
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,33 @@ | ||
| import 'package:flutter/material.dart'; | ||
| import 'package:widgetbook/widgetbook.dart'; | ||
| import 'package:zeta_flutter/zeta_flutter.dart'; | ||
|
|
||
| import '../../utils/scaffold.dart'; | ||
| import '../../utils/utils.dart'; | ||
|
|
||
| Widget rangeSelectorUseCase(BuildContext context) { | ||
| return WidgetbookScaffold( | ||
| builder: (context, _) => RangeSelectorExample(context), | ||
| ); | ||
| } | ||
|
|
||
| class RangeSelectorExample extends StatelessWidget { | ||
| RangeSelectorExample(this.context); | ||
| final BuildContext context; | ||
|
|
||
| @override | ||
| Widget build(BuildContext _) { | ||
| return Padding( | ||
| padding: const EdgeInsets.all(16), | ||
| child: ZetaRangeSelector( | ||
| label: context.knobs.string(label: 'Label', initialValue: 'Range Selector'), | ||
| divisions: context.knobs.intOrNull.input(label: 'Divisions', initialValue: null), | ||
| showValues: context.knobs.boolean(label: 'Show Values', initialValue: true), | ||
| onChange: disabledKnob(context) ? null : (value) {}, | ||
| initialValues: context.knobs.range(label: 'Initial Range', initialValue: RangeValues(20, 80)), | ||
| min: context.knobs.double.input(label: 'Min', initialValue: 0), | ||
| max: context.knobs.double.input(label: 'Max', initialValue: 100), | ||
| ), | ||
| ); | ||
| } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.