WPF如何在用户向下滚动后始终将控件置于顶部并保持在视图中

Question

我正在使用WPF构建一个垂直时间轴应用程序，如下所示：

该应用程序分为两个方面，左侧是圆圈中的日期，右侧是详细信息。

让我们说在我的屏幕上我只能看到左边的2个圆圈，右边是一些很长的细节。我想要实现的是，当我向下滚动时，第一个圆圈在屏幕上方，然后卡在顶部而不是走出我的视线。

就像Android上的Telegram一样，无论用户向上或向下滚动，发送者的显示图片总是在顶部，直到下一个发送者的显示图片进入。

我希望我能够清楚地解释自己。我已经设法在WPF中创建应用程序，现在我想进行上面提到的增强，但我不知道从哪里开始。

编辑：这是两个图像来解释我想要实现的目标。

在向下滚动之前

向下滚动后

Answer 1

我能想到的最简单的解决方案是使用HeaderedItemsControl。这样您就可以将顶部项目设置为标题，将所有其他项目设置为列表项目。

 <Grid>

        <HeaderedItemsControl>
            <HeaderedItemsControl.Template>
                <ControlTemplate TargetType="{x:Type HeaderedItemsControl}">
                    <Border>
                        <Grid>
                            <Grid.RowDefinitions>
                                <RowDefinition Height="Auto" />
                                <RowDefinition Height="Auto" />
                                <RowDefinition />
                            </Grid.RowDefinitions>
                            <ContentPresenter ContentSource="Header" />
                            <!--<Separator Grid.Row="1" />-->
                            <ScrollViewer Grid.Row="2" VerticalScrollBarVisibility="Visible">
                                <ItemsPresenter />
                            </ScrollViewer>
                        </Grid>
                    </Border>
                </ControlTemplate>
            </HeaderedItemsControl.Template>
            <HeaderedItemsControl.Header>Mark</HeaderedItemsControl.Header>
            <HeaderedItemsControl.Items>
                <system:String>Mark2</system:String>
                <system:String>Mark3</system:String>
                <system:String>Mark4</system:String>
                <system:String>Mark5</system:String>
                <system:String>Mark6</system:String>
                <system:String>Mark7</system:String>
                <system:String>Mark7</system:String>
            </HeaderedItemsControl.Items>
        </HeaderedItemsControl>
    </Grid>