This is a migrated thread and some comments may be shown as answers.

how to Sync two GridViewScrollViewer

9 Answers 292 Views
GridView
This is a migrated thread and some comments may be shown as answers.
Dario Concilio
Top achievements
Rank 2
Dario Concilio asked on 15 Nov 2016, 10:10 AM

Hi to all,

I would to "sync" two GridView, my goal is allow the user to compare two lists, when he moves by scrollbar, both lists are moved in the same way.

Does anyone have any idea?

9 Answers, 1 is accepted

Sort by
0
Dario Concilio
Top achievements
Rank 2
answered on 15 Nov 2016, 02:24 PM

I found old post, but it refers to old version. If I try to use this code with actually version, how can I modify this one?

private void Grid_Loaded(object sender, RoutedEventArgs e)
        {
            var verticalScrollBar1 = (ScrollBar) this.Griglia1RadGridView.GetChildByName("PART_VerticalScrollBar");
            var horizontalScrollBar1 = (ScrollBar) this.Griglia1RadGridView.GetChildByName("PART_HorizontalScrollBar");
            var verticalScrollBar2 = (ScrollBar) this.Griglia2RadGridView.GetChildByName("PART_VerticalScrollBar");
            var horizontalScrollBar2 = (ScrollBar) this.Griglia2RadGridView.GetChildByName("PART_HorizontalScrollBar");
 
            verticalScrollBar1.ValueChanged += new RoutedPropertyChangedEventHandler<double>(verticalScrollBar1_ValueChanged);
            horizontalScrollBar1.ValueChanged += new RoutedPropertyChangedEventHandler<double>(horizontalScrollBar1_ValueChanged);
            verticalScrollBar2.ValueChanged += new RoutedPropertyChangedEventHandler<double>(verticalScrollBar2_ValueChanged);
            horizontalScrollBar2.ValueChanged += new RoutedPropertyChangedEventHandler<double>(horizontalScrollBar2_ValueChanged);
        }
 
        void horizontalScrollBar1_ValueChanged(object sender, RoutedPropertyChangedEventArgs<double> e)
        {
            this.Griglia2RadGridView.ScrollViewer SetHorizontalOffset(e.NewValue);
        }
 
        void verticalScrollBar1_ValueChanged(object sender, RoutedPropertyChangedEventArgs<double> e)
        {
            this.Griglia2RadGridView.ItemsControl.VirtualizingPanel.SetVerticalOffset(e.NewValue);
        }
 
        void horizontalScrollBar2_ValueChanged(object sender, RoutedPropertyChangedEventArgs<double> e)
        {
            this.Griglia1RadGridView.ItemsControl.VirtualizingPanel.SetHorizontalOffset(e.NewValue);
        }
 
        void verticalScrollBar2_ValueChanged(object sender, RoutedPropertyChangedEventArgs<double> e)
        {
            this.Griglia1RadGridView.ItemsControl.VirtualizingPanel.SetVerticalOffset(e.NewValue);
        }
0
Stefan Nenchev
Telerik team
answered on 16 Nov 2016, 10:42 AM
Hello Dario,

I have attached a sample project for you that shows how to achieve the desired behavior. 

Regards,
Stefan Nenchev
Telerik by Progress
Do you need help with upgrading your WPF project? Try the Telerik API Analyzer and share your thoughts!
0
Dario Concilio
Top achievements
Rank 2
answered on 16 Nov 2016, 11:28 AM

I tryed your solution and works, but I I add you code in my project, ScrollChanged not fire.

ScrollViewer firstGridBar;
        ScrollViewer secondGridBar;
 
        private void Griglia1RadGridView_Loaded(object sender, RoutedEventArgs e)
        {
            firstGridBar = (sender as RadGridView).ChildrenOfType<ScrollViewer>().FirstOrDefault();
            firstGridBar.ScrollChanged += FirstGridBar_ScrollChanged;
        }
 
        private void Griglia2RadGridView_Loaded(object sender, RoutedEventArgs e)
        {
            secondGridBar = (sender as RadGridView).ChildrenOfType<ScrollViewer>().FirstOrDefault();
            secondGridBar.ScrollChanged += SecondGridBar_ScrollChanged;
        }
 
        private void FirstGridBar_ScrollChanged(object sender, ScrollChangedEventArgs e)
        {
            secondGridBar.ScrollToVerticalOffset(e.VerticalOffset);
            secondGridBar.ScrollToHorizontalOffset(e.HorizontalOffset);
        }
 
        private void SecondGridBar_ScrollChanged(object sender, ScrollChangedEventArgs e)
        {
            firstGridBar.ScrollToVerticalOffset(e.VerticalOffset);
            firstGridBar.ScrollToHorizontalOffset(e.HorizontalOffset);
        }
0
Dario Concilio
Top achievements
Rank 2
answered on 16 Nov 2016, 11:28 AM
I'm using Office2013 Theme
0
Dario Concilio
Top achievements
Rank 2
answered on 16 Nov 2016, 11:29 AM
Ehm, I'm using Framework 4.0
0
Stefan Nenchev
Telerik team
answered on 18 Nov 2016, 10:45 AM
Hi Dario,

I tested the behavior with .NET framework 4.0 and the Office2013 theme and it is working fine at my end. I have attached a sample for your reference. Would it be possible to raise a ticket with a sample project that shows the undesired behavior so I can have a more detailed look?

Regards,
Stefan Nenchev
Telerik by Progress
Telerik UI for WPF is ready for Visual Studio 2017 RC! Learn more.
0
Dario Concilio
Top achievements
Rank 2
answered on 18 Nov 2016, 11:03 AM

Thank you, I found the reason, I'm using ShowSearchPanel="True" that disable firing (or I don't konw.....) ScrollChange event.

This one is know, how can use this "link" between two grdiview and use SearchPanel?

0
Accepted
Stefan Nenchev
Telerik team
answered on 21 Nov 2016, 01:14 PM
Hi Dario,

When you enable the SearchPanel, an additional ScrollViewer appears. With this in mind, when subscribing to the ScrollChanged event of the ScrollViewer, you need to make sure that the correct element is targeted. You can apply the following change:

private void clubsGrid_Loaded(object sender, RoutedEventArgs e)
        {
            firstGridBar = (sender as RadGridView).ChildrenOfType<ScrollViewer>().Where(x => x.Name == "PART_ItemsScrollViewer").FirstOrDefault();
            firstGridBar.ScrollChanged += FirstGridBar_ScrollChanged;
        }
 
        private void clubsGrid2_Loaded(object sender, RoutedEventArgs e)
        {
            secondGridBar = (sender as RadGridView).ChildrenOfType<ScrollViewer>().Where(x => x.Name == "PART_ItemsScrollViewer").LastOrDefault();
            secondGridBar.ScrollChanged += SecondGridBar_ScrollChanged;
        }

Regards,
Stefan Nenchev
Telerik by Progress
Telerik UI for WPF is ready for Visual Studio 2017 RC! Learn more.
0
Dario Concilio
Top achievements
Rank 2
answered on 21 Nov 2016, 03:01 PM
Perfect! Thank you Stefan!
Tags
GridView
Asked by
Dario Concilio
Top achievements
Rank 2
Answers by
Dario Concilio
Top achievements
Rank 2
Stefan Nenchev
Telerik team
Share this question
or