Skip to content

Invert the chart direction with RTL languages - #403

Merged
delia-cheminot merged 15 commits into
devfrom
rtl-chart
Oct 6, 2026
Merged

delia-cheminot merged 15 commits into
devfrom
rtl-chart

Conversation

@delia-cheminot

@delia-cheminot delia-cheminot commented Oct 1, 2026 •

Copy link
Copy Markdown
Collaborator

Description

When the UI is set to a RTL language (Urdu), the chart time should go from right to left. This inverts all data when in RTL, as well as the graph ui (chart axis, current level info, side of the page for bar charts).

new helper : chart_mirror.dart

Main chart :

  • the x range, the level and blood-test spots, and the "now" line are mirrored
  • the y-axis labels move from the left side to the right side in RTL
  • the date labels rotate the other way
  • the "now" label is aligned bottom-left and wrapped in RTL characters
  • paddings use EdgeInsetsDirectional (start/end) instead of left/right
  • the pan gesture is inverted, so a drag moves in the correct direction

Baby charts :

  • mirrors its spots + now indicator
  • the now label now uses a directional FractionallySizedBox

Bar charts :

  • buildBarGroups reverses the bar order
  • the blood test bar chart aligns to the end in RTL, its labels rotate the other way, and its tooltips use the context text direction

Boy scout : add demo mode as a secret setting for an easier dev experience.

Dependency

m3e_core on my fork to fix the connected buttons (ends rounded on the wrong side in LTR)

Type of change

  • Bug fix (non-breaking change which fixes an issue)

Screenshots:

simulator_screenshot_632F6693-8D1A-4A85-A139-12C08CF8E429 simulator_screenshot_33EA4FF5-7F7A-487F-9760-E19DD1299C21 simulator_screenshot_A71FAA02-DA2F-4FF1-B279-BEE30F8EA479

@github-actions

github-actions Bot commented Oct 1, 2026 •

Copy link
Copy Markdown

Line-change breakdown

Category Files Added Deleted Net
Generated 1 9 8 +1
i18n 0 0 0 +0
Test 0 0 0 +0
Code 14 872 109 +763
Total 15 881 117 +764

@delia-cheminot delia-cheminot linked an issue Oct 1, 2026 that may be closed by this pull request
@delia-cheminot
delia-cheminot marked this pull request as ready for review October 5, 2026 21:55
@delia-cheminot delia-cheminot changed the title Invert the chart direction with LTR languages Invert the chart direction with RTL languages Oct 6, 2026
@delia-cheminot
delia-cheminot merged commit 599ad32 into dev Oct 6, 2026
10 checks passed
@delia-cheminot
delia-cheminot deleted the rtl-chart branch October 6, 2026 21:18
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Graph is left-to-right in Urdu

1 participant