scrollable_calender 0.0.2
scrollable_calender: ^0.0.2 copied to clipboard
A new Flutter package scrollable calender.
0.0.2 #
Fixed #
- Pub Publish Warnings: Resolved all pub publish validation warnings
- Example Directory Structure: Converted example from git submodule to regular directory
- Build Artifacts: Cleaned up build artifacts and unnecessary files from example directory
- Package Structure: Improved overall package structure for better pub.dev compatibility
Technical Improvements #
- Removed embedded git repository from example directory
- Cleaned
.gradle,.cxx,build/, and.dart_tool/directories - Added proper
.pubignorefile for publication control - Updated git tracking to treat example as regular files instead of submodule
Package Size Optimization #
- Reduced package size from 390 KB to 74 KB
- Removed unnecessary build files and dependencies
- Optimized example app structure for publication
0.0.1 #
Added #
- Initial Release of Kest Scrollable Calendar package
- Dual Usage Patterns:
- Traditional
CustomDateSelectorwidget for form field integration - Standalone
CalendarBottomSheetmethods for bottom sheet functionality
- Traditional
- Comprehensive Theme System:
- Built-in light and dark themes
- Complete color customization for all components
CalendarTheme.copyWith()method for easy theme inheritance
- Smart Center Detection:
- Only the selected item appears bold and prominent
- Automatic selection when scrolling to center
- Clean design with 3-4 visible items
- Multiple Picker Types:
- Full date picker (day, month, year)
- Month/Year picker only
- Customizable date ranges with
maxYearparameter
- Highly Customizable CTA Buttons:
- Custom button text with
buttonTextparameter - Completely custom button widgets with
customButtonparameter - Gradient and styled button examples
- Custom button text with
- Responsive Design:
- Adapts to different screen sizes (mobile, tablet, desktop)
- Optimized spacing and font sizes
- MediaQuery-based responsive behavior
- Advanced Features:
- Scrollable pickers with smooth animations
- Visual scaling and opacity effects based on distance from center
- Padding support for selecting first and last items
- Consistent center detection across all pickers
- Complete Documentation:
- Comprehensive README with usage examples
- All customization options documented
- Theme property reference table
- Integration examples for dropdowns and forms
Features #
- CalendarTheme Properties:
backgroundColor- Background colorprimaryColor- Primary text colortextColor- General text colorselectedColor- Selected/bold item colordividerColor- Divider lines colorbuttonColor- Button background colorbuttonTextColor- Button text colortitleColor- Title text colorhandleColor- Handle/drag color
- CustomDateSelector Parameters:
onDateSelected- Callback for date selectionlabel- Form field labeltheme- Custom thememaxYear- Maximum year rangebuttonText- Custom button textcustomButton- Custom button widget
- CalendarBottomSheet Methods:
showDatePicker()- Full date selectionshowMonthYearPicker()- Month/year only selection- Theme and button customization support
Technical Details #
- Center Detection Logic:
- 55px center offset for optimal positioning
- 60px padding for first/last item selection
sizeFactor > 1.2threshold for bold text- Font weight: w600 (bold) vs w400 (normal)
- Font size: 28px (center) vs 16px (normal)
- Visual Effects:
- Transform.scale for size variations
- Opacity changes based on distance from center
- Smooth scroll physics and animations
- State Management:
- StatefulBuilder for modal bottom sheets
- Proper setState calls for UI updates
- ScrollController listeners for real-time updates
Usage Examples #
// TextForm Field Integration
CustomDateSelector(
label: "Birth Date",
theme: CalendarTheme.light,
onDateSelected: (year, month, day) {
print('Selected: $day/$month/$year');
},
)
// Standalone Bottom Sheet
CalendarBottomSheet.showDatePicker(
context,
title: "Select Date",
theme: CalendarTheme.dark,
onDateSelected: (year, month, day) {
print('Selected: $day/$month/$year');
},
)
// Custom Theme
CalendarTheme.light.copyWith(
selectedColor: Colors.red,
buttonColor: Colors.orange,
dividerColor: Colors.blue,
)
// Custom Button Widget
CalendarBottomSheet.showDatePicker(
context,
customButton: Container(/* custom button */),
onDateSelected: (year, month, day) { /* ... */ },
)
Dependencies #
- Flutter SDK
- No external dependencies required
Breaking Changes #
- None (initial release)
Migration Guide #
- N/A (initial release)
[0.0.1] - 2024-01-XX #
Added #
- Initial package setup
- Basic project structure
- README placeholder
For more details about each version, please refer to the README.md file.