A Heatmap Calendar based on Github's contributions chart

Related tags

Calendar charts heatmap flutter heatmap-calendar
Overview

Build Status

Flutter Heat Map Calendar

A Heat Map Calendar based on Github's contributions chart which can be used to visualize values over time

HeatMap Calendar in action

Installing

1. Depend on it

Add this to your package's pubspec.yaml file:

dependencies:
  heatmap_calendar: ^1.2.8

2. Install it

You can install packages from the command line:

with pub:

$ pub get

with Flutter:

$ flutter pub get

Example

import 'package:heatmap_calendar/heatmap_calendar.dart';
import 'package:heatmap_calendar/time_utils.dart';
...

HeatMapCalendar(
  input: {
    TimeUtils.removeTime(DateTime.now().subtract(Duration(days: 3))): 5,
    TimeUtils.removeTime(DateTime.now().subtract(Duration(days: 2))): 35,
    TimeUtils.removeTime(DateTime.now().subtract(Duration(days: 1))): 14,
    TimeUtils.removeTime(DateTime.now()): 5,
  },
  colorThresholds: {
    1: Colors.green[100],
    10: Colors.green[300],
    30: Colors.green[500]
  },
  weekDaysLabels: ['S', 'M', 'T', 'W', 'T', 'F', 'S'],
  monthsLabels: [
    "",
    "Jan",
    "Feb",
    "Mar",
    "Apr",
    "May",
    "Jun",
    "Jul",
    "Aug",
    "Sep",
    "Oct",
    "Nov",
    "Dec",
  ],
  squareSize: 16.0,
  textOpacity: 0.3,
  labelTextColor: Colors.blueGrey,
  dayTextColor: Colors.blue[500],
)
Comments
  • The current week of calender is not showing

    The current week of calender is not showing

    the very recent week is not mapping and filing the color when it's updated, like one whole week is not showing up in very right side of the calendar.

    I will appreciate any suggestions please.

    opened by Renkon117 5
  • Display days for unfinished week

    Display days for unfinished week

    • Change logic how column added to support unfinished week
    • Add fixed date for test
    • Test multiple days

    I added date in WeekColumns constructor to ease testing. But also it could help with features like displaying custom date, or scrolling.

    Closes #1

    opened by AndriiChuzhynov 2
  • Fix problem when days is not shown after DST change

    Fix problem when days is not shown after DST change

    I found that previous days is not colored after daylight saving time (DST) change. For example, if DST change happens at 25 Oct - all dates before will not be colored.

    This happens because DateTime subtract() or add() subtracts exact 24 * 60 * 60 seconds for each day. And it may come to behavior when subtracting one day from midnight may return same day but with 23:00.

    I solved this problem by introducing helper functions safeAdd() and safeSubtract() which removes TZ (convert to UTC) subtracting then adding TZ back

    opened by AndriiChuzhynov 1
  • Confusion with the final column => Example doesn't always work

    Confusion with the final column => Example doesn't always work

    Hi, nice library! I just got confused a bit since the example doesn't work if the current date isn't a Sunday, because you only add a column if it's a multiple of 7. Maybe it makes more sense to always add the final row?

    if (columnItems.isNotEmpty &&
          (columnItems.length == 8 || dateList.isEmpty || i == amount - 1)) {
        columns.add(Column(children: columnItems));
        columnItems = new List();
      }
    opened by ShiroYacha 0
  • Added OnDateClicked to calendar. Triggers when date boxes clicked

    Added OnDateClicked to calendar. Triggers when date boxes clicked

    Added click listener to each date tile. I needed it in a project so others might also need it. Now one tap on the date tile triggers OnDateClicked whereas two taps still work to show/hide date tile labels.

    opened by adarsh177 0
  • Compilation error due to deprecated

    Compilation error due to deprecated "overflow" parameter in Stack

    Hi. Your library looks great! I wanted to try it out but I had a compilation error due to the use of a (soon to be) removed parameter. I was using the dev channel of Flutter, switching back to stable fixed it.

    The overflow parameter of Stack widget is deprecated, see https://github.com/flutter/flutter/issues/66030.

    However the workaround is pretty easy, we ust need to replace it with clipBehavior. :+1:

    opened by Delgan 0
  • Possible bug when widget updates

    Possible bug when widget updates

    Awesome package! Thanks!

    I am using the HeatMapCalendar, but sometimes when it updates, values disappear and dates are shifted by one. Can someone help me or it is a known bug?

    Thanks!

    image image

    opened by alekseifm 3
Releases(1.2.8)
Owner
Pedro H. F. Feitosa
Software Engineer.
Pedro H. F. Feitosa
GitHub https://pub.dev/packages/heatmap_calendar
A Flutter package allows you to easily implement all calendar UI and calendar event functionality. 👌🔝🎉

calendar_view A Flutter package allows you to easily implement all calendar UI and calendar event functionality. For web demo visit Calendar View Exam

Simform Solutions 219 Dec 22, 2022
Flutter calendar app. register schedule and manage in calendar ui.

flutter calendar app. register schedule and manage in calendar ui. save schedule data in firestore. and create widget and read schedule from firestore in widget.

akiho 11 Oct 30, 2022
Highly customizable, feature-packed calendar works like google calendar but with more features.

Beca [In Progress] Beca is a Calendar that you could manage your daily tasks and schedule meetings with your friends just like google calendar Concept

Mohammad Javad Hossieni 19 Nov 15, 2022
CalendarDatePicker2 - A lightweight and customizable calendar picker based on Flutter CalendarDatePicker

A lightweight and customizable calendar picker based on Flutter CalendarDatePicker, with support for single date picker, range picker and multi picker.

Neo Liu 27 Dec 22, 2022
Calendar widget for flutter

Calendar Shows a scrolling calendar list of events. This is still relatively basic, it always assumes that the getEvents returns the entire list of ca

null 223 Dec 19, 2022
Highly customizable, feature-packed calendar widget for Flutter

Table Calendar Highly customizable, feature-packed Flutter Calendar with gestures, animations and multiple formats. Table Calendar with custom styles

Aleksander Woźniak 1.5k Jan 7, 2023
A Flutter package for using Jalali (Shamsi, Solar, Persian or Jalaali) calendar. You can convert, format and manipulate Jalali and Gregorian (Miladi) dates.

A Flutter package for using Jalali (Shamsi, Solar, Persian or Jalaali) calendar. You can convert, format and manipulate Jalali and Gregorian (Miladi) dates.

Amirreza Madani 63 Dec 21, 2022
Flutter Date Picker Library that provides a calendar as a horizontal timeline.

DatePickerTimeline Flutter Date Picker Library that provides a calendar as a horizontal timeline. How To Use Import the following package in your dart

LiLi 0 Oct 25, 2021
Easy to use and beautiful calendar strip component for Flutter.

Flutter Calendar Strip Easy to use and beautiful calendar strip component for Flutter. Awesome celender widget If this project has helped you out, ple

Siddharth V 176 Dec 14, 2022
A calendar widget to easily scroll through the years 🗓

Flutter Scrolling Calendar A customizable calendar widget to easily scroll through the years. Features Choose range of years and the initial year to s

Menno Renkens 113 Nov 19, 2022
Flutter Date Picker Library that provides a calendar as a horizontal timeline

Flutter Date Picker Library that provides a calendar as a horizontal timeline.

Vivek Kaushik 214 Jan 7, 2023
Calendar widget library for Flutter apps.

Calendarro Calendar widget library for Flutter apps. Offers multiple ways to customize the widget. Getting Started Installation Add dependency to your

Adam Styrc 97 Nov 30, 2022
Flutter Inline Calendar

inline_calendar An inline calendar flutter package inspired by outlook app. It also supports Jalali/Shamsi calendar. Uses theme and locale of context

omid habibi 3 Oct 21, 2022
A calendar widget for Flutter.

flutter_calendar A calendar widget for Flutter Apps. Borrowed DateTime utility functions from the Tzolkin Calendar web element. Usage Add to your pubs

AppTree Software, Inc 336 Sep 6, 2022
Flutter calendar week UI package

Flutter calendar week Flutter calendar week UI package IOS | Android: import 'package:flutter_calendar_week/flutter_calendar_week.dart'; CalendarWeek(

null 67 Dec 12, 2022
A seasonal foods calendar app written in Dart using Flutter.

This project is not actively maintained anymore. However, everybody who wants to do so is more than welcome to work on this project! Thank you for you

Andreas Boltres 63 Nov 19, 2022
Collection of customisable calendar related widgets for Flutter.

calendar_views Collection of customisable calendar related widgets for Flutter. Day View Day View Documentation Set of widgets for displaying a day vi

Zen Lednik 99 Sep 8, 2022
Fluboard - Calendar wall-board-display built with Flutter and ❤️

Fluboard Calendar wall-board-display built with Flutter and ❤️ Goals Build calendar board (DAKBoard alternative) which easy to install and easy to cus

iTeqno 10 Dec 27, 2022
A Heatmap Calendar based on Github's contributions chart

Flutter Heat Map Calendar A Heat Map Calendar based on Github's contributions chart which can be used to visualize values over time Installing 1. Depe

Pedro H. F. Feitosa 49 Dec 6, 2022
Flutter heatmap calendar inspired by github contribution chart. [traditional mode / calendar mode]

Flutter Heatmap Flutter heatmap calendar inspired by github contribution chart.

Kim Seung Hwan 1 Dec 26, 2021