Form Creator

A flexible Flutter package for building dynamic surveys and questionnaires with ease. Create interactive forms with various input controls that support both input and display modes.

Features

✨ Rich Control Types

• Text inputs (short and long)
• Choice controls (radio buttons and checkboxes)
• Date and time pickers (single and range selections)
• File uploads (images and documents)
• View-only controls (titles and descriptions)

🔄 Dual Modes

• Input Mode: Interactive forms for data collection
• Display Mode: Read-only view for showing submitted responses

✅ Built-in Validation

• Required field validation
• Custom validators
• Pattern matching for text inputs
• File size and type restrictions

🎨 Customizable

• Custom styles for titles and descriptions
• Placeholder text support
• Configurable min/max values
• Flexible layouts

Usage

Basic Example

import'package:flutter/material.dart';
import'package:form_creator/src/text_control/title_control.dart';
import'package:form_creator/src/text_control/short_text_control.dart';
import'package:form_creator/src/choice_control/radio_control.dart';
import'package:form_creator/src/choice_control/choice_option.dart';
classMyFormextendsStatelessWidget {
@overrideWidgetbuild(BuildContext context) {
returnScaffold(
appBar:AppBar(title:Text('Survey Form')),
body:ListView(
padding:EdgeInsets.all(16),
children: [
// TitleTitleControl(
id:'title',
text:'Customer Feedback Survey',
),
// Short text inputShortTextControl(
id:'name',
title:'Your Name',
isRequired:true,
placeholder:'Enter your name',
onChanged: (value) =>print('Name: $value'),
),
// Radio buttonsRadioControl(
id:'satisfaction',
title:'How satisfied are you?',
isRequired:true,
options: [
ChoiceOption(id:'1', label:'Very Satisfied', value:'5'),
ChoiceOption(id:'2', label:'Satisfied', value:'4'),
ChoiceOption(id:'3', label:'Neutral', value:'3'),
ChoiceOption(id:'4', label:'Dissatisfied', value:'2'),
ChoiceOption(id:'5', label:'Very Dissatisfied', value:'1'),
],
onChanged: (value) =>print('Rating: $value'),
),
],
),
);
}
}

Display Mode Example

// Switch to display mode to show submitted responsesShortTextControl(
id:'name',
title:'Your Name',
isReadOnly:true, // Display mode
value:'John Doe',
)

Available Controls

View Controls

• TitleControl: Display form titles
• DescriptionControl: Show descriptive text

Text Controls

• ShortTextControl: Single-line text input
• LongTextControl: Multi-line text input with configurable rows

Choice Controls

• RadioControl: Single selection from options
• CheckboxControl: Multiple selections from options
• ChoiceOption: Model for choice options

DateTime Controls

• DateControl: Date picker
• TimeControl: Time picker
• DateFromToControl: Date range selection
• TimeFromToControl: Time range selection
• DateTimeFromToControl: DateTime range selection

File Controls

• PictureControl: Image file uploads with preview
• FileUploadControl: Generic file uploads

Control Properties

All controls extend from InputControl and support:

Property	Type	Description
id	String	Unique identifier (required)
title	String	Question or label text (required)
description	String?	Additional help text
isRequired	bool	Mark as required field
isReadOnly	bool	Switch between input/display mode
value	dynamic	Current value
onChanged	Function?	Value change callback
validator	Function?	Custom validation function

Advanced Examples

With Validation

ShortTextControl(
id:'email',
title:'Email Address',
isRequired:true,
keyboardType:TextInputType.emailAddress,
pattern:RegExp(r'^[\w-\.]+@([\w-]+\.)+[\w-]{2,4}$'),
validator: (value) {
if (value ==null|| value.isEmpty) {
return'Email is required';
}
returnnull;
},
)

Checkbox with Multiple Selections

CheckboxControl(
id:'interests',
title:'Select your interests',
options: [
ChoiceOption(id:'1', label:'Technology'),
ChoiceOption(id:'2', label:'Sports'),
ChoiceOption(id:'3', label:'Music'),
ChoiceOption(id:'4', label:'Travel'),
],
allowOther:true,
value: ['Technology', 'Music'],
onChanged: (values) =>print('Selected: $values'),
)

File Upload with Restrictions

FileUploadControl(
id:'document',
title:'Upload Document',
allowedExtensions: ['pdf', 'doc', 'docx'],
maxFileSize:5242880, // 5MB in bytes
maxFiles:3,
isRequired:true,
)

Date Range Picker

DateFromToControl(
id:'vacation',
title:'Vacation Period',
minDate:DateTime(2025, 1, 1),
maxDate:DateTime(2025, 12, 31),
value:DateTimeRange(
start:DateTime(2025, 7, 1),
end:DateTime(2025, 7, 15),
),
)

Dependencies

This package requires:

• intl: For date formatting
• file_picker: For file selection

Additional information

Contributing

Contributions are welcome! Please feel free to submit a Pull Request.

Issues

If you encounter any issues, please file them on the GitHub repository.

License

This project is licensed under the MIT License - see the LICENSE file for details.