[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"project-9552":3},{"id":4,"name":5,"fullName":6,"owner":7,"repo":5,"description":8,"homepage":9,"htmlUrl":10,"language":11,"languages":10,"totalLinesOfCode":10,"stars":12,"forks":13,"watchers":14,"openIssues":15,"contributorsCount":16,"subscribersCount":16,"size":16,"stars1d":16,"stars7d":16,"stars30d":17,"stars90d":16,"forks30d":16,"starsTrendScore":16,"compositeScore":18,"rankGlobal":10,"rankLanguage":10,"license":19,"archived":20,"fork":20,"defaultBranch":21,"hasWiki":20,"hasPages":20,"topics":22,"createdAt":10,"pushedAt":10,"updatedAt":27,"readmeContent":28,"aiSummary":29,"trendingCount":16,"starSnapshotCount":16,"syncStatus":17,"lastSyncTime":30,"discoverSource":31},9552,"flutter_calendar_carousel","hyochan\u002Fflutter_calendar_carousel","hyochan"," Calendar widget for flutter that is swipeable horizontally. This widget can help you build your own calendar widget highly customizable.","",null,"Dart",861,322,14,4,0,2,11.53,"MIT License",false,"main",[23,24,25,26],"calendar","calendar-widget","dart","flutter","2026-06-12 02:02:09","# flutter_calendar_carousel\n\n[![Pub Version](https:\u002F\u002Fimg.shields.io\u002Fpub\u002Fv\u002Fflutter_calendar_carousel.svg?style=flat-square)](https:\u002F\u002Fpub.dartlang.org\u002Fpackages\u002Fflutter_calendar_carousel)\n[![Flutter CI](https:\u002F\u002Fgithub.com\u002Fhyochan\u002Fflutter_calendar_carousel\u002Factions\u002Fworkflows\u002Fci.yml\u002Fbadge.svg)](https:\u002F\u002Fgithub.com\u002Fhyochan\u002Fflutter_calendar_carousel\u002Factions\u002Fworkflows\u002Fci.yml)\n[![Coverage Status](https:\u002F\u002Fcodecov.io\u002Fgh\u002Fhyochan\u002Fflutter_calendar_carousel\u002Fbranch\u002Fmaster\u002Fgraph\u002Fbadge.svg?token=KTrSs3fGsS)](https:\u002F\u002Fcodecov.io\u002Fgh\u002Fhyochan\u002Fflutter_calendar_carousel)\n![License](https:\u002F\u002Fimg.shields.io\u002Fbadge\u002Flicense-MIT-blue.svg)\n\nCalendar widget for flutter that is swipeable horizontally. This widget can help you build your own calendar widget highly customizable. Now you can even add your icon for each event.\n\n## Notice\nThis widget is compatible with flutter V3 from version `2.4.+`.\n\n## New Feature\n\n[2.0.3]\n\n- Multiple days selection using `addRange` method [#285](https:\u002F\u002Fgithub.com\u002Fhyochan\u002Fflutter_calendar_carousel\u002Fpull\u002F285)\n\n- Check out great feature `customDayBuilder` work done by [maxgmer](https:\u002F\u002Fgithub.com\u002Fmaxgmer) :tada:.\n\n#### Rectangular style\n\n![image](https:\u002F\u002Fraw.githubusercontent.com\u002Fhyochan\u002Fflutter_calendar_carousel\u002Fmaster\u002Fdoc\u002Fcalendar1.gif)\n\n#### Circular style\n\n![image](https:\u002F\u002Fraw.githubusercontent.com\u002Fhyochan\u002Fflutter_calendar_carousel\u002Fmaster\u002Fdoc\u002Fcalendar2.gif)\n\n#### No border\n\n![image](https:\u002F\u002Fraw.githubusercontent.com\u002Fhyochan\u002Fflutter_calendar_carousel\u002Fmaster\u002Fdoc\u002Fcalendar3.gif)\n\n#### Marked Dates\n\n![image](https:\u002F\u002Fraw.githubusercontent.com\u002Fhyochan\u002Fflutter_calendar_carousel\u002Fmaster\u002Fdoc\u002Fcalendar4.gif)\n\n#### Custom Icon Events\n\n![image](https:\u002F\u002Fraw.githubusercontent.com\u002Ficemanbsi\u002Fflutter_calendar_carousel\u002Fmaster\u002Fdoc\u002Fcalendar5.gif)\n\n## Getting Started\n\nFor help getting started with Flutter, view our online\n[documentation](https:\u002F\u002Fflutter.io\u002F).\n\n## Props\n\n| props                          |           types            |                                                defaultValues                                                |\n| :----------------------------- | :------------------------: | :---------------------------------------------------------------------------------------------------------: |\n| viewPortFraction               |          `double`          |                                                     1.0                                                     |\n| prevDaysTextStyle              |        `TextStyle`         |                                                                                                             |\n| daysTextStyle                  |        `TextStyle`         |                                                                                                             |\n| nextDaysTextStyle              |        `TextStyle`         |                                                                                                             |\n| prevMonthDayBorderColor        |          `Color`           |                                             Colors.transparent                                              |\n| thisMonthDayBorderColor        |          `Color`           |                                             Colors.transparent                                              |\n| nextMonthDayBorderColor        |          `Color`           |                                             Colors.transparent                                              |\n| dayPadding                     |          `double`          |                                                     2.0                                                     |\n| height                         |          `double`          |                                               double.infinity                                               |\n| width                          |          `double`          |                                               double.infinity                                               |\n| todayTextStyle                 |        `TextStyle`         |                                    `fontSize: 14.0, color: Colors.white`                                    |\n| dayButtonColor                 |          `Color`           |                                                 Colors.red                                                  |\n| todayBorderColor               |          `Color`           |                                                 Colors.red                                                  |\n| todayButtonColor               |          `Colors`          |                                                 Colors.red                                                  |\n| selectedDateTime               |         `DateTime`         |                                                                                                             |\n| selectedDayTextStyle           |        `TextStyle`         |                                    `fontSize: 14.0, color: Colors.white`                                    |\n| selectedDayBorderColor         |          `Color`           |                                                Colors.green                                                 |\n| selectedDayButtonColor         |          `Color`           |                                                Colors.green                                                 |\n| daysHaveCircularBorder         |           `bool`           |                                                                                                             |\n| onDayPressed                   |           `Func`           |                                                                                                             |\n| weekdayTextStyle               |        `TextStyle`         |                                 `fontSize: 14.0, color: Colors.deepOrange`                                  |\n| iconColor                      |          `Color`           |                                              Colors.blueAccent                                              |\n| headerTextStyle                |        `TextStyle`         |                                    `fontSize: 20.0, color: Colors.blue`                                     |\n| headerText                     |           `Text`           |                            `Text('${DateFormat.yMMM().format(this._dates[1])}'`)                            |\n| weekendTextStyle               |        `TextStyle`         |                                 `fontSize: 14.0, color: Colors.pinkAccent`                                  |\n| markedDatesMap                 |          `Events`          |                                                   `null`                                                    |\n| markedDateWidget               |          `Widget`          | `Positioned(child: Container(color: Colors.blueAccent, height: 4.0, width: 4.0), bottom: 4.0, left: 18.0);` |\n| markedDateShowIcon             |           `bool`           |                                                    false                                                    |\n| markedDateIconBorderColor      |          `Color`           |                                                                                                             |\n| markedDateIconMaxShown         |           `int`            |                                                      2                                                      |\n| markedDateIconMargin           |          `double`          |                                                     5.0                                                     |\n| markedDateIconBuilder          | `MarkedDateIconBuilder\u003CT>` |                                                                                                             |\n| markedDateIconOffset           |          `double`          |                                                     5.0                                                     |\n| markedDateCustomShapeBorder    |       `ShapeBorder`        |                                                    null                                                     |\n| markedDateCustomTextStyle      |        `TextStyle`         |                                                    null                                                     |\n| markedDateMoreCustomDecoration |        `Decoration`        |                                                                                                             |\n| markedDateMoreCustomTextStyle  |        `TextStyle`         |                                                                                                             |\n| headerMargin                   |       `EdgetInsets`        |                                `const EdgeInsets.symmetric(vertical: 16.0)`                                 |\n| headerTitleTouchable           |           `bool`           |                                                   `false`                                                   |\n| onHeaderTitlePressed           |         `Function`         |                                       `() => _selectDateFromPicker()`                                       |\n| showHeader                     |           `bool`           |                                                                                                             |\n| showHeaderButton               |           `bool`           |                                                                                                             |\n| childAspectRatio               |          `double`          |                                                    `1.0`                                                    |\n| weekDayMargin                  |        `EdgeInsets`        |                                    `const EdgeInsets.only(bottom: 4.0)`                                     |\n| weekFormat                     |           `bool`           |                                                   `false`                                                   |\n| locale                         |          `String`          |                                                    `en`                                                     |\n| firstDayOfWeek                 |           `int`            |                                                   `null`                                                    |\n| onCalendarChanged              |    `Function(DateTime)`    |                                                                                                             |\n| minSelectedDate                |         `DateTime`         |                                                                                                             |\n| maxSelectedDate                |         `DateTime`         |                                                                                                             |\n| inactiveDaysTextStyle          |        `TextStyle`         |                                                                                                             |\n| inactiveWeekendTextStyle       |        `TextStyle`         |                                                                                                             |\n| weekDayFormat                  |      `WeekdayFormat`       |                                                   `short`                                                   |\n| staticSixWeekFormat            |           `bool`           |                                                   `false`                                                   |\n| showOnlyCurrentMonthDate       |           `bool`           |                                                   `false`                                                   |\n| dayCrossAxisAlignment          |    `CrossAxisAlignment`    |                                         `CrossAxisAlignment.center`                                         |\n| dayMainAxisAlignment           |    `MainAxisAlignment`     |                                           `CrossAlignment.center`                                           |\n| showIconBehindDayText          |           `bool`           |                                                   `false`                                                   |\n| pageScrollPhysics              |      `ScrollPhysics`       |                                               `ScrollPhysics`                                               |\n\nWith `CalendarCarousel\u003CYourEventClass>` and `EventList\u003CYourEventClass>` you can specifiy a custom Event class.\n\n## Install\n\nAdd `flutter_calendar_carousel` as a dependency in pubspec.yaml\nFor help on adding as a dependency, view the [documentation](https:\u002F\u002Fflutter.io\u002Fusing-packages\u002F).\n\n## Usage\n\n```dart\nimport 'package:flutter_calendar_carousel\u002Fflutter_calendar_carousel.dart' show CalendarCarousel;\nWidget widget() {\n  return Container(\n    margin: EdgeInsets.symmetric(horizontal: 16.0),\n    child: CalendarCarousel\u003CEvent>(\n      onDayPressed: (DateTime date, List\u003CEvent> events) {\n        this.setState(() => _currentDate = date);\n      },\n      weekendTextStyle: TextStyle(\n        color: Colors.red,\n      ),\n      thisMonthDayBorderColor: Colors.grey,\n\u002F\u002F      weekDays: null, \u002F\u002F\u002F for pass null when you do not want to render weekDays\n\u002F\u002F      headerText: Container( \u002F\u002F\u002F Example for rendering custom header\n\u002F\u002F        child: Text('Custom Header'),\n\u002F\u002F      ),\n      customDayBuilder: (   \u002F\u002F\u002F you can provide your own build function to make custom day containers\n        bool isSelectable,\n        int index,\n        bool isSelectedDay,\n        bool isToday,\n        bool isPrevMonthDay,\n        TextStyle textStyle,\n        bool isNextMonthDay,\n        bool isThisMonthDay,\n        DateTime day,\n      ) {\n          \u002F\u002F\u002F If you return null, [CalendarCarousel] will build container for current [day] with default function.\n          \u002F\u002F\u002F This way you can build custom containers for specific days only, leaving rest as default.\n\n          \u002F\u002F Example: every 15th of month, we have a flight, we can place an icon in the container like that:\n          if (day.day == 15) {\n            return Center(\n              child: Icon(Icons.local_airport),\n            );\n          } else {\n            return null;\n          }\n      },\n      weekFormat: false,\n      markedDatesMap: _markedDateMap,\n      height: 420.0,\n      selectedDateTime: _currentDate,\n      daysHaveCircularBorder: false, \u002F\u002F\u002F null for not rendering any border, true for circular border, false for rectangular border\n    ),\n  );\n}\n```\n\n### TODO\n\n- [x] Render weekdays.\n- [x] Customizable headerWidget.\n- [x] Set weekdays visibility.\n- [x] Customizable textStyles for days in weekend.\n- [x] Marked Dates.\n- [x] Multiple Marked Dates.\n- [x] Customizable weekend days.\n- [x] Week Calendar.\n- [x] Carousel Week Calendar.\n- [ ] Multiple days selections.\n- [x] Widget test.\n\n## Help Maintenance\n\nI've been maintaining quite many repos these days and burning out slowly. If you could help me cheer up, buying me a cup of coffee will make my life really happy and get much energy out of it.\n\u003Cbr\u002F>\n\u003Ca href=\"https:\u002F\u002Fwww.buymeacoffee.com\u002Fdooboolab\" target=\"_blank\">\u003Cimg src=\"https:\u002F\u002Fwww.buymeacoffee.com\u002Fassets\u002Fimg\u002Fcustom_images\u002Fpurple_img.png\" alt=\"Buy Me A Coffee\" style=\"height: auto !important;width: auto !important;\" >\u003C\u002Fa>\n[![Paypal](https:\u002F\u002Fwww.paypalobjects.com\u002Fwebstatic\u002Fmktg\u002FLogo\u002Fpp-logo-100px.png)](https:\u002F\u002Fpaypal.me\u002Fdooboolab)\n","flutter_calendar_carousel 是一个适用于 Flutter 的可水平滑动的日历组件，支持高度自定义。其核心功能包括多种样式选择（如矩形、圆形等）、日期范围选择、自定义图标事件以及标记特定日期等，通过 `customDayBuilder` 等属性提供了丰富的定制选项。该项目使用 Dart 语言编写，遵循 MIT 许可证，并且与 Flutter V3 兼容。此日历组件非常适合需要在移动应用中集成复杂日历功能的场景，比如时间管理应用、日程安排工具或是任何需要展示和操作日期信息的应用程序。","2026-06-11 03:23:21","top_language"]