🎯 Input Forms [Flutter Package] #

Supercharge Your Flutter Forms

Beautiful, validated, and customizable form fields for Flutter applications.

Table of Contents

• Overview
• Installation
• Features
• All Available Fields
• Usage
• Complete Example
• API Reference
• Platform Support
• Contributing
• License

Overview #

Input Forms is a comprehensive Flutter package providing pre-built, highly customizable form components for rapid application development. It includes all the essential fields you need—email, password, date picker, dropdown, phone, file upload, location, signature, and more—with built-in validation and Material Design 3 support.

Why Choose Input Forms? #

• 🎨 Beautiful by Default: Material Design 3 compliant, customizable themes
• ✨ Ready to Use: Pre-built components for common form scenarios
• 🔒 Built-in Validation: Comprehensive validation out of the box
• 🎮 Developer Friendly: Intuitive API, extensive documentation
• 📱 Cross Platform: Android, iOS, Web, Windows, macOS, Linux
• 🔥 Performance Focused: Optimized for smooth performance

Installation #

Add to your pubspec.yaml:

dependencies:
  input_forms: ^0.0.4

Then run:

flutter pub get

Quick Start #

import 'package:input_forms/input_forms.dart';

// Use any form field:
EmailField(
  controller: emailController,
  label: 'Email Address',
)

Features #

• All fields are Material Design 3 ready
• Built-in validation for all fields
• Highly customizable (labels, icons, error messages, etc.)
• Easy integration into any Flutter app
• Cross-platform support

All Available Fields #

Usage #

Import the package:

import 'package:input_forms/input_forms.dart';

Example: Login Form #

class LoginForm extends StatefulWidget {
  @override
  _LoginFormState createState() => _LoginFormState();
}

class _LoginFormState extends State<LoginForm> {
  final _formKey = GlobalKey<FormState>();
  final _emailController = TextEditingController();
  final _passwordController = TextEditingController();

  @override
  Widget build(BuildContext context) {
    return Form(
      key: _formKey,
      child: Column(
        children: [
          EmailField(
            controller: _emailController,
            label: 'Email',
          ),
          const SizedBox(height: 16),
          PasswordField(
            controller: _passwordController,
            label: 'Password',
          ),
          const SizedBox(height: 24),
          ElevatedButton(
            onPressed: _submitForm,
            child: Text('Login'),
          ),
        ],
      ),
    );
  }

  void _submitForm() {
    if (_formKey.currentState!.validate()) {
      // Process form
    }
  }
}

Complete Example: All Fields #

Form(
  child: Column(
    children: [
      EmailField(
        controller: emailController,
        label: 'Email',
      ),
      PasswordField(
        controller: passwordController,
        label: 'Password',
      ),
      ConfirmPasswordField(
        passwordController: passwordController,
        confirmController: confirmPasswordController,
      ),
      UsernameField(
        controller: usernameController,
        label: 'Username',
      ),
      DatePickerField(
        controller: dateController,
        label: 'Date',
      ),
      DOBField(
        controller: dobController,
        label: 'Date of Birth',
      ),
      DropdownField<String>(
        label: 'Country',
        items: ['India', 'USA', 'UK'],
        value: selectedCountry,
        onChanged: (val) => setState(() => selectedCountry = val),
        itemLabel: (item) => item,
      ),
      SearchableDropdownField<String>(
        label: 'City',
        items: ['Chennai', 'Bangalore', 'Delhi'],
        value: selectedCity,
        onChanged: (val) => setState(() => selectedCity = val),
        itemLabel: (item) => item,
      ),
      PhoneField(
        controller: phoneController,
        label: 'Phone',
      ),
      LocationField(
        label: 'Location',
        // See API Reference for advanced options
      ),
      FileUploadField(
        // See API Reference for advanced options
      ),
      SignatureField(),
    ],
  ),
)

API Reference #

EmailField #

Validated email input with built-in format checking and error messages.

PasswordField #

Password input with visibility toggle and custom validation.

ConfirmPasswordField #

Ensures password and confirmation match.

UsernameField #

Username input with length and custom validation.

DatePickerField #

Date selection with calendar picker and formatting.

DOBField #

Date of birth picker with age-appropriate ranges.

DropdownField #

Generic dropdown with custom data, item labels, and flexible binding.

SearchableDropdownField #

Dropdown with search, async loading, multi-select, custom item builder, and more.

PhoneField #

International phone number input with country picker, flag, and validation.

LocationField #

Geographic input with map, search, geolocation, and advanced configuration (offline, multi-select, favorite locations, etc.).

FileUploadField #

File upload with preview, cloud storage, security, virus scanning, and advanced file processing options.

SignatureField #

Digital signature capture for forms and agreements.

Platform Support #

Contributing #

We love contributions! Here's how you can help:

1. 🔍 Find a Bug? Open an issue!
2. 🎯 Missing a Feature? Request it!
3. 🎨 Want to Contribute? Submit a pull request!

License #

MIT License © 2025 Kanagaraj.M

View Full License

Made with ❤️ by Kanagaraj.M | NoCorps

💻 Usage #

Complete Form Example #

class LoginForm extends StatefulWidget {
  @override
  _LoginFormState createState() => _LoginFormState();
}

class _LoginFormState extends State<LoginForm> {
  final _formKey = GlobalKey<FormState>();
  final _emailController = TextEditingController();
  final _passwordController = TextEditingController();

  @override
  Widget build(BuildContext context) {
    return Form(
      key: _formKey,
      child: Column(
        children: [
          EmailField(
            controller: _emailController,
            label: 'Email',
            decoration: InputDecoration(
              prefixIcon: Icon(Icons.email),
              border: OutlineInputBorder(
                borderRadius: BorderRadius.circular(12),
              ),
            ),
          ),
          const SizedBox(height: 16),
          PasswordField(
            controller: _passwordController,
            label: 'Password',
            decoration: InputDecoration(
              prefixIcon: Icon(Icons.lock),
              border: OutlineInputBorder(
                borderRadius: BorderRadius.circular(12),
              ),
            ),
          ),
          const SizedBox(height: 24),
          ElevatedButton(
            onPressed: _submitForm,
            child: Text('Login'),
          ),
        ],
      ),
    );
  }

  void _submitForm() {
    if (_formKey.currentState!.validate()) {
      // Process form
    }
  }
}

🎯 Platform Support #

🤝 Contributing #

We love contributions! Here's how you can help:

1. 🔍 Find a Bug? Open an issue!
2. 🎯 Missing a Feature? Request it!
3. 🎨 Want to Contribute? Submit a pull request!

📊 Project Stats #

📚 Resources #

• 📖 API Documentation
• 💡 Examples
• 🐛 Issue Tracker
• 🚀 Changelog

📄 License #

MIT License
Copyright (c) 2025 Kanagaraj.M

View Full License

🔑 Keywords #

flutter form builder, material design forms, flutter input validation, flutter form fields, flutter UI components, form validation, input widgets, flutter forms, dart forms, form components, mobile forms, cross-platform forms, form validation package, input fields, form elements, input forms, form fields, input fields