smart_advanced_text_field #

A professional, reusable Flutter TextField package with built-in validation, formatters, theming, OTP field, and multiple styles — designed as a small UI framework you can drop into any project.

Features #

✅ 18 professional input widgets
✅ 7 built-in field styles
✅ 13 input types with auto keyboard and formatters
✅ Built-in validators (email, password, phone, username, url)
✅ Built-in input formatters (phone, currency, credit card)
✅ Global theme support via SmartTextFieldThemeProvider
✅ Light and dark theme presets
✅ Named constructors for common fields
✅ GitHub Actions CI on every push
✅ 42 unit tests

Installation #

Add to your pubspec.yaml:

dependencies:
  smart_advanced_text_field: ^2.4.2

Then import:

import 'package:smart_advanced_text_field/smart_advanced_text_field.dart';

Setup — Global Theme #

Wrap your MaterialApp with SmartTextFieldThemeProvider:

SmartTextFieldThemeProvider(
  theme: SmartTextFieldTheme.light(), // or .dark()
  child: MaterialApp(
    home: MyHomePage(),
  ),
)

Field Styles #

// Outlined (default)
SmartTextField(style: FieldStyle.outlined, hintText: 'Outlined')

// Filled
SmartTextField(style: FieldStyle.filled, hintText: 'Filled')

// Underlined
SmartTextField(style: FieldStyle.underlined, hintText: 'Underlined')

// Rounded
SmartTextField(style: FieldStyle.rounded, hintText: 'Rounded')

// Search
SmartTextField(style: FieldStyle.search, hintText: 'Search...')

// Modern
SmartTextField(style: FieldStyle.modern, hintText: 'Modern')

// Flat
SmartTextField(style: FieldStyle.flat, hintText: 'Flat')

Input Types #

SmartTextField(inputType: AppInputType.email)
SmartTextField(inputType: AppInputType.password)
SmartTextField(inputType: AppInputType.phone)
SmartTextField(inputType: AppInputType.number)
SmartTextField(inputType: AppInputType.decimal)
SmartTextField(inputType: AppInputType.currency)
SmartTextField(inputType: AppInputType.url)
SmartTextField(inputType: AppInputType.multiline)
SmartTextField(inputType: AppInputType.search)
SmartTextField(inputType: AppInputType.name)
SmartTextField(inputType: AppInputType.username)
SmartTextField(inputType: AppInputType.otp)

Named Constructors #

SmartTextField.email(controller: emailController)
SmartTextField.password(controller: passwordController)
SmartTextField.search(controller: searchController)
SmartTextField.phone(controller: phoneController)

Form Validation #

final _formKey = GlobalKey<FormState>();

Form(
  key: _formKey,
  child: Column(
    children: [
      SmartTextFormField.email(
        validator: SmartValidators.email,
      ),
      SmartTextFormField.password(
        validator: SmartValidators.password,
      ),
      ElevatedButton(
        onPressed: () {
          if (_formKey.currentState!.validate()) {
            // form is valid
          }
        },
        child: Text('Submit'),
      ),
    ],
  ),
)

Built-in Validators #

SmartValidators.required()
SmartValidators.email
SmartValidators.password
SmartValidators.phone
SmartValidators.username
SmartValidators.name
SmartValidators.url
SmartValidators.number
SmartValidators.minLength(8)
SmartValidators.maxLength(20)
SmartValidators.confirmPassword(passwordController.text)

// Combine multiple validators
SmartValidators.compose([
  SmartValidators.required(),
  SmartValidators.minLength(3),
])

Built-in Formatters #

SmartFormatters.digitsOnly
SmartFormatters.lettersOnly
SmartFormatters.lettersAndSpaces
SmartFormatters.alphanumeric
SmartFormatters.username
SmartFormatters.decimal
SmartFormatters.phone
SmartFormatters.currency
SmartFormatters.uppercase
SmartFormatters.lowercase
SmartFormatters.email
SmartFormatters.noSpaces
SmartFormatters.creditCard
SmartFormatters.maxLength(10)

Custom Theme #

SmartTextFieldThemeProvider(
  theme: SmartTextFieldTheme(
    borderRadius: 16.0,
    borderColor: Colors.grey.shade300,
    focusedBorderColor: Colors.purple,
    errorBorderColor: Colors.red,
    filledColor: Colors.grey.shade100,
    textColor: Colors.black87,
    hintColor: Colors.grey,
    fontSize: 14.0,
  ),
  child: MaterialApp(...)
)

Widgets #

1. SmartTextField #

SmartTextField(
  inputType: AppInputType.email,
  style: FieldStyle.outlined,
  labelText: 'Email',
  hintText: 'Enter email',
  prefixIcon: Icons.email_outlined,
  validator: SmartValidators.email,
  onChanged: (value) {},
)

// Named constructors
SmartTextField.email()
SmartTextField.password()
SmartTextField.search()
SmartTextField.phone()

2. SmartTextFormField #

Form(
  key: _formKey,
  child: Column(
    children: [
      SmartTextFormField.email(
        validator: SmartValidators.email,
      ),
      SmartTextFormField.password(
        validator: SmartValidators.password,
      ),
    ],
  ),
)

3. SmartOtpField #

// 6-digit OTP
SmartOtpField(
  length: 6,
  onCompleted: (otp) => print('OTP: $otp'),
)

// 4-digit PIN (obscured)
SmartOtpField(
  length: 4,
  obscureText: true,
  boxWidth: 56,
  boxHeight: 64,
)

4. SmartDateField #

SmartDateField(
  labelText: 'Date of Birth',
  dateFormat: 'dd/MM/yyyy',
  firstDate: DateTime(1900),
  lastDate: DateTime.now(),
  onChanged: (date) => print(date),
)

5. SmartDropdownField #

SmartDropdownField(
  labelText: 'Country',
  searchable: true,
  items: [
    SmartDropdownItem(value: 'pk', label: 'Pakistan', icon: Icons.flag),
    SmartDropdownItem(value: 'us', label: 'United States', icon: Icons.flag),
  ],
  onChanged: (value) => print(value),
)

6. SmartRichTextField #

SmartRichTextField(
  labelText: 'Description',
  hintText: 'Write something...',
  minLines: 4,
  maxLines: 10,
  showCounter: true,
  onChanged: (value) => print(value),
)

7. SmartRatingField #

SmartRatingField(
  labelText: 'Rate your experience',
  maxRating: 5,
  allowHalfRating: true,
  starSize: 36,
  onChanged: (rating) => print(rating),
)

8. SmartTagsField #

SmartTagsField(
  labelText: 'Skills',
  hintText: 'Type and press Enter...',
  maxTags: 10,
  initialTags: ['Flutter', 'Dart'],
  onChanged: (tags) => print(tags),
)

9. SmartColorPickerField #

SmartColorPickerField(
  labelText: 'Brand Color',
  initialColor: Colors.blue,
  onChanged: (color) => print(color),
)

10. SmartPhoneField #

SmartPhoneField(
  labelText: 'Phone Number',
  initialCountry: CountryCode(
    name: 'Pakistan',
    code: 'PK',
    dialCode: '+92',
    flag: '🇵🇰',
  ),
  onChanged: (phone) => print(phone),
  onCountryChanged: (country) => print(country.name),
)

11. SmartSignatureField #

final _signatureKey = GlobalKey();

SmartSignatureField(
  labelText: 'Signature',
  height: 200,
  penColor: Colors.black,
  strokeWidth: 3.0,
  onChanged: (hasSignature) => print(hasSignature),
)

// Clear signature
_signatureKey.currentState?.clear();

12. SmartImagePickerField #

SmartImagePickerField(
  labelText: 'Profile Photo',
  imageSource: SmartImageSource.both,
  height: 200,
  onChanged: (path) => print(path),
)

13. SmartSliderField #

// Single slider
SmartSliderField(
  labelText: 'Volume',
  min: 0,
  max: 100,
  initialValue: 50,
  valueSuffix: '%',
  onChanged: (value) => print(value),
)

// Range slider
SmartSliderField(
  labelText: 'Price Range',
  isRange: true,
  min: 0,
  max: 1000,
  valuePrefix: '\$',
  initialRangeStart: 100,
  initialRangeEnd: 500,
  onRangeChanged: (range) => print(range),
)

14. SmartSwitchField #

SmartSwitchField(
  labelText: 'Dark Mode',
  description: 'Enable dark theme',
  icon: Icons.dark_mode_outlined,
  initialValue: false,
  showDivider: true,
  onChanged: (value) => print(value),
)

15. SmartCheckboxField #

SmartCheckboxField(
  labelText: 'Select Skills',
  showSelectAll: true,
  maxSelections: 3,
  items: [
    SmartCheckboxItem(
      label: 'Flutter',
      value: 'flutter',
      icon: Icons.phone_android,
      initiallyChecked: true,
    ),
    SmartCheckboxItem(
      label: 'Dart',
      value: 'dart',
      icon: Icons.code,
    ),
    SmartCheckboxItem(
      label: 'Firebase',
      value: 'firebase',
      icon: Icons.cloud_outlined,
    ),
  ],
  onChanged: (selected) => print(selected),
)

16. SmartRadioField #

SmartRadioField(
  labelText: 'Gender',
  initialValue: 'male',
  items: [
    SmartRadioItem(
      label: 'Male',
      value: 'male',
      icon: Icons.male,
    ),
    SmartRadioItem(
      label: 'Female',
      value: 'female',
      icon: Icons.female,
    ),
    SmartRadioItem(
      label: 'Other',
      value: 'other',
      icon: Icons.person_outline,
    ),
  ],
  onChanged: (value) => print(value),
)

17. SmartStepperField #

// Simple stepper
SmartStepperField(
  labelText: 'Quantity',
  min: 1,
  max: 10,
  initialValue: 1,
  step: 1,
  onChanged: (value) => print(value),
)

// Decimal stepper
SmartStepperField(
  labelText: 'Weight (kg)',
  min: 0,
  max: 200,
  initialValue: 70,
  step: 0.5,
  decimalPlaces: 1,
  valueSuffix: ' kg',
  onChanged: (value) => print(value),
)

18. SmartPinField #

final _pinKey = GlobalKey();

// Obscured PIN
SmartPinField(
  key: _pinKey,
  length: 4,
  obscureText: true,
  hapticFeedback: true,
  onCompleted: (pin) => print('PIN: $pin'),
)

// Visible digits
SmartPinField(
  length: 6,
  obscureText: false,
  boxSize: 48,
  onCompleted: (pin) => print('PIN: $pin'),
)

// Clear PIN
_pinKey.currentState?.clear();

Field Styles #

SmartTextField(style: FieldStyle.outlined)
SmartTextField(style: FieldStyle.filled)
SmartTextField(style: FieldStyle.underlined)
SmartTextField(style: FieldStyle.rounded)
SmartTextField(style: FieldStyle.search)
SmartTextField(style: FieldStyle.modern)
SmartTextField(style: FieldStyle.flat)

Built-in Validators #

SmartValidators.required()
SmartValidators.email
SmartValidators.password
SmartValidators.phone
SmartValidators.username
SmartValidators.name
SmartValidators.url
SmartValidators.number
SmartValidators.minLength(8)
SmartValidators.maxLength(20)
SmartValidators.confirmPassword(passwordController.text)
SmartValidators.compose([
  SmartValidators.required(),
  SmartValidators.minLength(3),
])

Built-in Formatters #

SmartFormatters.digitsOnly
SmartFormatters.lettersOnly
SmartFormatters.lettersAndSpaces
SmartFormatters.alphanumeric
SmartFormatters.username
SmartFormatters.decimal
SmartFormatters.phone
SmartFormatters.currency
SmartFormatters.uppercase
SmartFormatters.lowercase
SmartFormatters.email
SmartFormatters.noSpaces
SmartFormatters.creditCard
SmartFormatters.maxLength(10)

Custom Theme #

SmartTextFieldThemeProvider(
  theme: SmartTextFieldTheme(
    borderRadius: 16.0,
    borderColor: Colors.grey.shade300,
    focusedBorderColor: Colors.purple,
    errorBorderColor: Colors.red,
    filledColor: Colors.grey.shade100,
    textColor: Colors.black87,
    hintColor: Colors.grey,
    fontSize: 14.0,
  ),
  child: MaterialApp(...)
)

Package Structure #

lib/

├── smart_advanced_text_field.dart

└── src/

├── enums/

├── theme/

├── styles/

├── validators/

├── formatters/

├── otp/

└── widgets/

├── smart_text_field_widget.dart

├── smart_text_form_field_widget.dart

├── date/

├── dropdown/

├── richtext/

├── rating/

├── tags/

├── colorpicker/

├── phone/

├── signature/

├── imagepicker/

├── slider/

├── switch/

└── checkbox/

Package Structure #

lib/

├── smart_advanced_text_field.dart ← single import entry point

└── src/

├── enums/

│ ├── field_style.dart ← FieldStyle enum

│ └── input_type.dart ← AppInputType enum

├── theme/

│ └── smart_advanced_text_field_theme.dart

├── styles/

│ └── field_decoration.dart

├── widgets/

│ ├── smart_advanced_text_field_widget.dart

│ └── smart_text_form_field_widget.dart

├── otp/

│ └── smart_otp_field.dart

├── validators/

│ └── validators.dart

└── formatters/

└── input_formatters.dart

About #

This package is built and maintained by Smart Solutions Team.

We build professional, reusable Flutter packages and components to help developers ship faster and cleaner apps.

Credits #

Built with ❤️ by Smart Solutions Team

Contributing #

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

Fork the repository
Create your feature branch (git checkout -b feature/amazing-feature)
Commit your changes (git commit -m 'Add amazing feature')
Push to the branch (git push origin feature/amazing-feature)
Open a Pull Request

smart_advanced_text_field 2.4.2 smart_advanced_text_field: ^2.4.2 copied to clipboard

Metadata

smart_advanced_text_field #

Features #

Installation #

Setup — Global Theme #

Field Styles #

Input Types #

Named Constructors #

Form Validation #

Built-in Validators #

Built-in Formatters #

Custom Theme #

Widgets #

1. SmartTextField #

2. SmartTextFormField #

3. SmartOtpField #

4. SmartDateField #

5. SmartDropdownField #

6. SmartRichTextField #

7. SmartRatingField #

8. SmartTagsField #

9. SmartColorPickerField #

10. SmartPhoneField #

11. SmartSignatureField #

12. SmartImagePickerField #

13. SmartSliderField #

14. SmartSwitchField #

15. SmartCheckboxField #

16. SmartRadioField #

17. SmartStepperField #

18. SmartPinField #

Field Styles #

Built-in Validators #

Built-in Formatters #

Custom Theme #

Package Structure #

Package Structure #

About #

Credits #

Contributing #

License #

← Metadata

Documentation

Publisher

Weekly Downloads

Metadata

Topics

License

Dependencies

More

smart_advanced_text_field 2.4.2
smart_advanced_text_field: ^2.4.2 copied to clipboard