custom_calendar_viewer 0.0.8

Amazing package help you to view your plans or important dates in calendar.

Custom Calendar Viewer

• Amazing package help you to view your plans or important dates in calendar.

Installation

Add this to your pubspec.yaml:

dependencies:
  custom_calendar_viewer: ^Last Version

Features

• Amazing package help you to view your plans or important dates in calendar.
• You can add multi dates or multi ranges.
• you can handle the color for each date or you can use active color to give one color for all.
• you can use your own style for each text.
• The package have animation when you moving between months.
• With this package really you will be able to control your calendar view.
• You can handel the color for each active day (Text or Background).
• You can use Tooltip to give more info about this day.
• Now you can add multiple dates or ranges when the application is started.
• You can handle the color for background or the text color when you add new ranges or dates.
• You can use CustomCalendarType to handle the type of calendar.
  • CustomCalendarType.none this will make the user can't press on the calendar.
  • CustomCalendarType.date this will make the user can add only one date.
  • CustomCalendarType.range this will make the user to add only one range.
  • CustomCalendarType.multiDates this will make the user can add multiple dates.
  • CustomCalendarType.multiRanges this will make the user can add multiple ranges.
  • CustomCalendarType.multiDatesAndRanges this will make the user can add multiple dates and ranges.

Getting started

import 'package:custom_calendar_viewer/custom_calendar_viewer.dart';

void main() {

}

// Start use th package in your State Widget

What you can handle

final List<Date>? dates;
final List<RangeDate>? ranges;
final Function(DateTime date)? onDayTapped;
final Function(List<Date>)? onDatesUpdated;
final Function(List<RangeDate>)? onRangesUpdated;
final CustomCalendarType calendarType;
final Color activeColor;
final Color dropArrowColor;
final Color movingArrowColor;
final Color headerBackground;
final Color daysHeaderBackground;
final Color daysBodyBackground;
final Border? currentDayBorder;
final Border? dayBorder;
final bool showCurrentDayBorder;
final bool showHeader;
final double dropArrowSize;
final double movingArrowSize;
final double radius;
final TextStyle headerStyle;
final TextStyle dayNameStyle;
final TextStyle dayNumStyle;
final TextStyle activeDayNumStyle;
final TextStyle dropDownYearsStyle;
final String local;
final Duration duration;
final Duration yearDuration;
final double headerMarginLeft;
final double headerMarginRight;
final double headerMarginTop;
final double headerMarginBottom;
final double daysMarginLeft;
final double daysMarginRight;
final double daysMarginTop;
final double daysMarginBottom;
final String toolTipMessage;
final double? toolTipHeight;
final EdgeInsets? toolTipPadding;
final EdgeInsets? toolTipMargin;
final bool toolTipPreferBelow;
final TooltipTriggerMode toolTipTriggerMode;
final Decoration? toolTipDecoration;
final TextStyle? toolTipTextStyle;
final TextAlign? toolTipTextAlign;
final Duration? toolTipWaitDuration;
final Duration? toolTipShowDuration;
final bool showTooltip;
final Color addDatesIndicatorColor;
final Color addDatesIndicatorActiveColor;
final TextStyle addDatesTextStyle;
final TextStyle addDatesActiveTextStyle;
final EdgeInsets addDatesMargin;

Usage

For Full Example Go To Example Tap

    CustomCalendarViewer(
        dates: [
            Date(
                date: DateTime(2023, 11, 8),
                color: Colors.red,
            ),
            Date(
                date: DateTime(2023, 11, 10),
                color: Colors.amber,
            ),
            Date(
                date: DateTime(2023, 11, 7),
                color: Colors.amber,
            ),
            Date(
                date: DateTime(2023, 11, 1),
                color: Colors.red,
            ),
            Date(
                date: DateTime(2023, 11, 4),
                color: Colors.white,
                textColor: Colors.red,
            ),
            Date(
                date: DateTime(2023, 11, 5),
                color: Colors.white,
                textColor: Colors.red,
            ),
            Date(
                date: DateTime(2023, 11, 18),
                color: Colors.blue,
            ),
            Date(
              date: DateTime(2023, 11, 22),
            ),
        ],
        ranges: [
            RangeDate(
                start: DateTime(2023, 11, 12),
                end: DateTime(2023, 11, 15),
                color: Colors.red,
            ),
            RangeDate(
                start: DateTime(2023, 11, 24),
                end: DateTime(2023, 11, 27),
                color: Colors.amber,
            ),
            RangeDate(
                start: DateTime(2023, 11, 30),
                end: DateTime(2023, 11, 29),
            ),
        ],
        showCurrentDayBorder: false,
    ),

Additional information

• Say to me in GitHub what you need to see in the package in the next update.
• Wait for more feature soon.

Author

Loay Omar