Skip to content

dedinopriadi/bee_date_picker

Folders and files

NameName
Last commit message
Last commit date

Latest commit

ย 

History

6 Commits
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 

๐Ÿ Bee Date Picker

A highly customizable and lightweight date selection suite for Flutter.

bee_date_picker provides a reliable and responsive set of widgets for selecting dates and ranges. It's designed to be easy to integrate, deeply customizable through themes, and keeps your project lightweight with zero external dependencies.

pub package flutter GitHub stars


๐Ÿฏ Showcase

Experience the fluid interaction and premium design of Bee Date Picker. Please check the Example Project.

Bee Date Picker Showcase

๐ŸŒ“ Professional Dark & Light Support

Light Mode Dark Mode

โœจ Features Matrix

Feature Single Range Month Year
Inline Widget โœ… โœ… โœ… โœ…
Dialog Helper โœ… โœ… โœ… โœ…
Dark/Light Theme โœ… โœ… โœ… โœ…
Localization โœ… โœ… โœ… โœ…
Custom Builders โœ… โœ… โœ… โœ…
Min/Max Constraints โœ… โœ… โœ… โœ…

๐Ÿš€ Getting Started

1. Installation

Add to your pubspec.yaml:

dependencies:
  bee_date_picker: ^0.1.0

2. High-Fidelity Dialogs (The "One-Liner")

Launch a professional, pre-styled picker dialog immediately.

import 'package:bee_date_picker/bee_date_picker.dart';

void _pickDate() async {
  // 1. Single Date
  final DateTime? date = await showBeeDatePicker(context: context);

  // 2. Date Range
  final DateRange? range = await showBeeDateRangePicker(context: context);

  // 3. Specialized
  final DateTime? month = await showBeeMonthPicker(context: context);
  final int? year = await showBeeYearPicker(context: context);
}

3. Inline Picker (The "Embedded" Way)

Use widgets directly in your layouts for custom integration.

BeeDatePicker(
  controller: BeeDateController(initialDate: DateTime.now()),
  onDateSelected: (date) => print(date),
)

๐Ÿ—๏ธ Mastering the Theme (Signature Pro)

Bee Date Picker uses a centralized BeePickerTheme that adaptations dynamically to system brightness.

Theme Priority

  1. Provided theme parameter in individual pickers.
  2. Parent BeePickerThemeScope in the widget tree.
  3. Default BeePickerDefaults (adapts to Light/Dark mode).

Key Theme Properties

Property Summary
selectedDayColor The primary brand color for selected days.
rangeDayColor Background color for dates within a range selection.
borderRadius Curvature of picker container and selection markers.
headerTitleTextStyle Styling for the Month/Year navigation title.
todayBorderColor Indicator color for the current date.
dialogBackgroundColor Background color of the popup dialog.
BeePickerThemeScope(
  theme: BeePickerTheme(
    selectedDayColor: Color(0xFFFACC15), // Bee Yellow
    borderRadius: 16,
    headerIconColor: Colors.black,
  ),
  child: MyApp(),
)

โš™๏ธ Behavior Configuration

Fine-tune how the picker behaves using BeePickerConfig.

Constraints & Formatting

Property Type Description
minDate DateTime Earliest date allowed.
maxDate DateTime Latest date allowed.
firstDayOfWeek Enum monday or sunday.
showOutsideDays bool Show dates from next/prev months.
locale Locale Force a specific language/formatting.

Controlling Disabled Dates

config: BeePickerConfig(
  disabledDates: DisabledDates(
    weekdays: [DateTime.sunday], // No selection on Sundays
    predicate: (date) {
      // Custom business logic: e.g., no selection on national holidays
      return isPublicHoliday(date);
    },
  ),
)

๐ŸŽฎ Advanced: BeeDateController

For power users, BeeDateController provides programmatic control over the picker's state.

final controller = BeeDateController();

// Navigate programmatically
controller.nextPage();
controller.goToMonth(DateTime(2025, 12));

// Switch View Mode
controller.switchView(BeeCalendarView.year);

// Clear or Set Selection
controller.selectDate(DateTime(2024, 1, 1));

๐Ÿ› ๏ธ Extensibility (Custom Builders)

Wish to replace the header or the day cells entirely? Use our builder API.

BeeDatePicker(
  controller: controller,
  config: BeePickerConfig(
    dayCellBuilder: (context, date, isSelected, isDisabled, isToday, isOutside) {
      return Center(
        child: Text(
          '${date.day}',
          style: TextStyle(color: isSelected ? Colors.amber : Colors.black),
        ),
      );
    },
  ),
)

๐Ÿ Powered by Orion B Project

"Making coding feels like magic."

About

A highly customizable and lightweight date selection suite for Flutter.

Topics

Resources

License

Code of conduct

Contributing

Stars

Watchers

Forks

Packages

 
 
 

Contributors

Languages