swift – Tips on how to create calendar like iOS Health App with FSCalendar

Spread the love

I am a brand new programer and I’m attempting to make use of FSCalendar to create a calendar like iOS Health App.

Like this:

enter image description here

however I do not know find out how to.

enter image description here

Now I attempt to .scope = .week.

In cell I exploit self.titleLabel.isHidden = true to cover date.

import UIKit
import FSCalendar
import MKRingProgressView

class ViewController: UIViewController, FSCalendarDataSource, FSCalendarDelegate {

    fileprivate weak var calendar: FSCalendar!
    override func viewDidLoad() {
        let screenWidth = self.view.bounds.width
        let calendarView = FSCalendar(body: CGRect(x: 0, y: 60, width: screenWidth, peak: 300))
        calendarView.dataSource = self
        calendarView.delegate = self
        calendarView.register(CustomCalendarCell.self, forCellReuseIdentifier: "CustomCalendarCell")
        calendarView.locale = .init(identifier: "zh-tw")
        calendarView.look.caseOptions = .weekdayUsesSingleUpperCase
        calendarView.scope = .week
        calendarView.firstWeekday = 2
        calendarView.weekdayHeight = 40
        calendarView.look.headerTitleFont = UIFont.systemFont(ofSize: 0) // Conceal the title
        calendarView.headerHeight = 0
    func calendar(_ calendar: FSCalendar, cellFor date: Date, at monthPosition: FSCalendarMonthPosition) -> FSCalendarCell {
        // Return customized cells for seen dates
        let cell = calendar.dequeueReusableCell(withIdentifier: "CustomCalendarCell", for: date, at: monthPosition) as! CustomCalendarCell
        configureCustomView(cell.customView, for: date)
        return cell

    func configureCustomView(_ customView: RingProgressView, for date: Date) {
        if date > Date() {
            customView.layer.opacity = 0.2
        } else {
            customView.layer.opacity = 1

However I do not know find out how to choose weekdayLabels and make in the present day’s
weekdayLabel coloration change to make it like Health App.

Leave a Reply

Your email address will not be published. Required fields are marked *