Open In App

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.




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

Without Label and without validation.






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

With Label and auto validation.




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




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


Article Tags :