https://github.com/roshannahak/step_tracker

A Flutter step_tracker plugin is collect information from user and display progress through a sequence of steps. this plugin also have privilege for fully customization from user side. like flipkart, amazon, myntra, meesho.
https://github.com/roshannahak/step_tracker

dart delivery delivery-application delivery-service flutter flutter-apps flutter-package packages stepper tracker widget-library

Last synced: 3 months ago
JSON representation

Host: GitHub
URL: https://github.com/roshannahak/step_tracker
Owner: Roshannahak
License: bsd-2-clause
Created: 2022-09-12T10:50:37.000Z (over 3 years ago)
Default Branch: main
Last Pushed: 2025-03-05T07:01:44.000Z (about 1 year ago)
Last Synced: 2025-03-05T08:19:17.030Z (about 1 year ago)
Topics: dart, delivery, delivery-application, delivery-service, flutter, flutter-apps, flutter-package, packages, stepper, tracker, widget-library
Language: Dart
Homepage:
Size: 222 KB
Stars: 10
Watchers: 1
Forks: 4
Open Issues: 0
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE

Awesome Lists containing this project

README

# step_tracker plugin

A Flutter step_tracker plugin is collect information from user and display progress through a sequence of steps. this plugin also have privilege for fully customization from user side.

## Usage

#### Add dependency

Please check the latest version before installation. If there is any problem with the new version, please use the previous version.

```yaml
dependencies:
flutter:
sdk: flutter
# add step_tracker
step_tracker: ^{latest version}
```

#### Add the following imports to your Dart code

```dart
import 'package:step_tracker/step_tracker.dart';
```

#### How to use
Simply create a ```step_tracker``` widget, and pass the required params and List of ```steps[]```:

```dart
StepTracker(
dotSize: 10,
circleIconSize: 24,
showIcon: true,
selectedColor: Colors.green,
unSelectedColor: Colors.red,
stepTrackerType: StepTrackerType.dotVertical,
pipeSize: 30,
steps: [
Steps(title: Text("your text"), state: TrackerState.none),
Steps(title: Text("your text"), state: TrackerState.complete),
Steps(title: Text("your text"), state: TrackerState.disabled),
],
)
```

##### Change tracker state
Here we have three state on Steps Widget ```complete``` ```disabled``` and one more is ```none``` which is default set. Following attributes are below:

```dart
state: TrackerState.none
state: TrackerState.complete
state: TrackerState.disable
```

##### Types of tracker
In this widget, currently we have two types of tracker ```indexedVertical``` & ```dotVertical```, default set is ```dotVertical```.

```dart
stepTrackerType: StepTrackerType.indexedVertical
stepTrackerType: StepTrackerType.dotVertical
stepTrackerType: StepTrackerType.indexedHorizontal
stepTrackerType: StepTrackerType.dotHorizontal
```

##### Icon Stepper Guide
To use the icon stepper with `StepTrackerType.indexedVertical` and `StepTrackerType.indexedHorizontal`:

- Set `showIcon: true`
- Provide the image URL in the `iconAsset` property of `Steps`

```dart
StepTracker(
type: StepTrackerType.indexedVertical, //StepTrackerType.indexedHorizontal
showIcon: true,
circleIconSize: 24;
steps: [
Steps(title: "Order Placed", description: "description text", iconAsset: "assets/step1.png"),
Steps(title: "Shipped", iconAsset: "assets/step2.png"),
Steps(title: "Delivered", iconAsset: "assets/step3.png"),
],
)
```