如何同步两个ScrollViewer?

齿轮

我有四个方面。他们三个滚动。我必须同步他们的动作,因此,如果用户移动了AreaA(仅限水平),则AreaC会模仿该动作。如果用户移动区域C,则区域A模仿水平区域,区域B模仿垂直区域。

由于某些区域可以移至其他区域,因此我看不到使用单个ScrollView的方法:

  • C在“ A”下方垂直移动
  • C在B下方水平移动
  • B在固定区域下方垂直移动
  • A在固定区域下“水平”移动

4个领域

请注意,我正在针对WinRT运行时开发Windows Phone 8.1应用程序(如果它是当前名称,则不是Silverlight。)。

关于尺寸:

  • areaA和areaC具有相同的宽度
  • areaB和areaC具有相同的高度

到目前为止,我所要做的就是通过订阅ViewChanging事件,NextView从事件arg读取偏移值并调用ScrollTo[Vertical,Horizontal]Offset适当的其他滚动条来使其同步正如我所说的它的工作原理莫名其妙,但他们口吃颇有几分。另外,我还没有找到一种方法来模仿“到达的滚动视图的末尾,因此内容现在会稍微向上/向下压缩”的效果。

//adding event handler
areaCScroller.ViewChanging += HandleAreaCScrolls;

//handler
void HandleAreaCScrolls(object sender, ScrollViewerViewChangingEventArgs e)
{
    areaAScroller.ScrollToHorizontalOffset(e.NewView.HorizontalOffset);
    areaBScroller.ScrollToVerticalOffset(e.NewView.VerticalOffset);
}

我还尝试了FinalView值(导致StackOverFlowExceptions),并禁用了滚动条的惯性(这没有帮助,但使它们感觉不太“酷”)。

所以我的问题是:我怎样才能更好地做到这一点?

我对WPF / XAML并不完全有经验,因此我可能会完全忽略(或Google foo较低)可以满足我需要的控件或功能。打开所有建议(尽管布局本身已被锁定)。例如在这里这里这里看过但是它们都和我尝试过的一样。

北极熊

我使用了ScrollViewer中的ViewChanged。一切对我来说都很好。这是MainPage.xaml.cs中的代码:

protected override void OnNavigatedTo(NavigationEventArgs e)
    {
        var list = new List<int>();
        for (int i = 0; i < 100; ++i)
        {
            list.Add(i);
        }

        ItemsControl1.ItemsSource = list;
        ItemsControl2.ItemsSource = list;
    }

    private void ScrollViewer1_OnViewChanged(object sender, ScrollViewerViewChangedEventArgs e)
    {
        if (ScrollViewer1.VerticalOffset != ScrollViewer2.VerticalOffset)
        {
            ScrollViewer2.ScrollToVerticalOffset(ScrollViewer1.VerticalOffset);
        }
    }

    private void ScrollViewer2_OnViewChanged(object sender, ScrollViewerViewChangedEventArgs e)
    {
        if (ScrollViewer1.VerticalOffset != ScrollViewer2.VerticalOffset)
        {
            ScrollViewer1.ScrollToVerticalOffset(ScrollViewer2.VerticalOffset);
        }
    }

还有MainPage.xaml的XAML代码

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="50"/>
        <ColumnDefinition Width="*"/>
    </Grid.ColumnDefinitions>
    <ScrollViewer Grid.Column="0"
                  x:Name="ScrollViewer1"
                  ViewChanged="ScrollViewer1_OnViewChanged">
        <ItemsControl x:Name="ItemsControl1">
            <ItemsControl.ItemTemplate>
                <DataTemplate>
                    <TextBlock Text="{Binding}"/>
                </DataTemplate>
            </ItemsControl.ItemTemplate>
        </ItemsControl>
    </ScrollViewer>
    <ScrollViewer Grid.Column="2"
                  x:Name="ScrollViewer2"
                  ViewChanged="ScrollViewer2_OnViewChanged">
        <ItemsControl x:Name="ItemsControl2">
            <ItemsControl.ItemTemplate>
                <DataTemplate>
                    <TextBlock Text="{Binding}"/>
                </DataTemplate>
            </ItemsControl.ItemTemplate>
        </ItemsControl>
    </ScrollViewer>
</Grid>

试试这个,希望对您有所帮助。

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

两个内容大小不同的 ScrollViewer 的同步滚动

来自分类Dev

如何单向同步两个列表?

来自分类Dev

iOS:如何同步两个UIScrollview

来自分类Dev

如何同步两个本地目录?

来自分类Dev

如何保持两个AVCaptureMovieFileOutput同步

来自分类Dev

如何让两个promise同步执行?

来自分类Dev

同步两个JSlider

来自分类Dev

如何将两个线程“纳入”“同步”方法

来自分类Dev

如何在Android中同步移动两个视图?

来自分类Dev

如何在AngularJS中同步两个$ resource调用

来自分类Dev

如何使用AngularJS同步两个div的滚动位置?

来自分类Dev

如何在Java Swing中同步两个视图

来自分类Dev

如何同步两个过滤器?

来自分类Dev

如何正确地同步两个线程

来自分类Dev

如何使用Android NTP同步两个设备的时间?

来自分类Dev

如何使用动态内容构建两个同步ListView

来自分类Dev

如何在CSS中同步两个动画?

来自分类Dev

JSXGraph:如何使两个图保持同步

来自分类Dev

如何在Android中同步移动两个视图?

来自分类Dev

如何使用AngularJS同步两个div的滚动位置?

来自分类Dev

如何在Java Swing中同步两个视图

来自分类Dev

如何同步两个程序的计时器

来自分类Dev

如何通过名为semaphore的posix同步两个进程?

来自分类Dev

如何同步两个NSView的渲染内容?

来自分类Dev

如何使用SQL同步两个SQLite表?

来自分类Dev

如何同步两个 MS Access 表?

来自分类Dev

如何在两个googlespreadsheet中用= importrange()同步两个工作表?

来自分类Dev

如何在计划的时间同步两个不同帐户上的两个Azure Blob?

来自分类Dev

如何在两个googlespreadsheet中用= importrange()同步两个工作表?

Related 相关文章

热门标签

归档