flutter_input 1.0.1

  • Readme
  • Changelog
  • Example
  • Installing
  • new71

Flutter Input Widgets - Standalone or within a Form → flutter_input #

This package provides input widgets (fields) to manipulate basic data types and an InputForm. Each input widget can be used standalone or attached to the form. All input widgets share a common set of parameters. A list of validators (see below) can be attached to an input widget.

Input Widgets #

The following input widgets are included. See section 'Development' below for building your own input widget.

  • [InputCalendar] - A highly customizable date picker with month selection and slider and a text input for the year
  • [InputCheckbox] - Checkbox for data type bool
  • [InputDate] - Calendar based selection for data type DateTime (date part only)
  • [InputDateTime] - Wheels for data type DateTime can be customized for date only, time only or both
  • [InputDropDown
  • [InputFavorite] - A favorite button with selectable icon for data type bool
  • [InputKeyboard] - Text input for data type String, int or double
  • [InputRadio
  • [InputRating] - Rating widget with selectable icons and a range slider for data type int
  • [InputSlider] - Slider for data type double between a minimum and maximum value
  • [InputSpinner] - Spinner with buttons for data type double to decrease or increase a value between a minimum and maximum
  • [InputSwitch] - Switch for data type bool

Usage #

For a complete example see example/main.dart.

All input widgets share a common set of parameters. All parameters are named and optional.

  • Key key
  • bool autovalidate = false - automatically validates
  • InputDecoration decoration - e.g. for a label
  • bool enabled - to protect the field against changes. Overrides setting through the Form
  • T initialValue - to set the fields initial value. Overrides using the value from the forms map.
  • ValueSetter
  • ValueSetter
  • String path - to access the form map
  • List

Validators #

The following validators can be given to parameter [InputField.validators] of an input widget. Each validator accepts the optional parameter message to set an individual error message if the validation fails.

  • After(DateTime date) - validates that the field value is after date
  • Before(DateTime date) - validates that the field value is before date
  • Future - validates that the DateTime field value lies in the future
  • Max(num maxVal) - validates that the num field value is not larger than maxVal
  • MaxLen(num maxLen) - validates that the length of the String field value is not longer than maxLen
  • Min(num minVal) - validates that the num field value is not smaller than minVal
  • MinLen(num minLen) - validates that the length of the String field value is not shorter than minLen
  • NotNull - validates the the field value is not empty
  • Past - validates that the DateTime field value lies in the past

Development #

To create a new input field for data type T just copy one of the existing classes and modify it accordingly. Replace T with the type of the value of your new input field.

  1. Create a new stateful widget for type T with class MyNewInputWidget extends InputField<T> {
  2. class MyNewInputState extends InputFieldState<T> { where T is replaced by the type of the value of the field.
  3. Write method build( BuildContext context) in the state class. It must end with return super.buildInputField( context, ... where ... is the code to display your input field widget.

Utilities #

This package also contains some utilities. Methods missing in DateTime like [DateHelper.getWeekOfYear] or [DateHelper.getJulianDay]. See [InputUtils.convertToType()] for data type conversion, [InputUtils.readFromJson()] for reading and [InputUtils.writeToJson()] for writing values into nested maps.

To Do #

  • [X] create a customizable calendar picker with week numbers
  • [X] create a text input field for int and double
  • [ ] create an input widget to select multiple choices like a multi-select list
  • [ ] add some images to this documentation
  • [ ] internationalize the whole package
  • [ ] add dartdoc output (requires a dartdoc not creating the whole dart api)

1.0.1 #

  • Breaking change: all validator functions are now lowerCamelCase

1.0.0 #

  • Added new widget InputKeyboard. Generic type <String>, <int> or <double> automatically sets appropriate keyboard. Replaces deprecated InputText.
  • Added new widget InputCalendar which is a highly customizable date picker. It shows weeks of year. Month selection by dragging the whole calendar sheet left or right or using the month dropdown. Year can be directly set as it is a text input field.
  • Added DateHelper with methods getJulianDay(), getWeekOfYear(), isSameDay(), isBetween() and more.
  • All fields are included in the example project.
  • Made better documentation.

0.2.0 #

  • Added new widget InputSlider
  • Added new widget InputSpinner
  • Added some reusable validators: NotNull, Min, MinLength, Max, MaxLength
  • Validators can have individual error messages with named parameter message

0.1.0 #

  • Initial version


Example app which uses package flutter_input.

Runs on Android, iOS and Web.

Use this package as a library

1. Depend on it

Add this to your package's pubspec.yaml file:

  flutter_input: ^1.0.1

2. Install it

You can install packages from the command line:

with Flutter:

$ flutter pub get

Alternatively, your editor might support flutter pub get. Check the docs for your editor to learn more.

3. Import it

Now in your Dart code, you can use:

import 'package:flutter_input/flutter_input.dart';
Describes how popular the package is relative to other packages. [more]
Code health derived from static analysis. [more]
Reflects how tidy and up-to-date the package is. [more]
Weighted score of the above. [more]
Learn more about scoring.

We analyzed this package on Jan 19, 2020, and provided a score, details, and suggestions below. Analysis was completed with status completed using:

  • Dart: 2.7.0
  • pana: 0.13.4
  • Flutter: 1.12.13+hotfix.5

Health suggestions

Format lib/src/input_text.dart.

Run flutter format to format lib/src/input_text.dart.


Package Constraint Resolved Available
Direct dependencies
Dart SDK >=2.7.0 <3.0.0
flutter 0.0.0
intl ^0.16.0 0.16.1
pedantic ^1.8.0 1.9.0
Transitive dependencies
collection 1.14.11 1.14.12
meta 1.1.8
path 1.6.4
sky_engine 0.0.99
typed_data 1.1.6
vector_math 2.0.8
Dev dependencies
dartdoc >=0.30.0
test >=1.9.4