How to use datepicker package

Question

there are not much documentation on how to use the date picker package in flutter, for some reason however the calender is not showing up, is there a way to be able to make a date range picker?

main.dart

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {

    SystemChrome.setEnabledSystemUIMode(SystemUiMode.manual, overlays: []);
    return MaterialApp(
      theme: ThemeData(
          platform: TargetPlatform.iOS,
      ),
      home: HomeScreen(),
      localizationsDelegates: [
      GlobalMaterialLocalizations.delegate,
      MonthYearPickerLocalizations.delegate,
      ],
    );
  }
}

child: IconButton(
  icon: Icon(Icons.calendar_month),
  onPressed: () {
    SfDateRangePicker(
      view: DateRangePickerView.year,
      selectionMode: DateRangePickerSelectionMode.range,
    );
  },
),

Answer 1

You can use package date_time_picker:

Now you can put this container widget in your widget tree to get the result something like below

Container(
                  decoration: BoxDecoration(
                    border: Border.all(
                      color: Color(0xff8E8E8E),
                    ),
                    borderRadius: BorderRadius.circular(6),
                  ),
                  margin: EdgeInsets.only(top: 10),
                  child: Padding(
                    padding: const EdgeInsets.all(8.0),
                    child: Row(
                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
                      children: [
                        Expanded(
                          child: DateTimePicker(
                            decoration: InputDecoration(
                              border: InputBorder.none,
                            ),
                            dateMask: 'dd/MM/yyyy',
                            initialValue: DateTime.now().toString(),
                            type: DateTimePickerType.date,
                            style: TextStyle(
                              fontWeight: FontWeight.w400,
                              fontSize:16,
                              fontFamily: 'Poppins',
                              color: Color(0xff362477),
                            ),
                            firstDate: DateTime(1800),
                            lastDate: DateTime(2050),
                            // This will add one year from current date
                            validator: (value) {
                              return null;
                            },
                            onChanged: (value) {
                              if (value.isNotEmpty) {
                                setState(() {
                                  // _selectedDate = value;
                                });
                              }
                            },
                            onSaved: (value) {
                              if (value!.isNotEmpty) {
                                // _selectedDate = value;
                              }
                            },
                          ),
                        ),
                        Expanded(
                          child: Padding(
                            padding:
                                const EdgeInsets.symmetric(horizontal: 150),
                            child: Icon(
                              Icons.calendar_today_outlined,
                              color: Colors.grey,
                              size: 20,
                            ),
                          ),
                        ),
                      ],
                    ),
                  ),
                ),