feilfeilundfeil / event_calendar

event_calendar

A package that displays a calendar with multiple events.

Installation

dependencies:
    event_calendar: 0.1.1

dependency_overrides:
    event_calendar:
        git: https://github.com/rynssnjn/event_calendar.git

Usage

Initializing an event. The [EventModel] requires a [String] for the title and a [DateTime] for both startDate and endDate. It can also accept an optional value for a [VoidCallback] onSelect that is triggered when the event is tapped as well as optional value for [TextStyle] and [Color] for customizing the UI of the event.

EventModel(
    title: 'Meeting 1',
    startDate: DateTime(2022, 9, 2),
    endDate: DateTime(2022, 9, 10),
    backgroundColor: const Color(0xff31C987),
)

Displaying the calendar with events. Calling [EventCalendar] makes you display the calendar with events. It has a required property called holder wherein you can customize the user interface of the weekdays via [CalendarHolder], weekends and the months. It accepts a list of [EventModel] to show the events on the calendar itself.

EventCalendar(
    holder: CalendarHolder(),
    calendarSize: MediaQuery.of(context).size,
    events: events,
    divisor: 2,
    dateBorderColor: Colors.black,
)

Example

import 'package:event_calendar/event_calendar.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(
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: const MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({Key? key}) : super(key: key);

  @override
  State<StatefulWidget> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  @override
  Widget build(BuildContext context) {
    final events = [
      EventModel(
        title: 'Meeting 1',
        startDate: DateTime(2022, 9, 2),
        endDate: DateTime(2022, 9, 10),
        backgroundColor: const Color(0xff31C987),
      ),
      EventModel(
        title: 'Meeting 2',
        startDate: DateTime(2022, 11, 1),
        endDate: DateTime(2022, 12, 5),
        backgroundColor: const Color(0xff31C987),
      ),
      EventModel(
        title: 'Meeting 3',
        startDate: DateTime(2022, 12, 3),
        endDate: DateTime(2022, 12, 09),
        backgroundColor: const Color(0xff892486),
      ),
      EventModel(
        title: 'Meeting 4',
        startDate: DateTime(2022, 12, 09),
        endDate: DateTime(2022, 12, 12),
        backgroundColor: const Color(0xff892486),
      ),
      EventModel(
        title: 'Meeting 5',
        startDate: DateTime(2022, 12, 12),
        endDate: DateTime(2022, 12, 12),
        backgroundColor: const Color(0xff892486),
      ),
      EventModel(
        title: 'Meeting 6',
        startDate: DateTime(2022, 12, 12),
        endDate: DateTime(2022, 12, 15),
        backgroundColor: const Color(0xff31C987),
      ),
      EventModel(
        title: 'Meeting 7',
        startDate: DateTime(2022, 12, 6),
        endDate: DateTime(2022, 12, 7),
        backgroundColor: const Color(0xff892486),
      ),
      EventModel(
        title: 'Meeting 8',
        startDate: DateTime(2022, 12, 12),
        endDate: DateTime(2022, 12, 12),
        backgroundColor: const Color(0xff31C987),
      ),
      EventModel(
        title: 'Meeting 9',
        startDate: DateTime(2022, 12, 12),
        endDate: DateTime(2022, 12, 12),
        backgroundColor: const Color(0xff31C987),
      ),
      EventModel(
        title: 'Meeting 10',
        startDate: DateTime(2022, 12, 13),
        endDate: DateTime(2022, 12, 18),
        backgroundColor: const Color(0xff31C987),
      ),
      EventModel(
        title: 'Meeting 11',
        startDate: DateTime(2022, 12, 15),
        endDate: DateTime(2022, 12, 22),
        backgroundColor: const Color(0xff892486),
      ),
      EventModel(
        title: 'Meeting 12',
        startDate: DateTime(2022, 12, 21),
        endDate: DateTime(2022, 12, 24),
        backgroundColor: const Color(0xff31C987),
      ),
      EventModel(
        title: 'Meeting 13',
        startDate: DateTime(2022, 12, 10),
        endDate: DateTime(2022, 12, 10),
        backgroundColor: const Color(0xff31C987),
      ),
      EventModel(
        title: 'Meeting 14',
        startDate: DateTime(2022, 12, 8),
        endDate: DateTime(2022, 12, 10),
        backgroundColor: const Color(0xff31C987),
      ),
      EventModel(
        title: 'Rael birthday',
        startDate: DateTime(2021, 04, 23),
        endDate: DateTime(2021, 04, 23),
        backgroundColor: const Color(0xff31C987),
      ),
    ];
    return Scaffold(
      appBar: AppBar(
        title: const Text('Test Calendar'),
        backgroundColor: const Color(0xff509D56),
      ),
      body: EventCalendar(
        holder: CalendarHolder(),
        calendarSize: MediaQuery.of(context).size,
        events: events,
        divisor: 2,
        dateBorderColor: Colors.black,
      ),
    );
  }
}