Calendar

FUICalendarView control extends UIView and provides APIs to add calendar functionality in your app with minimal effort. There are four variations of FUICalendarView based on how the data is displayed.

MonthView

This is the default view with vertical scrolling enabled. It shows the dates for one entire month at a time, where upon a scrolling action, the previous or next month is displayed on the screen based on the scroll direction. The dates for the month are arranged in 7 columns (with a view above denoting the corresponding weekdays) spanning a maximum of five or six rows, based on order of the first day of the week shown in the view displayed above and the total number of days in the month. The first day of the week can be set to either sunday, monday or saturday while instantiating the calendar. In addition to showing the dates for the particular month, some dates from the previous month and the next month are also displayed, but appear in a greyed out font color to differentiate them from the current month dates. The previous month dates are displayed in beginning of the first row and the next month dates appear on the last row. For example, if the month starts on a wednesday and the weekday display view shows day of week starting from sunday, then in the very first row of the month being displayed, the previous month dates are shown from sunday to tuesday. If the month ends on a friday, then the remaining dates in that row (for saturday and sunday) denote the dates of the next month. The first date of every month is automatically selected when the month is displayed. When the user clicks on another date, then that date appears selected. Only one date can be selected at any time.

WeekView

This view shows a single row of dates on the screen with 7 columns, one for each day of the week. This view incorporates horizontal scrolling, where the user can scroll left or right, displaying the set of dates for the particular week being displayed. In this mode, the previous month dates are displayed only for the very first month in the entire calendar range. The first date of every month is automatically selected and if the user chooses another date, then that date appears selected. In addition, when the user scrolls, in the next set of 7 dates shown after the scroll, the date corresponding to the day of the week of the previously selected date appears automatically selected. For example, if the user selects date 22 of the month and it falls on a wednesday, then after a forward scroll, date 29 is selected since it will be the next Wednesday.

ExpandableView

This view is a combination of monthview and week view. The user can toggle between the two modes using a handle which animates the transition between the modes.

MultipleSelectionView

This view displays the dates similar the monthview, but takes the entire screen space. Hence dates for more than one month can be displayed at a time. Also, this is the only view where multiple dates can be selected at the same time.

The FUICalendar can be instantiated to display in any one of the above display modes. In addition, the developer can specify the start and end dates of the entire calendar range and the displayDateAtStartup startup. If the start, end and display dates are nil, ie. the user does not supply any values for those parameters, then the calendar is instantiated with a two year range from Jan 1st of the current year to Dec 31st of the next year and the display date on start up is set to the current date. The user can also choose to provide only the start date, end date or display date. If the start and end dates are provided, then set up the range accordingly. If no display date is provided in this case and if the current date falls inbetween this provided range, then the calendar shows the current date on startup, else the start date is displayed on startup. If only the display date is provided, then the range is from Jan 1st of the year of the displayDate to Dec 31st of next year.

// Sample view controller implementing the FUICalendarView control

class CalendarMonthViewController: UIViewController, FUICalendarViewDelegate {

var calendarView = FUICalendarView() // initializes in the default month mode and shows the current date on startup

override func viewDidLoad() {
   super.viewDidLoad()

   self.viewRespectsSystemMinimumLayoutMargins = false
   self.view.backgroundColor = .white
   self.view.addSubview(calendarView )
   calendarView .delegate = self

   calendarView.translatesAutoresizingMaskIntoConstraints = false
   calendarView.topAnchor.constraint(equalTo: self.view.topAnchor, constant: 0).isActive = true
   calendarView.leadingAnchor.constraint(equalTo: self.view.leadingAnchor, constant: 0).isActive = true
   calendarView.trailingAnchor.constraint(equalTo: self.view.trailingAnchor, constant: 0).isActive = true

}

override func viewDidAppear(_ animated: Bool) {
   super.viewDidAppear(animated)
}

// Implement the FUICalendarViewDelegate methods

// Called after a scrolling action
func  calendarView(_ calendarView: FUICalendarView, didChangeVisibleDates visibleDates: FUIVisibleDates)
{

}

// Called when a cell ( displaying the date) is selected.
func calendarView(_ calendarView: FUICalendarView, didSelectCell: FUICalendarItemCollectionViewCell, at: Date)
{

}

// Called when a cell ( displaying the date) is deselected.
func calendarView(_ calendarView: FUICalendarView, didDeselectCell: FUICalendarItemCollectionViewCell, at: Date)
{

}

// Called before a cell ( displaying the date) is displayed.
func calendar(_ calendarView: FUICalendarView, willDisplay cell: FUICalendarItemCollectionViewCell, forItemAt date: Date, indexPath: IndexPath) {

}

// Implement this method to set the title of the controller.
// This method is called whenever there is a change in the status , for example. upon each scroll, the title is updated to the current month being displayed. When a
// date is selected, then the title is updated to denote the corresponding month.
func  calendarView(_ calendarView: FUICalendarView, didChangeTitleTo title: String) {
   self.navigationItem.title = title
}

}

Attention

The delegate object with type FUICalendarViewDelegate is declared as a weak reference. So on deallocation it will be automatically set to nil. To keep it alive as expected, developer should retain the delegate object during its whole execution scope.

See more

open class FUICalendarView : FUIBaseDrawingView

The enum denoting FUICalendarStyle.

See more

public enum FUICalendarStyle

The enum denoting FUIWeekStartDay.

See more

public enum FUIWeekStartDay

The FUIVisibleDates structure denoting the visible dates on the screen.

See more

public struct FUIVisibleDates

This protocol provides methods for handling actions based on the FUICalendarView State.

See more

public protocol FUICalendarViewDelegate : AnyObject

The FUICalendarFloorplanViewController provides a controller with a built in tableView and an FUIcalendarView intialized in monthView style. Instantiate a controller of type FUICalendarFloorplanViewController and set the calendarView and tableView delegates to access the methods.

 // Example showing usage of FUICalendarFloorplanViewController

class CalendarFloorplanTest: FUICalendarFloorplanViewController, FUICalendarViewDelegate, UITableViewDataSource , UITableViewDelegate {

    override func viewDidLoad() {
        super.viewDidLoad()

        self.calendarView.delegate = self
        self.tableView.delegate = self

        self.tableView.estimatedRowHeight = 60
        #if swift(>=4.2)
            self.tableView.rowHeight = UITableView.automaticDimension
        #else
            self.tableView.rowHeight = UITableViewAutomaticDimension
        #endif

        tableView.register(FUITimelineCell.self, forCellReuseIdentifier: FUITimelineCell.reuseIdentifier)
    }

    //MARK: UITableViewDataSource Methods
    func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return 2
    }

    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {

        let cell = self.tableView.dequeueReusableCell(withIdentifier: FUITimelineCell.reuseIdentifier, for: indexPath) as! FUITimelineCell
        cell.headlineLabel.text =  "Event Details"
        return cell
    }


    // MARK: FUICalendarViewDelegate Methods
    func  calendarView(_ calendarView: FUICalendarView, didChangeTitleTo title: String) {
        self.navigationItem.title = title
    }

    func  calendarView(_ calendarView: FUICalendarView,  didChangeVisibleDatesTo visibleDates: FUIVisibleDates) {
    }

    func calendarView(_ calendarView: FUICalendarView, didSelectDate date:Date, cell: FUICalendarItemCollectionViewCell) {

    }

    func calendarView(_ calendarView: FUICalendarView, didDeselectDate date:Date, cell: FUICalendarItemCollectionViewCell) {

    }

    func calendar(_ calendarView: FUICalendarView, willDisplay cell: FUICalendarItemCollectionViewCell, forItemAt date: Date, indexPath: IndexPath) {

    }
}

See more

open class FUICalendarFloorplanViewController : FUIBaseDrawingViewController<FUICalendarFloorplanView>

UICollectionViewCell subclass for FUICalendarView

Usage

// Example usage in FUICalendarViewDelegate
func  calendarView(_ calendarView: FUICalendarView, didDeselectDate date:Date, cell:FUICalendarItemCollectionViewCell ) {

   cell._innerView.eventView.isHidden = true

}

public class FUICalendarItemCollectionViewCell : FUIBaseDrawingCalendarItemCollectionViewCell<FUICalendarItemView>