Skip to content

ScrollView with RTL FlowDirection and Horizontal Orientation scrolls in the wrong direction on iOS #32271

@devanathan-vaithiyanathan

Description

Description

When a ScrollView is set to RightToLeft (RTL) flow direction and its Orientation is Horizontal, the scrolling behavior is reversed on iOS.
Instead of scrolling in the correct RTL direction, the content moves in the opposite direction.

Steps to Reproduce

1.Add the below code in MainPage.xaml.cs

public partial class MainPage : ContentPage
{
    private readonly ScrollViewViewModel _viewModel;

    public MainPage()
    {
        InitializeComponent();

        _viewModel = new ScrollViewViewModel();
        BindingContext = _viewModel;

        // Create Grid (same as XAML structure)
        var grid = new Grid
        {
            RowDefinitions =
            {
                new RowDefinition { Height = GridLength.Star },
                new RowDefinition { Height = GridLength.Auto }
            }
        };

        // Create ContentView and bind its Content
        var scrollViewContent = new ContentView
        {
            AutomationId = "ScrollViewContent"
        };
        scrollViewContent.SetBinding(ContentView.ContentProperty, nameof(ScrollViewViewModel.Content));

        // Create ScrollView and bind its Orientation
        var scrollView = new ScrollView
        {
            Content = scrollViewContent,
			FlowDirection = FlowDirection.RightToLeft,
			Orientation = ScrollOrientation.Horizontal
        };
        scrollView.SetBinding(ScrollView.OrientationProperty, nameof(ScrollViewViewModel.Orientation));

        // Add ScrollView to Grid row 0
        grid.Add(scrollView);
        Grid.SetRow(scrollView, 0);

        // Create Button
        var button = new Button
        {
            Text = "Toggle Orientation"
        };
        button.Clicked += Button_Clicked;

        // Add Button to Grid row 1
        grid.Add(button);
        Grid.SetRow(button, 1);

        // Set grid as the page content
        Content = grid;
    }

    void Button_Clicked(object? sender, EventArgs e)
    {
        if (_viewModel.Orientation == ScrollOrientation.Vertical)
            _viewModel.Orientation = ScrollOrientation.Horizontal;
        else
            _viewModel.Orientation = ScrollOrientation.Vertical;
    }
}


public class ScrollViewViewModel : INotifyPropertyChanged
{
	private string _contentText;
	private ScrollOrientation _orientation = ScrollOrientation.Vertical;

	public ScrollOrientation Orientation
	{
		get => _orientation;
		set
		{
			if (_orientation != value)
			{
				_orientation = value;
				OnPropertyChanged();
			}
		}
	}

	private View? _content;

	public ScrollViewViewModel()
	{
		_contentText = string.Empty;
		Content = new Label
		{
			Text = string.Join(Environment.NewLine, Enumerable.Range(1, 100).Select(i => $"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed euismod, urna eu tincidunt consectetur, nisi nisl aliquam enim, eget facilisis enim nisl nec elit . Sed euismod, urna eu tincidunt consectetur, nisi nisl aliquam enim Eget facilisis enim nisl nec elit Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae. Nullam ac erat at dui laoreet aliquet. Praesent euismod, justo at dictum facilisis, urna erat dictum enim. {i}")),
			FontSize = 18,
			Padding = 10
		};
	}

	public string ContentText
	{
		get => _contentText;
		set
		{
			if (_contentText != value)
			{
				_contentText = value;
				Content = new Label { Text = _contentText }; // Update Content when ContentText changes
				OnPropertyChanged();
			}
		}
	}

	public View? Content
	{
		get => _content;
		set
		{
			if (_content != value)
			{
				_content = value;
				OnPropertyChanged();
			}
		}
	}
	public event PropertyChangedEventHandler? PropertyChanged;

	protected void OnPropertyChanged([CallerMemberName] string propertyName = "") =>
		PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
}

2.Press the Toggle Orientation button.
3. Scroll from Right to Left but scroll working in opposite direction.

Expected behavior:
When FlowDirection="RightToLeft", the scroll should move in the RTL direction — i.e., dragging from right to left should reveal content on the right side

Actual behavior:
On iOS, the scroll direction is reversed cause able to scroll in empty space.

Screen.Recording.2025-10-29.at.6.44.29.PM.mov

Link to public reproduction project repository

No response

Version with bug

9.0.110 SR12

Is this a regression from previous behavior?

No, this is something new

Last version that worked well

Unknown/Other

Affected platforms

iOS

Affected platform versions

No response

Did you find any workaround?

No response

Relevant log output

Metadata

Metadata

Assignees

No one assigned

    Labels

    area-controls-scrollviewScrollViewpartner/syncfusionIssues / PR's with Syncfusion collaborationplatform/ioss/triagedIssue has been revieweds/verifiedVerified / Reproducible Issue ready for Engineering Triaget/bugSomething isn't working

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions