feat: Fixes issue #412: ✨ Add support for RTL directionality

Author: Shubham Jitiya

CHANGELOG.md

@@ -2,6 +2,7 @@
 
 - Adds clear method to `EventController`.
 - Adds `onEventTapDetails`, `onEventDoubleTapDetails` & `onEventLongTapDetails` gesture recognizers to get tap details. [#390](https://github.com/SimformSolutionsPvtLtd/flutter_calendar_view/issues/390)
+- Adds support of directionality. [#412](https://github.com/SimformSolutionsPvtLtd/flutter_calendar_view/issues/412)
 
 # [1.4.0 - 7 Jan 2025](https://github.com/SimformSolutionsPvtLtd/flutter_calendar_view/tree/1.4.0)
 

README.md

@@ -357,9 +357,30 @@ WeekView(
   ],
 );
 ```
-
 Above code will create `WeekView` with only five days, from monday to friday.
 
+### Support for RTL
+Wrap your widget with `Directionality` widget and use `textDirection` to give RTL or LTR direction.
+
+```dart
+Directionality(
+  textDirection: TextDirection.rtl,
+  child: ResponsiveWidget(
+    webWidget: WebHomePage(
+      selectedView: CalendarView.week,
+    ),
+    mobileWidget: Scaffold(
+      floatingActionButton: FloatingActionButton(
+        child: Icon(Icons.add),
+        elevation: 8,
+        onPressed: () => context.pushRoute(CreateEventPage()),
+      ),
+      body: WeekViewWidget(),
+    ),
+  ),
+);
+```
+
 ## Main Contributors
 
 <table>

example/lib/constants.dart

@@ -6,6 +6,7 @@ class AppConstants {
   AppConstants._();
 
   static final List<String> weekTitles = ['M', 'T', 'W', 'T', 'F', 'S', 'S'];
+  static final ltr = '\u202A'; // Use this to force text direction to LTR
 
   static OutlineInputBorder inputBorder = OutlineInputBorder(
     borderRadius: BorderRadius.circular(7),

example/lib/pages/create_event_page.dart

@@ -6,50 +6,60 @@ import '../extension.dart';
 import '../widgets/add_event_form.dart';
 
 class CreateEventPage extends StatelessWidget {
-  const CreateEventPage({super.key, this.event});
+  const CreateEventPage({
+    super.key,
+    this.event,
+    this.directionality = TextDirection.ltr,
+  });
 
   final CalendarEventData? event;
+  final TextDirection directionality;
 
   @override
   Widget build(BuildContext context) {
-    return Scaffold(
-      appBar: AppBar(
-        elevation: 0,
-        backgroundColor: Theme.of(context).scaffoldBackgroundColor,
-        centerTitle: false,
-        leading: IconButton(
-          onPressed: context.pop,
-          icon: Icon(
-            Icons.arrow_back,
-            color: AppColors.black,
+    return Directionality(
+      textDirection: directionality,
+      child: Scaffold(
+        appBar: AppBar(
+          elevation: 0,
+          backgroundColor: Theme.of(context).scaffoldBackgroundColor,
+          centerTitle: false,
+          leading: IconButton(
+            onPressed: context.pop,
+            icon: Icon(
+              Icons.arrow_back,
+              color: AppColors.black,
+            ),
           ),
-        ),
-        title: Text(
-          event == null ? "Create New Event" : "Update Event",
-          style: TextStyle(
-            color: AppColors.black,
-            fontSize: 20.0,
-            fontWeight: FontWeight.bold,
+          title: Text(
+            event == null ? "Create New Event" : "Update Event",
+            style: TextStyle(
+              color: AppColors.black,
+              fontSize: 20.0,
+              fontWeight: FontWeight.bold,
+            ),
           ),
         ),
-      ),
-      body: SingleChildScrollView(
-        physics: ClampingScrollPhysics(),
-        child: Padding(
-          padding: EdgeInsets.all(20.0),
-          child: AddOrEditEventForm(
-            onEventAdd: (newEvent) {
-              if (this.event != null) {
-                CalendarControllerProvider.of(context)
-                    .controller
-                    .update(this.event!, newEvent);
-              } else {
-                CalendarControllerProvider.of(context).controller.add(newEvent);
-              }
+        body: SingleChildScrollView(
+          physics: ClampingScrollPhysics(),
+          child: Padding(
+            padding: EdgeInsets.all(20.0),
+            child: AddOrEditEventForm(
+              onEventAdd: (newEvent) {
+                if (this.event != null) {
+                  CalendarControllerProvider.of(context)
+                      .controller
+                      .update(this.event!, newEvent);
+                } else {
+                  CalendarControllerProvider.of(context)
+                      .controller
+                      .add(newEvent);
+                }
 
-              context.pop(true);
-            },
-            event: event,
+                context.pop(true);
+              },
+              event: event,
+            ),
           ),
         ),
       ),

example/lib/pages/day_view_page.dart

@@ -8,7 +8,12 @@ import 'create_event_page.dart';
 import 'web/web_home_page.dart';
 
 class DayViewPageDemo extends StatefulWidget {
-  const DayViewPageDemo({super.key});
+  const DayViewPageDemo({
+    super.key,
+    this.directionality = TextDirection.ltr,
+  });
+
+  final TextDirection directionality;
 
   @override
   _DayViewPageDemoState createState() => _DayViewPageDemoState();
@@ -17,17 +22,24 @@ class DayViewPageDemo extends StatefulWidget {
 class _DayViewPageDemoState extends State<DayViewPageDemo> {
   @override
   Widget build(BuildContext context) {
-    return ResponsiveWidget(
-      webWidget: WebHomePage(
-        selectedView: CalendarView.day,
-      ),
-      mobileWidget: Scaffold(
-        floatingActionButton: FloatingActionButton(
-          child: Icon(Icons.add),
-          elevation: 8,
-          onPressed: () => context.pushRoute(CreateEventPage()),
+    return Directionality(
+      textDirection: widget.directionality,
+      child: ResponsiveWidget(
+        webWidget: WebHomePage(
+          selectedView: CalendarView.day,
+        ),
+        mobileWidget: Scaffold(
+          floatingActionButton: FloatingActionButton(
+            child: Icon(Icons.add),
+            elevation: 8,
+            onPressed: () => context.pushRoute(
+              CreateEventPage(
+                directionality: widget.directionality,
+              ),
+            ),
+          ),
+          body: DayViewWidget(),
         ),
-        body: DayViewWidget(),
       ),
     );
   }