How to Take Date of Birth From User Manually in Flutter?

dob_input_field package helps you to take the date of birth from the user manually. This package validates the user inputted date of birth automatically i.e., auto validation. Many Applications need to input the date of birth from the user and then explicitly validate the data which is complicated. But dob_input_field Package in Flutter overcomes this complicated task in an easy way. 

Properties 

  1. Take DOB manually.
  2. Auto validation.
  3. Fixed character length.
  4. Date type input keyboard.
  5. User preferred Decoration.

Installing

Add the dependency into the pubspec.yaml file.

dob_input_field: ^1.0.0

Syntax for Usage

Without Label and without validation.

Dart




DOBInputField(
    firstDate: DateTime(1900),
    lastDate:DateTime.now() ,
    autovalidateMode: AutovalidateMode.disabled,
  ),


Without Label and without validation.

Dart




DOBInputField(
    firstDate: DateTime(1900),
    lastDate:DateTime.now() ,
  ),          


With Label and auto validation.

Dart




DOBInputField(
    firstDate: DateTime(1900),
    lastDate:DateTime.now() ,
    showLabel: true,
    autovalidateMode: AutovalidateMode.always,
    fieldLabelText: "With label",
 ),


Note: firstDate and lastDate properties are required properties.

Code Example

Dart




import 'package:dob_input_field/dob_input_field.dart';
import 'package:flutter/material.dart';
  
void main() {
  runApp(DobInputField());
}
  
class DobInputField extends StatelessWidget {
  const DobInputField({Key? key}) : super(key: key);
  
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      theme: ThemeData(primarySwatch: Colors.teal),
      home: Scaffold(
        appBar: AppBar(
          title: const Text("DOB input field"),
        ),
        body: Container(
          padding: const EdgeInsets.symmetric(vertical: 50, horizontal: 20),
          child: DOBInputField(
            firstDate: DateTime(1900),
            lastDate: DateTime.now(),
            showLabel: true,
            showCursor: true,
            autovalidateMode: AutovalidateMode.always,
            fieldLabelText: "With label",
          ),
        ),
      ),
    );
  }
}


Output



Contact Us