-
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(main): Stepper * Add optional content, remove listview and fix inkwell * [automated commit] lint format and import sort --------- Co-authored-by: github-actions <[email protected]>
- Loading branch information
1 parent
39528a3
commit 21fa72b
Showing
7 changed files
with
635 additions
and
1 deletion.
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
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
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,144 @@ | ||
import 'package:flutter/material.dart'; | ||
import 'package:zeta_example/widgets.dart'; | ||
import 'package:zeta_flutter/zeta_flutter.dart'; | ||
|
||
class StepperExample extends StatefulWidget { | ||
const StepperExample({super.key}); | ||
|
||
static const String name = 'Stepper'; | ||
|
||
@override | ||
State<StepperExample> createState() => _StepperExampleState(); | ||
} | ||
|
||
class _StepperExampleState extends State<StepperExample> { | ||
int _roundedHorizontalStep = 0; | ||
int _sharpHorizontalStep = 0; | ||
int _verticalStep = 0; | ||
|
||
ZetaStepType _getForStepIndex({ | ||
required int currentStep, | ||
required int stepIndex, | ||
}) { | ||
if (currentStep == stepIndex) return ZetaStepType.enabled; | ||
if (currentStep > stepIndex) return ZetaStepType.complete; | ||
|
||
return ZetaStepType.disabled; | ||
} | ||
|
||
@override | ||
Widget build(BuildContext context) { | ||
return ExampleScaffold( | ||
name: StepperExample.name, | ||
child: SingleChildScrollView( | ||
child: Column( | ||
children: [ | ||
SizedBox( | ||
height: 150, | ||
child: ZetaStepper( | ||
currentStep: _roundedHorizontalStep, | ||
onStepTapped: (index) => setState(() => _roundedHorizontalStep = index), | ||
steps: [ | ||
ZetaStep( | ||
type: _getForStepIndex( | ||
currentStep: _roundedHorizontalStep, | ||
stepIndex: 0, | ||
), | ||
title: Text("Title"), | ||
content: Text("Content"), | ||
), | ||
ZetaStep( | ||
type: _getForStepIndex( | ||
currentStep: _roundedHorizontalStep, | ||
stepIndex: 1, | ||
), | ||
title: Text("Title 2"), | ||
), | ||
ZetaStep( | ||
type: _getForStepIndex( | ||
currentStep: _roundedHorizontalStep, | ||
stepIndex: 2, | ||
), | ||
title: Text("Title 3"), | ||
content: Text("Content 3"), | ||
), | ||
], | ||
), | ||
), | ||
SizedBox( | ||
height: 150, | ||
child: ZetaStepper( | ||
rounded: false, | ||
currentStep: _sharpHorizontalStep, | ||
onStepTapped: (index) => setState(() => _sharpHorizontalStep = index), | ||
steps: [ | ||
ZetaStep( | ||
type: _getForStepIndex( | ||
currentStep: _sharpHorizontalStep, | ||
stepIndex: 0, | ||
), | ||
title: Text("Title"), | ||
content: Text("Content"), | ||
), | ||
ZetaStep( | ||
type: _getForStepIndex( | ||
currentStep: _sharpHorizontalStep, | ||
stepIndex: 1, | ||
), | ||
title: Text("Title 2"), | ||
content: Text("Content 2"), | ||
), | ||
ZetaStep( | ||
type: _getForStepIndex( | ||
currentStep: _sharpHorizontalStep, | ||
stepIndex: 2, | ||
), | ||
title: Text("Title 3"), | ||
content: Text("Content 3"), | ||
), | ||
], | ||
), | ||
), | ||
Padding( | ||
padding: const EdgeInsets.symmetric(horizontal: ZetaSpacing.l), | ||
child: ZetaStepper( | ||
type: ZetaStepperType.vertical, | ||
currentStep: _verticalStep, | ||
onStepTapped: (index) => setState(() => _verticalStep = index), | ||
steps: [ | ||
ZetaStep( | ||
type: _getForStepIndex( | ||
currentStep: _verticalStep, | ||
stepIndex: 0, | ||
), | ||
title: Text("Title"), | ||
subtitle: Text("Step Number"), | ||
content: Text("Content"), | ||
), | ||
ZetaStep( | ||
type: _getForStepIndex( | ||
currentStep: _verticalStep, | ||
stepIndex: 1, | ||
), | ||
title: Text("Title 2"), | ||
subtitle: Text("Step Number"), | ||
content: Text("Content 2"), | ||
), | ||
ZetaStep( | ||
type: _getForStepIndex( | ||
currentStep: _verticalStep, | ||
stepIndex: 2, | ||
), | ||
title: Text("Title 3"), | ||
subtitle: Text("Step Number"), | ||
content: Text("Content 3"), | ||
), | ||
], | ||
), | ||
), | ||
], | ||
), | ||
), | ||
); | ||
} | ||
} |
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
66 changes: 66 additions & 0 deletions
66
example/widgetbook/pages/components/stepper_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,66 @@ | ||
import 'package:flutter/material.dart'; | ||
import 'package:widgetbook/widgetbook.dart'; | ||
import 'package:zeta_flutter/zeta_flutter.dart'; | ||
|
||
import '../../test/test_components.dart'; | ||
|
||
Widget stepperUseCase(BuildContext context) { | ||
int currentStep = 0; | ||
|
||
ZetaStepType getForStepIndex(int stepIndex) { | ||
if (currentStep == stepIndex) return ZetaStepType.enabled; | ||
if (currentStep > stepIndex) return ZetaStepType.complete; | ||
|
||
return ZetaStepType.disabled; | ||
} | ||
|
||
final type = context.knobs.list( | ||
label: "Type", | ||
options: [ | ||
ZetaStepperType.horizontal, | ||
ZetaStepperType.vertical, | ||
], | ||
initialOption: ZetaStepperType.horizontal, | ||
labelBuilder: (type) => type.name, | ||
); | ||
|
||
final rounded = context.knobs.boolean(label: 'Rounded', initialValue: true); | ||
|
||
final enabledContent = context.knobs.boolean(label: 'Enabled Content', initialValue: true); | ||
|
||
return WidgetbookTestWidget( | ||
widget: StatefulBuilder( | ||
builder: (context, setState) { | ||
return Container( | ||
height: type == ZetaStepperType.horizontal ? 300 : null, | ||
padding: EdgeInsets.all( | ||
type == ZetaStepperType.horizontal ? 0.0 : ZetaSpacing.l, | ||
), | ||
child: ZetaStepper( | ||
currentStep: currentStep, | ||
onStepTapped: (index) => setState(() => currentStep = index), | ||
rounded: type == ZetaStepperType.horizontal ? rounded : true, | ||
type: type, | ||
steps: [ | ||
ZetaStep( | ||
type: getForStepIndex(0), | ||
title: Text("Title"), | ||
content: enabledContent ? Text("Content") : null, | ||
), | ||
ZetaStep( | ||
type: getForStepIndex(1), | ||
title: Text("Title 2"), | ||
content: enabledContent ? Text("Content 2") : null, | ||
), | ||
ZetaStep( | ||
type: getForStepIndex(2), | ||
title: Text("Title 3"), | ||
content: enabledContent ? Text("Content 3") : null, | ||
), | ||
], | ||
), | ||
); | ||
}, | ||
), | ||
); | ||
} |
Oops, something went wrong.