flutter_form_builder #

basic usage #

FormManagement formManagement = FormManagement();

Widget form = FormBuilder(
      {bool readOnly,//set form's readonly state
      bool visible, // set form's visible state
      FormThemeData? formThemeData, //set themedata of form 
      this.formManagement,
      FormInitCallback? initCallback})
	.textField(
          controlKey: 'username',
          labelText: 'username',
          clearable: true,
          validator: (value) =>
              value.isEmpty ? 'username can not be empty !' : null,
        )
        .switchInline(
          controlKey: 'switch1',
          onChanged: (value) => print('switch1 value changed $value'),
        )
        .nextLine()
        .textField(
            controlKey: 'password',
            hintText: 'password',
            obscureText: true,
            passwordVisible: true,
            clearable: true,
            toolbarOptions: ToolbarOptions(copy: false, paste: false),
            onChanged: (value) => print('password value changed $value'),
            flex: 1)
        .textButton(
            onPressed: () {
              formManagement
                  .getFormFieldManagement('password')
                  .textSelectionManagement
                  .selectAll();
            },
            label: 'button',
            controlKey: 'button')
        .nextLine()
        .numberField(
          controlKey: 'age',
          hintText: 'age',
          clearable: true,
          flex: 3,
          min: -18,
          max: 99,
          decimal: 0,
          onChanged: (value) => print('age value changed $value'),
          validator: (value) => value == null ? 'not empty' : null,
        )
        .checkboxGroup(
          items: FormBuilder.toCheckboxGroupItems(['male', 'female']),
          controlKey: 'checkbox',
          split: 2,
          label: 'sex',
          onChanged: (value) => print('checkbox value changed $value'),
          validator: (value) => value.isEmpty ? 'pls select sex' : null,
        );

methods #

FormManagement #

check whether form is initialled or not

bool initialled = formManagement.initialled;

check whether form is visible or not

bool visible = formManagement.visible;

hide|show form

formManagement.visible = true|false;

check whether form is readOnly or not

bool readOnly = formManagement.readOnly;

set form readonly|editable

formManagement.readOnly = true|false;

get current form themedata

FormThemeData formThemeData = formManagement.formThemeData;

set form theme

formManagement.formThemeData = FormThemeData(themeData);// system theme
formManagement.formThemeData = DefaultFormTheme(); //default theme from  https://github.com/mitesh77/Best-Flutter-UI-Templates/blob/master/best_flutter_ui_templates/lib/hotel_booking/filters_screen.dart

get form data

formManagement.data; // auto remove null
formManagement.getData({bool removeNull = false});

reset form

formManagement.reset();

validate form

formManagement.validate();

request focus on first invalid field

formManagement.focusOnFirstInvalidField()

check whether form is valid or not

unlike validate method, this method won't display error msg

formManagement.isValid

check whether form has a controlKey or not

bool exists = formManagement.hasControlKey(String controlKey);

get FormFieldManagement

FormFieldManagement formFieldManagement = formManagement.getFormFieldManagement(String controlKey)

get FormLayoutManagement

FormLayoutManagement formLayoutManagement = formManagement.formLayoutManagement;

get FormWidgetTreeManagement

FormWidgetTreeManagement formWidgetTreeManagement = formManagement.formWidgetTreeManagement

FormFieldManagement #

check whether a field is ValueField or not

bool isValueField = formFieldManagement.isValueField;

check whether a field is readOnly or not

bool readOnly = formFieldManagement.readOnly;

set readOnly on formFieldManagement

formFieldManagement.readOnly = true|false

check whether a field is removed or not

bool removed = formFieldManagement.removed;

remove|unremove a form field

formFieldManagement.remove = true|false

check whether a field is visible or not

bool visible = formFieldManagement.visible;

set visible on form field

formFieldManagement.visible = true|false

set autovalidateMode on value field

formFieldManagement.autovalidateMode = AutovalidateMode;

set initialValue on value field

formFieldManagement.initialValue = value;

validate a value field

bool isValid = formFieldManagement.validate();

check whether a value field is valid or not

unlike validate method, this method won't display error msg

bool isValid = formFieldManagement.isValid;

reset value field

formFieldManagement.reset();

get padding of a form field

EdgeInsets padding = formFieldManagement.padding;

set padding of a form field

formFieldManagement.padding = padding;

check whether a value field is focused or not

bool hasFocus = formFieldManagement.focus;

Focus|unfocus a form field

formFieldManagement.focus = true|false

get value of a value field

dynamic value = formFieldManagement.value;

set value on a value field

formFieldManagement.setValue(dynamic value,{bool trigger = true});

trigger whether trigger field's onChange callback or not

rebuild a form field's state

see supported states for every field here

formFieldManagement.state = {};

update a form field's state

see supported states for every field here

formFieldManagement.update({});

remove form field's states

see supported states for every field here

formFieldManagement.removeState(Set<String> keys); 

get TextSelectionManagement

TextSelectionManagement textSelectionManagement = formFieldManagement.textSelectionManagement;

set focuslistener on a form field`

formFieldManagement.focusListener = FocusListener();

you should call this method in FormBuilder's initCallback

FormLayoutManagement #

get rows of form

int rows = formLayoutManagement.rows;

get FormLayoutRowManagement

FormLayoutRowManagement formLayoutRowManagement = formLayoutManagement.getFormLayoutRowManagement(int row);

get FormFieldManagement

FormFieldManagement formFieldManagement = formLayoutManagement.getFormFieldManagement(int row,int column);

FormLayoutRowManagement #

get columns of a row

int columns = formLayoutRowManagement.columns;

check whether a row is visible or not

bool visible = formLayoutRowManagement.visible;

set visiable on a row

formLayoutRowManagement.visible = true|false;

set readOnly on a row

formLayoutRowManagement.readOnly = true|false;

remove|unremove a row

formLayoutRowManagement.remove = true|false;

FormWidgetTreeManagement #

check whether a layout is editing or not

bool isEditing = formWidgetTreeManagement.isEditing;

get rows of currrent editing layout

int rows = formWidgetTreeManagement.rows;

get columns of a row in current editing layout

int columns = formWidgetTreeManagement.getColumns(int row);

remove a field in widget tree

formWidgetTreeManagement.remove(String controlKey);

remove a row|field in widget tree

formWidgetTreeManagement.removeAtPosition(int row,{int column});

insert a row at position

void insert(
      {int column,
      int row,
      String controlKey,
      int flex = 1,
      bool visible = true,
      EdgeInsets padding,
      @required Widget field,
      bool inline = true,
      bool insertRow = false})

swap two rows

formWidgetTreeManagement.swapRow(int oldRow, int newRow)

start edit current layout

formWidgetTreeManagement.startEdit();

apply edited layout

formWidgetTreeManagement.apply();

cancel editing layout

formWidgetTreeManagement.cancel();

field states #

ClearableTextFormField #

DateTimeFormField #

NumberFormField #

CheckboxGroup #

RadioGroup #

Selector #

Slider #

RangeSlider #

SwitchGroup #

currently support fields #

build your own form field #

TODO

developing

develop plan #

1. performance test
2. support more fields