oss4bw_dynamic_form 0.0.1
oss4bw_dynamic_form: ^0.0.1 copied to clipboard
A simple Flutter package to build dynamic Form
Dynamic Form #
A simple StatefulWidget Form with dynamic content
Features #
- Support TextField, TextArea, OptionPicker ( multiple/single select, Dropdown or Radio )
Getting started #
- This is in early state library, so it will usually have breaking changes in next version
Usage #
1. First, create a Controller extends DynamicFormController and design the Form in Controller constructor #
class NewProjectDFController extends DynamicFormController {
NewProjectDFController() {
//
// design the form
//
formCreation = DynamicFormCreation(fields: [
DynamicFormField(id: 'name',
name: 'Project Name',
fieldType: DynamicFormFieldTypes.TextField),
DynamicFormField(id: 'desc',
name: 'Project Description',
fieldType: DynamicFormFieldTypes.TextArea),
DynamicFormField.createDropdownSelect('category', 'Category', items: [
'Application Builder',
'Story Builder',
'Course Builder',
'Marketing Campaign Builder'
])
]);
}
}
2. Then, declare an instance of Controller and bind state in initState() #
// declare the Controller
NewProjectDFController newProjectFormController = NewProjectDFController();
// bind state
@override
void initState() {
super.initState();
newProjectFormController.bindState(reloadForm: () => setState(() {}));
}
3. use it as Dialog content or as other Widget in build() #
showAddNewProjectDialog() {
showDialog(context: context, builder: (_) => AlertDialog(
title: Text("Create new Project"),
content: newProjectFormController.buildForm(context),
actions: [ElevatedButton(onPressed: () {
bool isValid = newProjectFormController.validateFields();
if (isValid) {
Navigator.pop(context);
var model = newProjectFormController.formValues;
debugPrint("New Project Model:");
debugPrint(jsonEncode(model));
}
}, child: Text("Create"))
],
));
}