1.0.0" Source File You can co" /> 1.0.0" Source File You can co" /> 1.0.0" Source File You can co"/>

A fully customizable calendar view acting as a date range picker

Overview

GLCalendarView

Demo

GLCalendarView

Installation

CocoaPods

With CocoaPods you can simply add GLCalendarView in your Podfile:

pod "GLCalendarView", "~> 1.0.0"

Source File

You can copy all the files under the Sources folder into your project.

Usage

  • Init the view by placing it in the storyboard or programmatically init it and add it to your view controller.
  • In viewDidLoad, set the firstDate and lastDate of the calendarView.
  • In viewWillAppear, set up the model data and call [self.calendarView reload]; to refresh the calendarView.

To display some ranges in the calendar view, construct some GLCalendarDateRange objects, set them as the model of the calendar view

NSDate *today = [NSDate date];
NSDate *beginDate = [GLDateUtils dateByAddingDays:-23 toDate:today];
NSDate *endDate = [GLDateUtils dateByAddingDays:-18 toDate:today];
GLCalendarDateRange *range = [GLCalendarDateRange rangeWithBeginDate:beginDate endDate:endDate];
range.backgroundColor = COLOR_BLUE;
range.editable = YES;
range.binding = yourModelObject // you can bind your model to the range

self.calendarView.ranges = [@[range1] mutableCopy];
[self.calendarView reload];

For the binding field, it helps in that you can bind the actual model to the range, thus you can easily retrieve the corresponding model from the range later. For example, if you are building a trip app, you probably has a Trip class, you can bind the Trip instance to the range, and if the range gets updated in the calendar view, you can easily get the Trip instance from it and do some further updates.

The calendar view will handle all the user interactions including adding, updating, or deleting a range, you just need to implement the delegate protocol to listen for those events:

@protocol GLCalendarViewDelegate <NSObject>
- (BOOL)calenderView:(GLCalendarView *)calendarView canAddRangeWithBeginDate:(NSDate *)beginDate;
- (GLCalendarDateRange *)calenderView:(GLCalendarView *)calendarView rangeToAddWithBeginDate:(NSDate *)beginDate;
- (void)calenderView:(GLCalendarView *)calendarView beginToEditRange:(GLCalendarDateRange *)range;
- (void)calenderView:(GLCalendarView *)calendarView finishEditRange:(GLCalendarDateRange *)range continueEditing:(BOOL)continueEditing;
- (BOOL)calenderView:(GLCalendarView *)calendarView canUpdateRange:(GLCalendarDateRange *)range toBeginDate:(NSDate *)beginDate endDate:(NSDate *)endDate;
- (void)calenderView:(GLCalendarView *)calendarView didUpdateRange:(GLCalendarDateRange *)range toBeginDate:(NSDate *)beginDate endDate:(NSDate *)endDate;
@end

Sample implementation:

- (BOOL)calenderView:(GLCalendarView *)calendarView canAddRangeWithBeginDate:(NSDate *)beginDate
{
    // you should check whether user can add a range with the given begin date
    return YES;
}

- (GLCalendarDateRange *)calenderView:(GLCalendarView *)calendarView rangeToAddWithBeginDate:(NSDate *)beginDate
{
    // construct a new range object and return it
    NSDate* endDate = [GLDateUtils dateByAddingDays:2 toDate:beginDate];
    GLCalendarDateRange *range = [GLCalendarDateRange rangeWithBeginDate:beginDate endDate:endDate];
    range.backgroundColor = [UIColor redColor];
    range.editable = YES;
    range.binding = yourModel // bind your model to the range instance
    return range;
}

- (void)calenderView:(GLCalendarView *)calendarView beginToEditRange:(GLCalendarDateRange *)range
{
    // save the range to a instance variable so that you can make some operation on it
    self.rangeUnderEdit = range;
}

- (void)calenderView:(GLCalendarView *)calendarView finishEditRange:(GLCalendarDateRange *)range continueEditing:(BOOL)continueEditing
{
    // retrieve the model from the range, do some updates to your model
    id yourModel = range.binding;
    self.rangeUnderEdit = nil;
}

- (BOOL)calenderView:(GLCalendarView *)calendarView canUpdateRange:(GLCalendarDateRange *)range toBeginDate:(NSDate *)beginDate endDate:(NSDate *)endDate
{
    // you should check whether the beginDate or the endDate is valid
    return YES;
}

- (void)calenderView:(GLCalendarView *)calendarView didUpdateRange:(GLCalendarDateRange *)range toBeginDate:(NSDate *)beginDate endDate:(NSDate *)endDate
{
    // update your model if necessary
    id yourModel = range.binding;
}

Appearance

GLCalendarView 's appearance is fully customizable, you can adjust its look through the appearance api(generally your should config it in the AppDelegate), check the header file to see all customizable fields:

[GLCalendarView appearance].rowHeight = 54;
[GLCalendarView appearance].padding = 6;
[GLCalendarView appearance].weekDayTitleAttributes = @{NSFontAttributeName:[UIFont systemFontOfSize:8], NSForegroundColorAttributeName:[UIColor grayColor]};
[GLCalendarView appearance].monthCoverAttributes = @{NSFontAttributeName:[UIFont systemFontOfSize:30]};

[GLCalendarDayCell appearance].dayLabelAttributes = @{NSFontAttributeName:[UIFont systemFontOfSize:20], NSForegroundColorAttributeName:UIColorFromRGB(0x555555)};
[GLCalendarDayCell appearance].monthLabelAttributes = @{NSFontAttributeName:[UIFont systemFontOfSize:8]};
    
[GLCalendarDayCell appearance].editCoverBorderWidth = 2;
[GLCalendarDayCell appearance].editCoverBorderColor = UIColorFromRGB(0x366aac);
[GLCalendarDayCell appearance].editCoverPointSize = 14;

[GLCalendarDayCell appearance].todayBackgroundColor = UIColorFromRGB(0x366aac);
[GLCalendarDayCell appearance].todayLabelAttributes = @{NSFontAttributeName:[UIFont systemFontOfSize:20]};

[GLCalendarDayCell appearance].rangeDisplayMode = RANGE_DISPLAY_MODE_CONTINUOUS;

You can clone the project and investigate the demo for more detailed usage~

Comments
  • Not showing monthCoverAttributes on scroll

    Not showing monthCoverAttributes on scroll

    I'am using GLCalendarView with Xcode 7 and Swift 2. Everything seems to be working fine, except the labels for the months that is supposed to show up when you scroll.

    I have set the monthCoverAttributes in the AppDelegate.

    GLCalendarView.appearance().monthCoverAttributes = [NSFontAttributeName: UIFont(name: "Lato-Semibold", size: 19)!, NSForegroundColorAttributeName: UIColor.blackColor()]
    

    (Doesn't work even when i don't set the monthCoverAttributes)

    Anyone facing same issue? Am I doing something wrong?

    opened by IbrahimYildirim 5
  • Make GLCalendarView respect the users locale

    Make GLCalendarView respect the users locale

    Print day and month labels according to locale, respect the users first week day and expose the view's calendar to make it configurable from the outside.

    opened by 3rdcycle 4
  • Broken constraints. Help.

    Broken constraints. Help.

    Hello, i have trouble with your view. When i set 10 ranges and set begin date to current date, constraints break.

    Please, help me as soon as possible. I have to complete this screen yesterday. 2016-04-27 10 44 25

    Console:

    2016-04-27 10 50 17

    Code to create:

    - (void)viewDidLoad {
      [super viewDidLoad];
    
      self.calendarView.delegate = self;
      self.calendarView.showMagnifier = YES;
      if (self.editItinerary) {
        NSDateComponents *components =
        [[NSCalendar currentCalendar] components:NSCalendarUnitYear |
                                                 NSCalendarUnitMonth
                                        fromDate:self.editItinerary.startDate];
        components.day = 1;
        self.calendarView.firstDate = [[NSCalendar currentCalendar] dateFromComponents:components];
      } else {
        NSDateComponents *components =
            [[NSCalendar currentCalendar] components:NSCalendarUnitYear |
                                                     NSCalendarUnitMonth
                                            fromDate:[NSDate date]];
        components.day = 1;
        self.calendarView.firstDate = [[NSCalendar currentCalendar] dateFromComponents:components];
      }
      self.calendarView.lastDate = [NSDate dateWithTimeIntervalSinceNow:60*60*24*365]; // + 1 years
      self.calendarView.rowHeight =
          (CGRectGetWidth(self.view.bounds) - self.calendarView.padding * 2 + 30) / 7;
      [GLCalendarDayCell appearance].rangeDisplayMode = RANGE_DISPLAY_MODE_CONTINUOUS;
    
      NSString *title;
      if (self.location) { // It's creating
        title = self.location.shortName;
        [self.placeImageView sd_setImageWithURL:self.location.bigImageURL];
        self.deleteButton.hidden = YES;
      } else { // It's editing already existed itinerary
        title = self.editItinerary.location.shortName;
        [self.placeImageView sd_setImageWithURL:self.editItinerary.location.bigImageURL
         placeholderImage:[UIImage imageNamed:@"ph_town_big"]];
      }
      self.title = title;
    
      for (LOMItinerary *userItinerary in self.userItineraries) {
        GLCalendarDateRange *range =
            [GLCalendarDateRange rangeWithBeginDate:userItinerary.startDate
                                            endDate:userItinerary.endDate];
        range.editable = NO;
        range.backgroundColor = [UIColor colorWithRed:233.f/255.f
                                                green:233.f/255.f
                                                 blue:233.f/255.f
                                                alpha:1.f];
        range.textColor = [UIColor whiteColor];
        [self.calendarView addRange:range];
      }
    
    }
    
    - (void)viewWillAppear:(BOOL)animated {
      [super viewWillAppear:animated];
    
      [self.calendarView reload];
      __weak LOMAddItineraryViewController *weakSelf = self;
      dispatch_async(dispatch_get_main_queue(), ^{
          // It have to be in main async block. Else it doesn't work.
          NSDate *dateToScroll;
          if (weakSelf.location) {
            dateToScroll = [NSDate date];
          } else {
            dateToScroll = weakSelf.editItinerary.startDate;
            GLCalendarDateRange *range =
            [GLCalendarDateRange rangeWithBeginDate:weakSelf.editItinerary.startDate
                                            endDate:weakSelf.editItinerary.endDate];
            range.editable = NO;
            range.backgroundColor = [UIColor colorWithRed:250.f/255.f
                                                    green:132.f/255.f
                                                     blue:132.f/255.f
                                                    alpha:1.f];
            range.textColor = [UIColor whiteColor];
            [weakSelf.calendarView addRange:range];
            weakSelf.currentRange = range;
          }
          [weakSelf.calendarView scrollToDate:dateToScroll animated:NO];
      });
    }
    
    opened by OrWest 3
  • Easier to select just one date range

    Easier to select just one date range

    I'd like the user to be able to select only one date range

    I can do this by returning NO from:

    - (BOOL)calenderView:(GLCalendarView *)calendarView canAddRangeWithBeginDate:(NSDate *)beginDate
      return NO;
    

    }

    However, it's then quite difficult for the user to select a new range to replace the old without deleting.

    What I'd ideally like to achieve, is when the user selects a date outside of the current range, the existing range is deleted, and a new range is started where they click.

    Is that possible?

    Thanks

    opened by bensebborn 2
  • Can't select date after oct 24

    Can't select date after oct 24

    Hi, I'm using your control in one of my apps, and i found that i'm not able to select a date after 24 oct 2015. there is any specific reason why or it's a bug. when i try the app show an error. any help would be appreciate

    screen shot 2015-09-22 at 11 19 43
    opened by klinkert0728 1
  • Option to disable ability to pick days in the past

    Option to disable ability to pick days in the past

    If minimum date is set to today but falls on a day other than a sunday it is still possible to pick a date in the past. Possibility to 'grey out' and/or disable selecting of past dates on show?

    opened by lukehook 1
  • Loading nib from main bundle fails

    Loading nib from main bundle fails

    Great pod! But I encountered a small problem...

    I tried to integrate your calendar view in another app (through cocoa pods) and encountered this exception:

    *** Terminating app due to uncaught exception 'NSInternalInconsistencyException', reason: 'Could not load NIB in bundle: 'NSBundle </private/var/mobile/Containers/Bundle/Application/B235DCB6-6243-4A1D-A82A-EFAD5E27E930/myapp.app> (loaded)' with name 'GLCalendarDayCell''

    This is because the .xib is loaded from the main bundle (bundle:nil) at GLCalendarView.m:81

    [self.collectionView registerNib:[UINib nibWithNibName:@"GLCalendarDayCell" bundle:nil] forCellWithReuseIdentifier:CELL_REUSE_IDENTIFIER];

    Changing this to this line instead, makes it work.

    [self.collectionView registerNib:[UINib nibWithNibName:@"GLCalendarDayCell" bundle:[NSBundle bundleForClass:self.class]] forCellWithReuseIdentifier:CELL_REUSE_IDENTIFIER];
    

    Would you be so kind as to update the pod with this fix?

    Thanks a lot!

    opened by teut 1
  • Not customizable First Day of Week

    Not customizable First Day of Week

    I'm trying to customize the first day of the week, to make it automatic. I want the first day of the week, is the system default.

    How i can do it? Thanks.

    opened by clasik 1
  • Fix timezone

    Fix timezone

    Fix a timezone issue. In normal conditions, the calendar selection are NSDate corresponding to the 00:00 of the selected date. But if the timezone is changed after the GLCalendarView is instantiated, this NSDate may corresponds to other times (e.g. 23:00 if the timezone is one hour earlier)

    opened by iuricernov 0
  • Change red colour of the first date of the month

    Change red colour of the first date of the month

    Is there a way for us to change the red colour? Currently using those dayLabelAttributes, monthLabelAttributes are not helping as it seems to be forced casts it to bright red.

    opened by amycheong19 0
  • Support for Swift 4 when?

    Support for Swift 4 when?

    Warning file:/Pods/GLCalendarView/GLCalendarView/Sources/GLCalendarView.xib: warning: Unsupported Configuration: This file is set to build for a version older than the deployment target. Functionality may be limited.

    opened by jcubero 1
  • App Crash - Could not load GLCalendarDayCell

    App Crash - Could not load GLCalendarDayCell

    Seeing a crash after installing through cocoapods v1.0.3 on iOS 10.2 simulator.

    *** Terminating app due to uncaught exception 'NSInternalInconsistencyException', reason: 'Could not load NIB in bundle: 'NSBundle </Users/....app> (loaded)' with name 'GLCalendarDayCell''

    opened by harryblam 2
Owner
Glow Inc
Glow Inc
The Unofficial Apple iOS Swift Calendar View. Swift calendar Library. iOS calendar Control. 100% Customizable

Q: How will my calendar dateCells look with this library? A: However you want them to look. More Images Features Range selection - select dates in a r

PatchTheCode 7.3k Jan 2, 2023
A declarative, performant, iOS calendar UI component that supports use cases ranging from simple date pickers all the way up to fully-featured calendar apps.

HorizonCalendar A declarative, performant, calendar UI component that supports use cases ranging from simple date pickers all the way up to fully-feat

Airbnb 2.2k Jan 4, 2023
SwiftUI Simple Calendar / Date Picker for iOS

RKCalendar RKCalendar is a SwiftUI Calendar / Date Picker for iOS. Features include: minimum and maximum calendar dates selectable, single date select

null 453 Dec 28, 2022
An easy to use SwiftUI date picker for Shamsi (Persian) calendar

ShamsiDatePicker An easy-to-use SwiftUI iOS/watchOS date picker for Shamsi (Persian) calendar. Features Pure (100%) SwiftUI implementation Full suppor

Seyyed Parsa Neshaei 20 Nov 24, 2022
iOS 7+ Calendar (Date Picker) with Infinite Scrolling.

RSDayFlow iOS 7 Calendar with Infinite Scrolling. Only need 4 lines of code to set up. RSDayFlow is a slim fork of DayFlow with updates and extensions

Ruslan Skorb 844 Sep 14, 2022
Simple customizable calendar component in Swift :calendar:

Koyomi Koyomi is a simple calendar view framework for iOS, written in Swift ?? Content Features Demo App Usage introduction : Change displayed month,

Shohei Yokoyama 741 Dec 24, 2022
A fully customizable iOS calendar library, compatible with Objective-C and Swift

Table of contents Screenshots Installation Pre-knowledge Support Contact Screenshots iPhone iPad Safe Orientation Today Extension iOS8/9 iOS10 Interac

Wenchao Ding 10.2k Jan 2, 2023
A SwiftUI calendar view that allows month switching and date picking.

Selectable Calendar View A SwiftUI calendar view that allows month switching and date picking. Usage You can simply add this repository to your projec

シュンジョーァ 10 Jul 21, 2022
Malendar is a personal calendar app that connects to your default calendar and lets you add/delete events

Malendar is a personal calendar app that connects to your default calendar and lets you add/delete events. It will gather events from your default iOS calendar.

Chase 194 Jan 4, 2023
A Swift UI component for Lunar Calendar Picker

LunarYearDatePicker a Swift UI component for Lunar Calendar Picker Usage: struct

null 6 Nov 22, 2022
A customizable calendar view for iOS.

JTCalendar JTCalendar is an easily customizable calendar control for iOS. Installation With CocoaPods, add this line to your Podfile. pod 'JTCalendar'

Jonathan Vukovich-Tribouharet 2.8k Dec 27, 2022
A customizable swiftui calendar

Description not available. Installation From Xcode 11, you can use Swift Package Manager to add Kingfisher to your project. Select File > Swift Packag

Heshan Yodagama 140 Dec 24, 2022
A calendar quick view for the MacOS status bar

Calendar Quick View Quick Menu Calendar in the mac app store An open source macOS calendar preview utility Download from the Mac App Store Visualizati

Michaellis 18 Oct 26, 2022
Calendar View - It's lightweight and simple control with supporting Locale and CalendarIdentifier.

iOS Calendar It's lightweight and simple control with supporting Locale and CalendarIdentifier. There're samples for iPhone and iPad, and also with us

Maksym Bilan 159 Dec 22, 2022
📅 Calendar for iOS, iPadOS and macOS in Swift

CalendarKit CalendarKit is a Swift calendar UI library for iOS, iPadOS and Mac Catalyst. It looks similar to the Apple Calendar app out-of-the-box, wh

Richard Topchii 2.2k Jan 5, 2023
An Easy to Use Calendar for iOS (Swift 5.0)

This is an easy to use, "just drag and drop it in your code" type of calendar for iOS. It supports both vertical and horizontal scrolling, as well as

Michael Michailidis 525 Dec 23, 2022
The elegant full screen calendar missed in SwiftUI.

ElegantCalendar ElegantCalendar is an efficient and customizable full screen calendar written in SwiftUI. ElegantTimeline - Shows what's possible usin

Kevin Li 553 Dec 27, 2022
SwiftUICalendar - SwiftUI simple calendar

SwiftUICalendar Installation CocoaPods pod 'SwiftUICalendar' import import SwiftUICalendar Features Infinite scroll Support horizontal and vertical sc

null 59 Dec 27, 2022
Dead simple calendar implementation

Package provides a CalendarView which can be used to display simple calendar in your App.

Sergei Kononov 4 Oct 7, 2022