MilkBottle
MilkBottle

Reputation: 4332

How to change Month View to Week View vice versa for JTAppleCalendar

Hi newBiew in JTAppleCalendar. I follow this link for JTAppleCalendar.
https://www.youtube.com/watch?v=CQNotydm58s&index=6&list=PLpqJf39XekqyUG7dxcqGO0JNprryysv9Q

I have this Problem:

How to I show calendar when user click a button to change monthView to WeekView or from week View to month View

How to I change the calendar size programmatically for CalendarView and mainStack as they have constrains?
I believe I need to handle configureCalendar as below but how to change programmatically month view to week view vice versa.
I have a stack (Call it mainStack) which used to contain CalendarView

Layout for the Calendar view :

@IBOutlet weak var CalendarView : JTAppleCalendarView!<br/>
@IBOutlet weak var mainStack: UIStackView!<br/>


extension MyCalendar: JTAppleCalendarViewDataSource, JTAppleCalendarViewDelegate {

    func configureCalendar( _ calendar:JTAppleCalendarView) -> ConfigurationParameters {

        formatter.dateFormat = "yyyy MM dd"
        formatter.timeZone = Calendar.current.timeZone
        formatter.locale = Calendar.current.locale

        let startDate = formatter.date(from: "2017 01 01")!
        let endDate = formatter.date(from: "2027 12 31")!        

        //-- how to set these "

       1) Full calendar view

        let parameters = ConfigurationParameters(startDate : startDate, endDate: endDate)          
        return parameters


       2) for week view
        let parameters = ConfigurationParameters(startDate : startDate, endDate: endDate, numberOfRows:1)      

        return parameters

    }


  func calendar( _ calendar: JTAppleCalendarView, cellForItemAt date: Date, cellState: CellState, indexPath: IndexPath) -> JTAppleCell{


        let cell = calendar.dequeueReusableJTAppleCell(withReuseIdentifier: "CustomCell", for: indexPath) as! CustomCell

        cell.dateLabel.text = cellState.text

        configureCell(cell:cell, cellState: cellState)

        return cell

    }


    //------------ selected item

    func calendar( _ calendar: JTAppleCalendarView, didSelectDate date: Date, cell:JTAppleCell?, cellState:CellState){

        configureCell(cell: cell, cellState: cellState)     

    }


    func calendar( _ calendar: JTAppleCalendarView, didDeselectDate date: Date, cell:JTAppleCell?, cellState:CellState){

              configureCell(cell: cell, cellState: cellState)

    }

   func calendar(_ calendar: JTAppleCalendarView, didScrollToDateSegmentWith visibleDates: DateSegmentInfo) {

       setupCalendarView(dateSegment: visibleDates)

    }

}

Please help.

Thanks

Upvotes: 2

Views: 1902

Answers (2)

Just a coder
Just a coder

Reputation: 16730

The tutorial here states just how to do this.

I cannot paste the whole thing here since the instructions are long. Also, at the bottom of the page is the complete code in a zip file that you can play around with.

Upvotes: 0

Vitya Shurapov
Vitya Shurapov

Reputation: 2308

So the plan is:

You have a variable for the number of rows.

In a monthView mode, it has 6 rows.

In a weekView mode, it has 1 row.

So when you want to change the mode you change numberOfRows and reload calendarView and scroll to the current date.

Also when you have weekView, you should use a little bit different ConfigurationParameters.

That's how I do this:

@IBAction func monthWeekModeChanged(_ sender: UISegmentedControl) {
    if sender.selectedSegmentIndex == 0 {
        numberOfRows = 6
    } else {
        numberOfRows = 1
    }
    calendarView.reloadData()
    calendarView.scrollToDate(Date(), animateScroll: false)
}

    var numberOfRows = 6


extension CalendarViewController: JTAppleCalendarViewDataSource {

func configureCalendar(_ calendar: JTAppleCalendarView) -> ConfigurationParameters {

    let startDate = viewModel.formatter.date(from: "01-Jan-2019")
    let endDate = viewModel.formatter.date(from: "31-Dec-2020")

    if numberOfRows == 6 {
                return ConfigurationParameters(startDate: startDate!, endDate: endDate!, numberOfRows: numberOfRows, firstDayOfWeek: .monday)
    } else {
        return ConfigurationParameters(startDate: startDate!,
                                                 endDate: endDate!,
                                                 numberOfRows: 1,
                                                 generateInDates: .forFirstMonthOnly,
                                                 generateOutDates: .off, firstDayOfWeek: .monday,
                                                 hasStrictBoundaries: false)
    }
}

}

Upvotes: 0

Related Questions