Skip to content

Flutter implementation of the UIStepper control from Apple's UIKit

License

Notifications You must be signed in to change notification settings

tzraikov/flutter_uistepper

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

2 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Flutter UIStepper widget

A widget for incrementing or decrementing a value by using +/- buttons. This is a Flutter implementation of the UIStepper control found in Apple iOS UIKit.

Image 1

Usage

First import it in your Dart code:

import 'package:uistepper/uistepper.dart';

Instantinate it in your build method and use a double property to store its value:

double stepperValue = 1;
//...
UIStepper(
    value: stepperValue, 
    onChanged: (value) { setState(() => stepperValue = value); }
);

Specify minimum and maximum values by using the corresponding minimumValue and maximumValue properties. The increment/decrement step is determined by the stepValue property, The wraps property indicates whether to wrap the current value to its minumum or maximum values when using stepValue different than 1:

UIStepper(
    value: stepperValue, 
    minumumValue: 1,
    maximumValue: 100,
    stepValue: 5,
    wraps: true,
    onChanged: (value) { setState(() => stepperValue = value); }
);

You can customize various attributes, for example the tintColor property sets +/- button color and the showLabel property determines whether to show or not the label:

UIStepper(
    value: stepperValue, 
    tintColor: Colors.red,
    showLabel: false,
    onChanged: (value) { setState(() => stepperValue = value); }
);

About

Flutter implementation of the UIStepper control from Apple's UIKit

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published