'How to bind 2 ScrollViewer controls when horizontal scroll change event is raised in a ControlTemplate in Avalonia?

I'm making a custom table control. It has 2 ScrollViewers, one for the rows section and the other hidden in the columns section. They are both sitting inside a DataTemplate. I would like to scroll the columns section horizontal when the user scrolls the rows section horizontal. I tried Binding the Offset property to one another but couldn't figure out how to do it only to the X axis. Is this possible on the xaml side or does it have to happen in C#? Either way is fine, just trying to figure out how to do it.

c++sharpavaloniaui


Solution 1:[1]

Someone over at Avalonia's Github answered it. I'll share it here. I was over thinking it. You can just Bind the whole Offset object.

<StackPanel Spacing="5">
  <ScrollViewer x:Name="ScrollViewer1" HorizontalScrollBarVisibility="Visible" Height="50">
    <Border MinWidth = "2000" Background="{DynamicResource SystemAccentColor}">
    <TextBlock>This is a very very long Text in ScrollViewer 1. This is a very very long Text in ScrollViewer 1. This is a very very long Text in ScrollViewer 1. This is a very very long Text in ScrollViewer 1.  </TextBlock>
    </Border>
  </ScrollViewer>
  <ScrollViewer x:Name="ScrollViewer2" HorizontalScrollBarVisibility="Visible" Height="50"
                Offset="{Binding #ScrollViewer1.Offset, Mode=TwoWay}">
    <Border MinWidth = "2000" Background="{DynamicResource SystemAccentColorDark2}">
      <TextBlock>This is a very very long Text in ScrollViewer 2. This is a very very long Text in ScrollViewer 2. This is a very very long Text in ScrollViewer 2. This is a very very long Text in ScrollViewer 2.  </TextBlock>
    </Border>
  </ScrollViewer>
</StackPanel>

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Donny V.

Related Questions