bg_vertical_stepper

Description:

bg vertical stepper

Vertical Stepper with Dotted Line in Flutter 👍 #
bg_vertical_stepper is a useful widget to display a process from one step to another in a vertical manner. It is particularly useful for showing progress in multi-step processes, such as forms, checkouts, or onboarding flows.
Features #

Customizable stepper with vertical orientation.
Dotted line connecting each step.
Easy to integrate and use in your Flutter projects.

ScreenShots #











Installation #
To use this package, add bg_bg_vertical_stepper as a dependency in your project's pubspec.yaml file:
dependencies:
flutter:
sdk: flutter
bg_vertical_stepper: ^1.0.0 # Use the latest version available
copied to clipboard
Then, run flutter pub get to install the package.
Usage #
Here's a basic example of how to use the bg_bg_vertical_stepper package in your Flutter project:
import 'package:flutter/material.dart';
import 'package:bg_vertical_stepper/src/step.dart' as step;

void main() => runApp(MaterialApp(
debugShowCheckedModeBanner: false,
home: HomePage(),
));

class HomePage extends StatelessWidget {
@override
Widget build(BuildContext context) {
//Create a list of stepper

List<step.Step> stepper = [
step.Step(
shimmer: false,
title: "first",
iconStyle: Colors.green,
content: Align(
alignment: Alignment.centerLeft,
child: Text("Content 1"),
),
),
step.Step(
shimmer: false,
title: "second",
iconStyle: Colors.green,
content: Align(
alignment: Alignment.centerLeft,
child: Text("Content 2"),
),
),
step.Step(
shimmer: false,
title: "third",
iconStyle: Colors.green,
content: Align(
alignment: Alignment.centerLeft,
child: Text("Content 3"),
),
),
step.Step(
shimmer: false,
title: "fourth",
iconStyle: Colors.green,
content: Align(
alignment: Alignment.centerLeft,
child: Text("Content 4"),
),
),
step.Step(
shimmer: false,
title: "fifth",
iconStyle: Colors.red,
content: Align(
alignment: Alignment.centerLeft,
child: Text("Content 5"),
),
),
step.Step(
shimmer: false,
title: "Last",
content: Align(
alignment: Alignment.centerLeft,
child: Text("Content 6"),
),
)
];

//Pass the list of steppers into VerticalStepper class

return Scaffold(
body: Padding(
padding: const EdgeInsets.fromLTRB(10, 130, 10, 2),
child: step.VerticalStepper(
steps: stepper,
dashLength: 2,
),
));
}
}

copied to clipboard
Testing #
To run tests for the bg_vertical_stepper package, use the following command:
flutter test
copied to clipboard
Make sure to write comprehensive tests to cover all functionalities of the stepper.
Contributing #
Contributions are welcome! If you find any issues or have suggestions for improvements, please create an issue or submit a pull request.
License #
This project is licensed under the MIT License - see the LICENSE file for details.