LineChart Scroll RTL support

YChartsLib/src/main/java/co/yml/charts/chartcontainer/container/ScrollableCanvasContainer.kt

@@ -56,7 +56,8 @@ fun ScrollableCanvasContainer(
     isPinchZoomEnabled: Boolean = true,
     onScroll: () -> Unit = {},
     onZoomInAndOut: () -> Unit = {},
-    scrollOrientation: Orientation = Orientation.Horizontal
+    scrollOrientation: Orientation = Orientation.Horizontal,
+    scrollDirection: LayoutDirection = LayoutDirection.Ltr
 ) {
     val scrollOffset = remember { mutableStateOf(0f) }
     val maxScrollOffset = remember { mutableStateOf(0f) }
@@ -89,7 +90,10 @@ fun ScrollableCanvasContainer(
                 }
                 .background(containerBackgroundColor)
                 .scrollable(
-                    state = scrollState, scrollOrientation, enabled = true
+                    state = scrollState,
+                    orientation = scrollOrientation,
+                    enabled = true,
+                    reverseDirection = (scrollDirection == LayoutDirection.Rtl)
                 )
                 .pointerInput(Unit) {
                     detectTapGestures(onTap = {
@@ -107,13 +111,29 @@ fun ScrollableCanvasContainer(
                 },
                 onDraw = {
                     maxScrollOffset.value = calculateMaxDistance(xZoom.value)
-                    onDraw(scrollOffset.value, xZoom.value)
+                    val currentValue = getScrollValue(scrollOffset.value, maxScrollOffset.value, scrollDirection)
+                    onDraw(currentValue, xZoom.value)
                 })
-            drawXAndYAxis(scrollOffset.value, xZoom.value)
+            val currentValue = getScrollValue(scrollOffset.value, maxScrollOffset.value, scrollDirection)
+            drawXAndYAxis(currentValue, xZoom.value)
         }
     }
 }
 
+/**
+ * Return the current scrollOffset considering the layoutDirection for draw functions
+ * @param currentScrollOffset: Current scroll offset.
+ * @param maxScrollOffset: Maximum scroll offset.
+ */
+fun getScrollValue(currentScrollOffset: Float, maxScrollOffset: Float, layoutDirection: LayoutDirection): Float {
+    val adjustedOffset = if (layoutDirection == LayoutDirection.Ltr)
+        currentScrollOffset
+    else
+        maxScrollOffset - currentScrollOffset
+
+    return checkAndGetMaxScrollOffset(adjustedOffset, maxScrollOffset)
+}
+
 /**
  * Returns the scroll state within the start and computed max scrollOffset & filters invalid scroll states.
  * @param currentScrollOffset: Current scroll offset when user trying to scroll the canvas.

YChartsLib/src/main/java/co/yml/charts/ui/linechart/LineChart.kt

@@ -239,7 +239,9 @@ fun LineChart(modifier: Modifier, lineChartData: LineChartData) {
                 onZoomInAndOut = {
                     isTapped = false
                     selectionTextVisibility = false
-                })
+                },
+                scrollDirection = scrollDirection
+            )
             if (isTalkBackEnabled) {
                     AccessibilityBottomSheetDialog(
                         modifier = Modifier.fillMaxSize(),

YChartsLib/src/main/java/co/yml/charts/ui/linechart/model/LineChartData.kt

@@ -2,6 +2,7 @@ package co.yml.charts.ui.linechart.model
 
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.unit.Dp
+import androidx.compose.ui.unit.LayoutDirection
 import androidx.compose.ui.unit.dp
 import co.yml.charts.axis.AxisData
 import co.yml.charts.common.model.AccessibilityConfig
@@ -34,7 +35,8 @@ data class LineChartData(
     val containerPaddingEnd: Dp = 15.dp,
     val backgroundColor: Color = Color.White,
     val gridLines: GridLines? = null,
-    val accessibilityConfig: AccessibilityConfig = AccessibilityConfig()
+    val accessibilityConfig: AccessibilityConfig = AccessibilityConfig(),
+    val scrollDirection: LayoutDirection = LayoutDirection.Ltr
 )
 
 /**

app/src/main/java/co/yml/ycharts/app/presentation/LineChartActivity.kt

@@ -18,6 +18,7 @@ import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.graphics.drawscope.Stroke
 import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.text.font.FontWeight
+import androidx.compose.ui.unit.LayoutDirection
 import androidx.compose.ui.unit.dp
 import co.yml.charts.axis.AxisData
 import co.yml.charts.common.components.Legends
@@ -263,7 +264,8 @@ private fun StraightLinechart(pointsData: List<Point>) {
             )
         ),
         xAxisData = xAxisData,
-        yAxisData = yAxisData
+        yAxisData = yAxisData,
+        scrollDirection = LayoutDirection.Rtl
     )
     LineChart(
         modifier = Modifier

app/src/main/res/values/strings.xml

@@ -13,7 +13,7 @@
     <string name="title_donut_chart">Donut Chart</string>
     <string name="title_bar_with_line_chart">Combined Chart</string>
     <string name="linechart_default_style">Single Line chart with default style and grid</string>
-    <string name="linechart_straight_line_style">Single Linechart with Straight-Line style</string>
+    <string name="linechart_straight_line_style">Single Linechart with Straight-Line style (RTL)</string>
     <string name="linechart_dotted_style"> Dotted Single Linechart with gradient background</string>
     <string name="linechart_multiple_tones">Multicolor line-chart</string>
     <string name="combined_line_chart">Linechart with combination Multiple lines with different styles</string>