Custom calender View

问题

I want to develop custom calendarView for my app. i think i can make it by use of UICollectionView like this:

i tried this simple thing:

func numberOfSections(in collectionView: UICollectionView) -> Int {
    return 5 //for number of weeks
}

func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
    return 7 //for number of days in week
}

func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
    let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "AvailabilityCollectionViewCell", for: indexPath) as! AvailabilityCollectionViewCell
    cell.lblDate.text = "\(indexPath.row)"
    cell.layer.borderColor = UIColor.black.cgColor
    cell.layer.borderWidth = 0.5
    return cell
}

func collectionView(_ collectionView: UICollectionView,
                    layout collectionViewLayout: UICollectionViewLayout,
                    minimumInteritemSpacingForSectionAt section: Int) -> CGFloat{

    return 0.0
}

func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {

    return CGSize(width: collectionView.frame.size.width / 7.0, height: collectionView.frame.size.height / 5)
}

by this i get simple Collection View like this:

Now i want to know how can i arrange week days as per Calendar and what kind of datasource required for this...

Thanks..

回答1:

Variables:

var weeks = 0
var items = [[Date]]()
lazy var dateFormatter: DateFormatter = {
    let formatter  = DateFormatter()
    formatter.dateFormat = "yyyy-MM-dd"
    return formatter
}()

Function for set calendar :

    func setCalendar() {
        let cal = Calendar.current
        let components = (cal as NSCalendar).components([.month, .day,.weekday,.year], from: date)
        let year =  components.year
        let month = components.month
        let months = dateFormatter.monthSymbols
        let monthSymbol = (months![month!-1])
        lblMonth.text = "\(monthSymbol) \(year!)"

        let weekRange = (cal as NSCalendar).range(of: .weekOfMonth, in: .month, for: date)
        let dateRange = (cal as NSCalendar).range(of: .day, in: .month, for: date)
        weeks = weekRange.length
        totalDaysInMonth = dateRange.length

        let totalMonthList = weeks * 7
        var dates = [Date]()
        var firstDate = dateFormatter.date(from: "\(year!)-\(month!)-1")!
        let componentsFromFirstDate = (cal as NSCalendar).components([.month, .day,.weekday,.year], from: firstDate)
        firstDate = (cal as NSCalendar).date(byAdding: [.day], value: -(componentsFromFirstDate.weekday!-1), to: firstDate, options: [])!

        for _ in 1 ... totalMonthList {
            dates.append(firstDate)
            firstDate = (cal as NSCalendar).date(byAdding: [.day], value: +1, to: firstDate, options: [])!
        }
        let maxCol = 7
        let maxRow = weeks
        items.removeAll(keepingCapacity: false)
        var i = 0
//        print("-----------\(monthSymbol) \(year!)------------")
        for _ in 0..<maxRow {
            var colItems = [Date]()
            for _ in 0..<maxCol {
                colItems.append(dates[i])
                i += 1
            }
//            print(colItems)
            items.append(colItems)
        }
//        print("---------------------------")
    }  

Delegates Functions :

extension AvailabilityCalenderViewController: UICollectionViewDelegate, UICollectionViewDataSource, UICollectionViewDelegateFlowLayout {

func numberOfSections(in collectionView: UICollectionView) -> Int {
    return weeks
}

func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
    return 7
}

func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
    let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "calendarCell", for: indexPath) as! calendarCell
    cell.layer.borderColor = UIColor.black.cgColor
    cell.layer.borderWidth = 0.5
    cell.configureCell(date: items[indexPath.section][indexPath.row])
    return cell
}

func collectionView(_ collectionView: UICollectionView,
                    layout collectionViewLayout: UICollectionViewLayout,
                    minimumInteritemSpacingForSectionAt section: Int) -> CGFloat{
    return 0.0
}

func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
    return CGSize(width: collectionView.frame.size.width / 7.0, height: collectionView.frame.size.height / 5)
}
}

Custom Collection View Cell :

    class calendarCell: UICollectionViewCell {

    var date: Date!

    @IBOutlet weak var lblDate: UILabel!

    func configureCell(date: Date){
        self.strDate = date
        let cal = Calendar.current
        let components = (cal as NSCalendar).components([.day], from: date)
        let day = components.day!

        self.lblDate.text = "\(String(describing: day))"  
    }    
}

Result :

来源：https://stackoverflow.com/questions/49751354/custom-calender-view