如何在 uwp 的滚动查看器中从底部到顶部垂直偏移？

Question

我希望在 uwp 中从下到上而不是从上到下的滚动查看器垂直偏移，因为当我从顶部增加应用程序的高度时它只显示从上到下，但当我降低应用程序的高度时它会工作.. .............请帮我。

这是我的代码

double getvalue = scrollviewer.verticaloffset;
textblock.Text = getvalue.ToString();

获得价值但是当我增加应用程序的高度时它不起作用但是当我降低应用程序的高度时它显示出一些价值。

当滚动条位于顶部时，它不会给出价值..........................请帮助我。

伙计们这里有一些截图

图 1

正如您在图 1 中看到的，当应用程序处于正常 state 时。

图 2

正如您在图 2 中看到的，当应用程序 window 高度较小时。

图 3

正如您在图 3 中看到的那样，当我向上滚动时，它会显示 Button。

图 4

正如您在图 4 中看到的，当我增加 App 的高度时，它并没有消失。

图 5

正如您在图 5 中看到的那样，当我降低 App 的高度时，它就会消失。

所以伙计们，你能帮我实现这个功能吗

Answer 1

根据图像和您的描述，我认为您的目的是创建一个按钮，用于让ScrollViewer滚动到顶部。 问题是当您向上或向下滚动条或调整 window 的大小时，如何让按钮显示时ScrollViewer's内容不在底部，并且当您向上或向下滚动时，当ScrollViewer's内容不在底部时隐藏按钮向下栏或调整 window 的大小。

您可以使用表示内容垂直滚动距离的VerticalOffset属性和表示可查看内容的垂直大小的ViewportHeight属性和表示ScrollViewer中所有可滚动内容的垂直大小的ExtentHeight属性来确定内容是否ScrollViewer到达底部。

请检查以下代码作为示例：

//MainPage.xaml
<Grid SizeChanged="Grid_SizeChanged">
    <ScrollViewer x:Name="scrollViewer" VerticalScrollBarVisibility="Visible" VerticalScrollMode="Enabled"
                  ViewChanged="scrollViewer_ViewChanged">
        <StackPanel x:Name="stackPanel" Background="LightGray">
            <TextBlock Text="0" Margin="20"/>
            <TextBlock Text="1" Margin="20"/>
            <TextBlock Text="2" Margin="20"/>
            <TextBlock Text="3" Margin="20"/>
            <TextBlock Text="4" Margin="20"/>
            <TextBlock Text="5" Margin="20"/>
            <TextBlock Text="6" Margin="20"/>
            <TextBlock Text="7" Margin="20"/>
            <TextBlock Text="8" Margin="20"/>
            <TextBlock Text="9" Margin="20"/>
            <TextBlock Text="10" Margin="20"/>
            <TextBlock Text="11" Margin="20"/>
            <TextBlock Text="12" Margin="20"/>
    </StackPanel>
    </ScrollViewer>

    <Button x:Name="BackButton" Content="top" Click="BackButton_Click" HorizontalAlignment="Center" VerticalAlignment="Bottom"/>
</Grid>

//MainPage.xaml.cs
private void BackButton_Click(object sender, RoutedEventArgs e)
{
    //The code is used to scroll to the top
    scrollViewer.ChangeView(null, 0, null);

    //the code is used to scroll to the bottom
    //scrollViewer.ChangeView(null, scrollViewer.ExtentHeight-scrollViewer.ViewportHeight, null);
}

private void scrollViewer_ViewChanged(object sender, ScrollViewerViewChangedEventArgs e)
{
    var verticalOffset = scrollViewer.VerticalOffset;
    var extentHeight = scrollViewer.ExtentHeight;
    var viewportHeight = scrollViewer.ViewportHeight;
    if (viewportHeight + verticalOffset == extentHeight)
    {
        BackButton.Visibility = Visibility.Collapsed;
    }
    else
    {
        BackButton.Visibility = Visibility.Visible;
    }
}

private void Grid_SizeChanged(object sender, SizeChangedEventArgs e)
{
    var verticalOffset = scrollViewer.VerticalOffset;
    var extentHeight = scrollViewer.ExtentHeight;
    var viewportHeight = scrollViewer.ViewportHeight;
    if (viewportHeight + verticalOffset == extentHeight)
    {
        BackButton.Visibility = Visibility.Collapsed;
    }
    else
    {
        BackButton.Visibility = Visibility.Visible;
    }
}

如果您有任何其他问题，请随时与我联系。