Flutter How to make two SFCalendars of type day that are on the same screen scroll simultaneously?

So i got two different SFCalendars on my screen, and i want it to behave like this: when i scroll one of them, the other scrolls at the same exact time. Also i want to remove the scrollbar on the left of each. Here is my code snippet:

<pre><code>
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:linkin_pro/pages/schedule/schedule_controller.dart';
import 'package:linkin_pro/pages/schedule/schedule_widgets/date_widget.dart';
import 'package:linkin_pro/text_widgets/lato_regular_dark.dart';
import 'package:syncfusion_flutter_calendar/calendar.dart';

class ScheduleView extends GetView<ScheduleController> {
  const ScheduleView({super.key});

  @override
  Widget build(BuildContext context) {
    Get.put(ScheduleController());
    return GetBuilder<ScheduleController>(builder: (controller) {
      return Scaffold(
          body: Column(
        children: [
          Padding(
            padding: const EdgeInsets.only(top: 60, left: 16, right: 16),
            child: Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                const Row(
                  children: [
                    DateWidget(),
                    SizedBox(
                      width: 5,
                    ),
                    Icon(
                      Icons.expand_more,
                      color: Color(0xFF23B768),
                    )
                  ],
                ),
                Container(
                  height: 26,
                  width: 43,
                  decoration: BoxDecoration(
                      color: const Color(0xFFE5E4FF),
                      borderRadius: BorderRadius.circular(4.0)),
                  child: Center(
                    child: latoRegularDark("All", 13),
                  ),
                )
              ],
            ),
          ),
          Expanded(
            child: Row(
              children: [
                Expanded(
                  child: SfCalendar(
                    headerHeight: 0,
                    viewHeaderHeight: 0,
                    viewNavigationMode: ViewNavigationMode.none,
                    view: CalendarView.day,
                    firstDayOfWeek: 1,
                    timeSlotViewSettings: const TimeSlotViewSettings(
                      timeRulerSize: 58,
                      timeTextStyle: TextStyle(
                        fontFamily: "Montserrat",
                        fontSize: 13,
                        fontWeight: FontWeight.w400,
                        color: Color(0xFF212236),
                      ),
                      startHour: 7,
                      endHour: 20,
                      timeFormat: 'hh:mm\na',
                      timeIntervalHeight: 100,
                    ),
                  ),
                ),
                Expanded(
                  child: SfCalendar(
                    headerHeight: 0,
                    viewHeaderHeight: 0,
                    viewNavigationMode: ViewNavigationMode.none,
                    view: CalendarView.day,
                    firstDayOfWeek: 1,
                    timeSlotViewSettings: const TimeSlotViewSettings(
                      timeRulerSize: 58,
                      timeTextStyle: TextStyle(
                        fontFamily: "Montserrat",
                        fontSize: 13,
                        fontWeight: FontWeight.w400,
                        color: Color(0xFF212236),
                      ),
                      startHour: 7,
                      endHour: 20,
                      timeFormat: 'hh:mm\na',
                      timeIntervalHeight: 100,
                    ),
                  ),
                ),
              ],
            ),
          )
        ],
      ));
    });
  }
}
</code></pre>

I tried different solutions that included adding controllers and listen onViewChanged to change both controllers, but that did not help. Then I tried to put two calendars inside SingleChildScrollView, but it did not help too, calendars kept on scrolling each on its own

Upvotes: 0

Views: 74

Answers (0)

Related Questions