We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

Calendar view not updating when view param is changed via setstate

Issue where if the view is changed after initial load via setstate, the calendar widget does not redraw.

Have checked and confirmed that the state is truely updating on the parent widget.

During the build cycle (rebuild after state update) parameter view is being updated, however the calendar view remains unchanged.

Below is a screenshot set at breakpoint parameter view confirming that the state has changed but the rendered calendar view does not update from the initial view (in this case timelineday).

Following docs at: https://www.syncfusion.com/kb/10944/how-to-switch-between-views-of-the-event-calendar-sfcalendar-in-flutter



10 Replies 1 reply marked as answer

IR Indumathi Ravichandran Syncfusion Team November 2, 2020 09:12 AM UTC

Hi Dom, 
 
Thank you for contacting Syncfusion support. 
 
Based on the provided information, we have checked the mentioned issue “Calendar view not updating using Setstate”. view property of the SfCalendar used to set the initial view of the calendar. For dynamic view changes we have implemented the view property on the CalendarController. Kindly use that property from controller for dynamic view changes. Please find the code snippet for dynamic view switching. 
 
Code snippet: 
 
CalendarController _controller;  
 
  @override 
  void initState() { 
    _controller = CalendarController(); 
    super.initState(); 
  } 
 
@override 
Widget build(BuildContext context) { 
  return MaterialApp( 
      home: Scaffold( 
          body: Center( 
    child: SafeArea( 
      child: Column( 
        children: [ 
          Container( 
            height: 550, 
            child: SfCalendar( 
              view: CalendarView.day, 
              controller: _controller, 
            ), 
          ), 
          RaisedButton( 
            onPressed: () => _controller.view = CalendarView.week, 
            child: Text('Change the view'), 
          ), 
        ], 
      ), 
    ), 
  ))); 
} 
 
Also please find the breaking changes from the following changelog link. 
 
 
Also, you can use the allowedViews property of the calendar for view navigation. Please find the UG from the following link. 
 
 
We hope that this helps you. Please let us know if you need further assistance. 
 
Regards, 
Indumathi R 



SG Samir Gozalov February 26, 2021 05:15 PM UTC

I had same issue and Thanks to Indumathi fixed by this guidance, however, for some reason I can't figure out yet, it changes view from mont to day, changes initial display DATE, but does'nt pick the proper dayTIME, and takes me to proper day, but to somewhere around 3:45 at night. anything i forgot about? Below code example of my case. Thanks

return SfCalendar(
controller: controller,
view: CalendarView.week,

dataSource: AppointmentProfDailyWeeklyBuilderLogic(appointments),
allowViewNavigation: true,
//initialDisplayDate: controller.displayDate,
//initialSelectedDate: controller.displayDate,
minDate: DateTime.now().roundDown(delta: Duration(minutes: 5)),
maxDate: DateTime.now().add(Duration(days: 365)),
firstDayOfWeek: DateTime.now().weekday,
showNavigationArrow: true,
onTap: (CalendarTapDetails details) {
setState(() {

controller.view = CalendarView.day ;
controller.displayDate = details.date ;
controller.selectedDate = details.date ;}
onLongPress: (CalendarLongPressDetails details) {
somemethod;
},
timeSlotViewSettings: TimeSlotViewSettings(

timeInterval: Duration 1 hour,
timeFormat: 'H:mm',

),
specialRegions: regions,
timeRegionBuilder:
(BuildContext context, TimeRegionDetails timeRegionDetails) {
return Container(.....


IR Indumathi Ravichandran Syncfusion Team March 1, 2021 11:34 AM UTC

Hi Samir, 
 
Thank you for the update. 
 
Based on the provided information, we have checked the mentioned issue “Unable to pick proper day time in the Flutter calendar” and it is working fine as expected. We have ensured with the shared code snippet, the calendar moves to the selected date and display the proper date and time. We have prepared the simple sample for showing selected date details in alert window. Please find the sample and video from the following link. 
 
 
If possible, can you please check the sample and let us know if you still facing the same issue? If not, please modify the sample based on your scenario and revert us back with more details. 
 
Regards, 
Indumathi R 



EL Ergi Lamce June 28, 2021 11:05 AM UTC

Hello,

 i want to catch controller.view when allowed view is changed from view.month to view.timlinemonth ,but on tap method is not including changing allowed view .
Can anyone help me?

Scaffold(
body: SfCalendar(
headerHeight: 60,
showNavigationArrow: true,
viewNavigationMode: ViewNavigationMode.snap,
headerStyle: const CalendarHeaderStyle(
textAlign: TextAlign.center,
backgroundColor: Color(0xff015176),
textStyle: TextStyle(color: Colors.black,
fontWeight: FontWeight.bold,
fontSize: 20)
),
view: CalendarView.month,
allowedViews: [
CalendarView.day,
CalendarView.week,
CalendarView.month,
CalendarView.timelineMonth
],
viewHeaderHeight: 60,
viewHeaderStyle: ViewHeaderStyle(backgroundColor: Colors.grey,
dayTextStyle: TextStyle(color: Colors.white, fontSize: 15)),
backgroundColor: _calendarColor,
controller: _controller,
initialDisplayDate: DateTime.now(),
todayHighlightColor: Colors.black,
monthViewSettings: MonthViewSettings(showAgenda: true),
timeSlotViewSettings:
TimeSlotViewSettings(timelineAppointmentHeight: 100),
dataSource: MeetingDataSource(_getDataSource()),
appointmentBuilder: appointmentBuilder,
onTap: calendarTapped,
)
void calendarTapped(CalendarTapDetails details) {
if(_controller.view==Month){
isScheduler=false;}else{
isScheduler=true;}
}


IR Indumathi Ravichandran Syncfusion Team June 29, 2021 07:34 AM UTC

Hi Ergi, 
 
Thank you for the update. 
 
Regarding Query: i want to catch controller.view when allowed view is changed from view.month to view.timlinemonth ,but on tap method is not including changing allowed view . 
 
Based on the shared information, we have checked and your requirement is “Getting the calendar view while tapping allowed views”. As per the calendar implementation, by tapping any cells of the calendar, you can get the view from controller. But you can’t get the calendar view from the onTap callback of the calendar through allowed views. Kindly use the onViewChanged callback for achieving your requirement. We have attached the code snippet for the same. 
 
Code snippet: 
body: SfCalendar(
  view: CalendarView.
month,
  controller:
_controller,
  dataSource: _getCalendarDataSource(),
  allowedViews: [CalendarView.
month,CalendarView.timelineMonth,CalendarView.timelineWeek],
  onViewChanged: viewChanged,
)
 
 
void viewChanged(ViewChangedDetails viewChangedDetails)
{
 
if(_controller.view==CalendarView.month)
  {
   
// To do your requirement here.
 
}
 
else
   
{
     
// To do your requirement here.
   
}
}
 
 
We hope that this helps you. Please let us know if you need further assistance. 
 
Regards, 
Indumathi R 


Marked as answer

GR Greg replied to Indumathi Ravichandran January 11, 2022 08:18 PM UTC

Wow, it took forever to find this answer. Can you please update your documentation for others that the Calendar Controller "view" property is not updated when using "allowed views"? Or fit that? That was a frustrating one.

Thanks!

Greg



IR Indumathi Ravichandran Syncfusion Team January 12, 2022 10:33 AM UTC

Hi Greg, 
 
Thank you for the update. We will consider and update the UG documentation as per your requirement. We will let you know once the UG published. We appreciate your patience until then. 
 
Regards, 
Indumathi R 



KA Kashif Asghar August 1, 2022 11:28 AM UTC

Hi Syncfusion Team,

I'm facing an issue in the calendar widget by Syncfusion (Flutter) for the past 2 days. I have tried every workaround but nothing works for me.

Problem: i want to display an appointment indicator when an appointment gets selected for specific dates. I m able to show appointment in the bottom pop up  widget in schdeule view. i want to show the indicator for the same appointment in parent month view widget. 

My task (popup) widget get updated everytime and it works fine but its parent sf calendar month view doesnt get updated to show appointment indicator.


i have attached the screenshots zip file cuz  i can't attach png file for some reason


Attachment: ss_698effaa.zip


KA Kashif Asghar replied to Kashif Asghar August 1, 2022 12:29 PM UTC

nevermind got the issue solved by calling the provider in main.dart



IR Indumathi Ravichandran Syncfusion Team August 2, 2022 05:21 AM UTC

Hi Kashif,


We are glad that your issue is resolved. Please let us know if you need any other assistance. We will be happy to assist you. 


Regards,

Indumathi R


Loader.
Live Chat Icon For mobile
Up arrow icon