基於Swift的iOS應用程序開發：第三方日曆組件CVCalendar簡介

今天在網上看到一個比較簡單好用的日曆組件，重要的是它是基於swift的。

官方地址在這裏：CVCalendar

其實官方開發人員在產品的首頁上已經把如何使用寫得非常清楚了。而我在使用過程中，也參考了一個國內的博主：

http://blog.csdn.net/mo_xiao_mo/article/details/53991496

這位博主也整理得十分清楚。

一、準備工作

1、首先從官方團隊的GitHub首頁上將項目下載下來：

2、將工程文件CVCalendar.xcodeproj直接拖動到工程當中去：

3、在xcode中的左側項目結構目錄中，選中你的工程名稱，在中部切換到General視圖，然後找到“Embeded Binaries”項，在該項中添加“CVCalendar.framework”：

二、代碼實現

1、首先導入組件：

import CVCalendar

2、繼承兩個代理：

 - CVCalendarDelegate

 - CVCalendarMenuViewDelegate

class CVCalendarViewController: UIViewController{
    //...
}

extension CVCalendarViewController: CVCalendarViewDelegate,CVCalendarMenuViewDelegate {
    //...
}

3、定義兩個UIView，分別用來顯示日曆上方的菜單欄（用以顯示週一到週日）以及日曆本身：

var viewCalendarMenu: CVCalendarMenuView!
    
var viewCalendar: CVCalendarView!

4、初始化這兩個UIView：

/*
 *  初始化日曆菜單
 */
self.viewCalendarMenu = CVCalendarMenuView(frame: CGRect(x:0,y:60, width:300, height:135))
    
/*
 *  初始化日曆
 */
self.viewCalendar = CVCalendarView(frame: CGRect(x:0, y:143, width:300, height:450))

5、爲這兩個UIView註冊代理：

/*
 *  爲日曆菜單註冊代理
 */
self.viewCalendarMenu.menuViewDelegate = self
        
/*
 *  爲日曆註冊代理
 */
self.viewCalendar.calendarDelegate = self

6、將日曆組件放置到界面上：

/*
 *  將日曆組件放在界面上
 */
self.view.addSubview(self.viewCalendarMenu)
self.view.addSubview(self.viewCalendar)

7、最關鍵的一步，你需要重寫以下這個方法，用來刷新日曆組件，否則日曆無法顯示在界面上：

override func viewDidLayoutSubviews() {
    super.viewDidLayoutSubviews()
    self.viewCalendarMenu.commitMenuViewUpdate()
    self.viewCalendar.commitCalendarViewUpdate()
}

到此爲止，其實已經能夠運行程序並且看到日曆的樣子了：

我把上面這些步驟封裝在了一個方法中，這樣只需要在viewDidLoad中調用這個方法就可以了：

var viewCalendarMenu: CVCalendarMenuView!
    
var viewCalendar: CVCalendarView!
    
override func viewDidLoad() {
    super.viewDidLoad()

    /*
     *  初始化日曆組件
     */
    self.initCalendar()
}

/**
 *  初始化日曆組件
 */
func initCalendar()->Void{
    /*
     *  在頁面頂端顯示當前的日期
     */
    let currentCalendar:Calendar = Calendar.init(identifier: .gregorian)
    self.title = CVDate(date: Date(), calendar: currentCalendar).globalDescription
    
    /*
     *  初始化日曆菜單
     */
    self.viewCalendarMenu = CVCalendarMenuView(frame: CGRect(x:0,y:60, width:300, height:135))
    
    /*
     *  初始化日曆
     */
    self.viewCalendar = CVCalendarView(frame: CGRect(x:0, y:143, width:300, height:450))
        
    /*
     *  爲日曆菜單註冊代理
     */
    self.viewCalendarMenu.menuViewDelegate = self
        
    /*
     *  爲日曆註冊代理
     */
    self.viewCalendar.calendarDelegate = self
        
    /*
     *  將日曆組件放在界面上
     */
    self.view.addSubview(self.viewCalendarMenu)
    self.view.addSubview(self.viewCalendar)
}

三、擴展

其實這個第三方組件還提供了一些比較方便好用的高級擴展，關於這一點也可以查看官方團隊給出的說明：

點擊這裏查看官方高階api
1、設置一週的第一天

func firstWeekday() -> Weekday {
    return .Sunday
}

2、跳轉月份

在這個擴展例子中，官方寫了兩個方法

第一個方法用來直接返回當月：

@IBAction func todayMonthView() {
    self.calendarView.toggleCurrentDayView()
}

第二個方法用來直接跳到一個指定月份，注意入參並不是直接表示月份數，而是表示希望跳轉到的月份與當月之間相差多少個月：

func toggleMonthViewWithMonthOffset(offset: Int) {
    let calendar = NSCalendar.currentCalendar()
    let calendarManager = CVCalendarManager.sharedManager
    let components = calendarManager.componentsForDate(NSDate()) // from today
        
    components.month += offset
    components.day = 1 // CVCalendar will select this day view
        
    let resultDate = calendar.dateFromComponents(components)!
        
    self.calendarView.toggleMonthViewWithDate(resultDate)
}

3、往前或往後一個月：

self.calendarView.loadNextMonthView()

self.calendarView.loadPreviousMonthView()

4、顯示不屬於當前月份的日期：

self.viewCalendar!.changeDaysOutShowingState(shouldShow: true) 

5、動態切換日曆的顯示模式：

切換爲周曆

calendarView.changeMode(.WeekView)

切換爲月曆

calendarView.changeMode(.MonthView)

而在上文所提到的那位國內博主的文章中，也整理了一些比較有用的擴展，因爲他整理得非常好，所以就直接轉過來：

extension CVCalendarViewController: CVCalendarViewDelegate,CVCalendarMenuViewDelegate {
    //視圖模式
    func presentationMode() -> CalendarMode {
        //使用月視圖
        return .monthView
    }
    
    //每週的第一天
    func firstWeekday() -> Weekday {
        //從星期一開始
        return .monday
    }
    
    func presentedDateUpdated(_ date: CVDate) {
        //導航欄顯示當前日曆的年月
        self.title = date.globalDescription
    }
    
    //每個日期上面是否添加橫線(連在一起就形成每行的分隔線)
    func topMarker(shouldDisplayOnDayView dayView: CVCalendarDayView) -> Bool {
        return true
    }
    
    //切換月的時候日曆是否自動選擇某一天（本月爲今天，其它月爲第一天）
    func shouldAutoSelectDayOnMonthChange() -> Bool {
        return false
    }
    
    //日期選擇響應
    func didSelectDayView(_ dayView: CVCalendarDayView, animationDidFinish: Bool) {
        //獲取日期
        let date = dayView.date.convertedDate()!
        // 創建一個日期格式器
        let dformatter = DateFormatter()
        dformatter.dateFormat = "yyyy年MM月dd日"
        let message = "當前選擇的日期是：\(dformatter.string(from: date))"
        //將選擇的日期彈出顯示
        let alertController = UIAlertController(title: "", message: message,preferredStyle: .alert)
        let okAction = UIAlertAction(title: "確定", style: .cancel, handler: nil)
        alertController.addAction(okAction)
        self.present(alertController, animated: true, completion: nil)
    }
}