📅 Flutter Custom Calendar

A fully customizable calendar package for Flutter that supports all platforms (iOS, Android, Web, Desktop). Easily integrate beautiful and interactive calendars into your apps with flexible design customization, event management, and multi-platform compatibility.

---

✨ Features

• 📆 Customizable UI – Colors, fonts, shapes, and layouts.
• 🎨 Theming Support – Custom mode ready.
• 🗓 Multiple Views – Month, Week, Day.
• 🔄 Multi-Platform Support – Android, iOS, Web, Windows, macOS, Linux.
• ⚡ Performance Optimized – Smooth scrolling & rendering.
• 🛠 Developer Friendly – Simple APIs and clean architecture.

---

🚀 Installation

Add the dependency in your pubspec.yaml:

dependencies:
  flutter_calenders: ^0.0.7

Run:

flutter pub get

---

📖 Usage

1️⃣ Event Based Calendar

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

class MyCalendarPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: EventBasedCalender(
          margin: EdgeInsets.symmetric(horizontal: 10),
          padding: EdgeInsets.all(10),
          events: [
            Event(
              eventName: 'Sick leave',
              dates: [DateTime(2025, 8, 21), DateTime(2025, 8, 22)],
              color: Colors.green,
            ),
            Event(
              eventName: 'Paid leave',
              dates: [DateTime(2025, 8, 17), DateTime(2025, 8, 18)],
              color: Colors.orange,
            ),
          ],
          primaryColor: Colors.blue,
          backgroundColor: Colors.blue.withValues(alpha: .05),
          chooserColor: Colors.black,
          endYear: 2028,
          startYear: 2020,
          currentMonthDateColor: Colors.black,
          pastFutureMonthDateColor: Colors.grey,
          isSelectedColor: Colors.amber,
          isSelectedShow: true,
          showEvent: true,
          onDateTap: (date) {
            print(date);
          },
        ),
      ),
    );
  }
}

---

2️⃣ Schedule Based Calendar

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

class MySchedulePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.black,
      body: Center(
        child: ScheduleBasedCalender(
          events: [
            Event(
              eventName: 'Sick leave',
              dates: [DateTime(2025, 8, 21), DateTime(2025, 8, 22)],
              color: Colors.green,
            ),
            Event(
              eventName: 'Paid leave',
              dates: [DateTime(2025, 8, 17), DateTime(2025, 8, 18)],
              color: Colors.orange,
            ),
          ],
          currentMonth: 8,
          currentYear: 2025,
          backgroundColor: Colors.white.withValues(alpha: .1),
          monthDateColor: Colors.white.withValues(alpha: .1),
          weekdayColor: Colors.white.withValues(alpha: .1),
          monthTextColor: Colors.white,
          weekdayTextColor: Colors.white,
          isSelectedShow: true,
          isSelectedColor: Colors.deepOrange,
          onDateTap: (date) {
            print(date);
          },
        ),
      ),
    );
  }
}

2️⃣ Event Based Calendar Theme 2

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

class MyEventPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.black,
      body: Center(
        child: EventCalendarTheme2(
              markAllDates: true,
              coloredEvents: [
                Event(
                  eventName: 'Absent',
                  dates: [7, 14, 21, 28, 20].map((e) => DateTime(2025, 9, e)).toList(),
                  color: Colors.red,
                ),
              ],
              margin: EdgeInsets.symmetric(horizontal: 10),
              padding: EdgeInsets.all(10),
              events: [
                Event(
                  eventName: 'Present',
                  dates: [
                    1,
                    2,
                    3,
                    4,
                    5,
                    8,
                    9,
                    10,
                    11,
                    12,
                    15,
                    16,
                    17,
                    18,
                    19,
                    22,
                    23,
                    24,
                  ].map((element) => DateTime(2025, 9, element)).toList(),
                  color: Colors.green,
                ),
              ],
              primaryColor: Colors.blueGrey,
              backgroundColor: Colors.white,
              chooserColor: Colors.black,
              todayColor: Colors.blue.withValues(alpha: .5),
              endYear: 2028,
              startYear: 2020,
              currentMonthDateColor: Colors.black,
              pastFutureMonthDateColor: Colors.grey,
              isSelectedColor: Colors.amber,
              isSelectedShow: true,
              showEvent: true,
              onDateTap: (date) {
                print(date);
              },
            ),
      ),
    );
  }
}

---

📸 Screenshots

Event Based Calendar

Schedule Based Calendar

Event Based Calendar Thme 2

🎨 Customization Options

You can customize:

• Colors (primary, background, chooser, event markers, selected date, etc.)
• Fonts & Styling
• Date Ranges (startYear, endYear)
• Event Display (enable/disable, custom colors)

---

🤝 Contributing

Contributions are welcome!

1. Fork the repo
2. Create a new branch (feature/my-feature)
3. Commit your changes
4. Open a Pull Request 🚀

---

📜 License

This project is licensed under the MIT License.

---

💙 Support

If you like this package, please ⭐ the repo on GitHub and share it with others. Issues and feature requests are welcome in the GitHub Issues section.