date_cupertino_bottom_sheet_picker 0.2.0

This is a date package in the form of Cupertino and you can set the age limit of your users. Now supports Imperial Persian (Shahanshahi) calendar.

example/lib/main.dart

import 'package:date_cupertino_bottom_sheet_picker/date_cupertino_bottom_sheet_picker.dart';
import 'package:flutter/material.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Date Picker Demo',
      debugShowCheckedModeBanner: false,
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
        useMaterial3: true,
      ),
      home: const HomePage(),
    );
  }
}

class HomePage extends StatefulWidget {
  const HomePage({super.key});

  @override
  State<HomePage> createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
  // Gregorian
  String gregorianResult = '-';
  String gregorianDateTimeResult = '-';

  // Persian (Shamsi)
  String persianResult = '-';
  String persianDateTimeResult = '-';

  // Imperial Persian (Shahanshahi)
  String imperialResult = '-';
  String imperialDateTimeResult = '-';

  @override
  Widget build(BuildContext context) {
    final w = MediaQuery.of(context).size.width;

    return Scaffold(
      appBar: AppBar(
        title: const Text('Date Cupertino Picker - All Calendars'),
        backgroundColor: Colors.deepPurple,
        foregroundColor: Colors.white,
      ),
      body: SingleChildScrollView(
        padding: const EdgeInsets.all(16),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.stretch,
          children: [
            // ─── Gregorian ───────────────────────────────────────────────
            _SectionHeader(
              title: '📅 Gregorian Date Picker',
              color: Colors.blue,
            ),
            SizedBox(
              width: w * 0.9,
              child: DateCupertinoBottomSheetPicker(
                minWidth: 1.0,
                firstDate: DateTime(1990),
                lastDate: DateTime.now(),
                selectedDate: DateTime(2000, 6, 15),
                minAge: 18,
                textFieldDecoration: TextFieldDecoration(
                  hintText: 'Select Gregorian date',
                  labelText: 'Birth Date',
                ),
                onTimeChanged: (dt, formatted, withDay) {
                  setState(() => gregorianResult = withDay);
                },
              ),
            ),
            _ResultText(label: 'Selected', value: gregorianResult),
            const SizedBox(height: 24),

            // ─── Gregorian Date & Time ────────────────────────────────────
            _SectionHeader(
              title: '⏰ Gregorian Date & Time Picker',
              color: Colors.blue.shade700,
            ),
            SizedBox(
              width: w * 0.9,
              child: DateCupertinoBottomSheetPicker.dateTimePickerGregorian(
                minWidth: 1.0,
                selectedDate: DateTime.now(),
                firstDate: DateTime(2000),
                lastDate: DateTime(2030),
                textFieldDecoration: TextFieldDecoration(
                  hintText: 'Select date and time',
                ),
                onTimeChanged: (dt, formatted, withDay) {
                  setState(() => gregorianDateTimeResult = withDay);
                },
              ),
            ),
            _ResultText(label: 'Selected', value: gregorianDateTimeResult),
            const SizedBox(height: 24),

            const Divider(thickness: 2),

            // ─── Persian (Shamsi) ─────────────────────────────────────────
            _SectionHeader(
              title: '🌙 Persian (Shamsi) Date Picker',
              color: Colors.green,
            ),
            SizedBox(
              width: w * 0.9,
              child: DateCupertinoBottomSheetPicker.datePickerPersian(
                minWidth: 1.0,
                selectedDate: Jalali(1380, 1, 1),
                firstDate: Jalali(1350, 1, 1),
                lastDate: Jalali(1420, 1, 1),
                textFieldDecoration: TextFieldDecoration(
                  hintText: 'انتخاب تاریخ شمسی',
                  labelText: 'تاریخ تولد',
                ),
                onChanged: (jalali, formatted, withDay) {
                  setState(() => persianResult = withDay);
                },
              ),
            ),
            _ResultText(label: 'انتخاب شده', value: persianResult),
            const SizedBox(height: 24),

            // ─── Persian Date & Time ──────────────────────────────────────
            _SectionHeader(
              title: '⏰ Persian (Shamsi) Date & Time Picker',
              color: Colors.green.shade700,
            ),
            SizedBox(
              width: w * 0.9,
              child: DateCupertinoBottomSheetPicker.dateTimePickerPersian(
                minWidth: 1.0,
                selectedDate: Jalali.now(),
                firstDate: Jalali(1390, 1, 1),
                lastDate: Jalali(1410, 1, 1),
                textFieldDecoration: TextFieldDecoration(
                  hintText: 'انتخاب تاریخ و ساعت شمسی',
                ),
                onDateAndTimeChanged:
                    (jalali, formatted, withDay, time, timeStr, timePersian) {
                      setState(
                        () => persianDateTimeResult = '$withDay  $timePersian',
                      );
                    },
              ),
            ),
            _ResultText(label: 'انتخاب شده', value: persianDateTimeResult),
            const SizedBox(height: 24),

            const Divider(thickness: 2),

            // ─── Imperial Persian (Shahanshahi) ───────────────────────────
            _SectionHeader(
              title: '👑 Imperial Persian (Shahanshahi) Date Picker',
              color: Colors.orange,
            ),
            SizedBox(
              width: w * 0.9,
              child: DateCupertinoBottomSheetPicker.datePickerImperialPersian(
                minWidth: 1.0,
                selectedDate: ImperialPersianDate(2560, 1, 1),
                firstDate: ImperialPersianDate(2500, 1, 1),
                lastDate: ImperialPersianDate(2600, 1, 1),
                textFieldDecoration: TextFieldDecoration(
                  hintText: 'انتخاب تاریخ شاهنشاهی',
                  labelText: 'تاریخ شاهنشاهی',
                ),
                onChanged: (imperialDate, formatted, withDay) {
                  setState(() => imperialResult = withDay);
                },
              ),
            ),
            _ResultText(label: 'انتخاب شده', value: imperialResult),
            const SizedBox(height: 24),

            // ─── Imperial Persian Date & Time ─────────────────────────────
            _SectionHeader(
              title: '⏰ Imperial Persian Date & Time Picker',
              color: Colors.orange.shade700,
            ),
            SizedBox(
              width: w * 0.9,
              child:
                  DateCupertinoBottomSheetPicker.dateTimePickerImperialPersian(
                    minWidth: 1.0,
                    selectedDate: ImperialPersianDate.now(),
                    firstDate: ImperialPersianDate(2500, 1, 1),
                    lastDate: ImperialPersianDate(2600, 1, 1),
                    textFieldDecoration: TextFieldDecoration(
                      hintText: 'انتخاب تاریخ و ساعت شاهنشاهی',
                    ),
                    onDateAndTimeChanged:
                        (
                          imperialDate,
                          formatted,
                          withDay,
                          time,
                          timeStr,
                          timePersian,
                        ) {
                          setState(
                            () => imperialDateTimeResult =
                                '$withDay  $timePersian',
                          );
                        },
                  ),
            ),
            _ResultText(label: 'انتخاب شده', value: imperialDateTimeResult),
            const SizedBox(height: 40),
          ],
        ),
      ),
    );
  }
}

class _SectionHeader extends StatelessWidget {
  final String title;
  final Color color;

  const _SectionHeader({required this.title, required this.color});

  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: const EdgeInsets.only(bottom: 10),
      child: Text(
        title,
        style: TextStyle(
          fontSize: 16,
          fontWeight: FontWeight.bold,
          color: color,
        ),
      ),
    );
  }
}

class _ResultText extends StatelessWidget {
  final String label;
  final String value;

  const _ResultText({required this.label, required this.value});

  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: const EdgeInsets.only(top: 6),
      child: Text(
        '$label: $value',
        style: const TextStyle(fontSize: 13, color: Colors.black54),
        textAlign: TextAlign.center,
      ),
    );
  }
}