How to navigate to the previous or next views using navigation arrows in the Flutter Calendar

1 min read

In the Flutter Event Calendar, you can navigate to the previous or next views without swiping by using the property of the showNavigationArrow property in the calendar.

The position of the navigation arrows is determined by the textAlign, property in the headerStyle.

import 'package:flutter/material.dart';
import 'package:syncfusion_flutter_calendar/calendar.dart';
 
void main() => runApp(NavigationArrow());
 
class NavigationArrow extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
        debugShowCheckedModeBanner: false,
        home: Scaffold(
            body: SafeArea(
                child: SfCalendar(
          view: CalendarView.day,
          showNavigationArrow: true,
          headerStyle: CalendarHeaderStyle(textAlign: TextAlign.center),
        ))));
  }
}

View the GitHub sample here

Center

center