diff --git a/YChartsLib/src/main/java/co/yml/charts/chartcontainer/container/ScrollableCanvasContainer.kt b/YChartsLib/src/main/java/co/yml/charts/chartcontainer/container/ScrollableCanvasContainer.kt index 023026eb..e9e6e4fb 100644 --- a/YChartsLib/src/main/java/co/yml/charts/chartcontainer/container/ScrollableCanvasContainer.kt +++ b/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. diff --git a/YChartsLib/src/main/java/co/yml/charts/ui/linechart/LineChart.kt b/YChartsLib/src/main/java/co/yml/charts/ui/linechart/LineChart.kt index b7230d10..cd84beae 100644 --- a/YChartsLib/src/main/java/co/yml/charts/ui/linechart/LineChart.kt +++ b/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(), diff --git a/YChartsLib/src/main/java/co/yml/charts/ui/linechart/model/LineChartData.kt b/YChartsLib/src/main/java/co/yml/charts/ui/linechart/model/LineChartData.kt index 54087912..aa73662b 100644 --- a/YChartsLib/src/main/java/co/yml/charts/ui/linechart/model/LineChartData.kt +++ b/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 ) /** diff --git a/app/src/main/java/co/yml/ycharts/app/presentation/LineChartActivity.kt b/app/src/main/java/co/yml/ycharts/app/presentation/LineChartActivity.kt index 9870e532..86ce76e7 100644 --- a/app/src/main/java/co/yml/ycharts/app/presentation/LineChartActivity.kt +++ b/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) { ) ), xAxisData = xAxisData, - yAxisData = yAxisData + yAxisData = yAxisData, + scrollDirection = LayoutDirection.Rtl ) LineChart( modifier = Modifier diff --git a/app/src/main/res/values/strings.xml b/app/src/main/res/values/strings.xml index 3188105f..6e8134bf 100644 --- a/app/src/main/res/values/strings.xml +++ b/app/src/main/res/values/strings.xml @@ -13,7 +13,7 @@ Donut Chart Combined Chart Single Line chart with default style and grid - Single Linechart with Straight-Line style + Single Linechart with Straight-Line style (RTL) Dotted Single Linechart with gradient background Multicolor line-chart Linechart with combination Multiple lines with different styles