Question

我有一个ScrollViewer，里面有一些内容。问题是滚动无法正常工作。当您用手指滚动内容然后释放时，可滚动区域始终快照回到顶部。它只是弹性弹跳，不会停留在滚动到底部的底部。

<Grid Name="DetailPane" Margin="0,0,0,65" VerticalAlignment="Bottom" Visibility="Collapsed" Background="White" Opacity="0.85">
    <StackPanel>
        <Grid VerticalAlignment="Top">
            <Button Margin="0" Padding="0" Click="CloseDetailPanel" HorizontalAlignment="Right" >
                <Button.Content>
                    <Image Source="images\appbar.close.rest.small.png" Width="20" Height="20"></Image>
                </Button.Content>
            </Button>
        </Grid>
        <ScrollViewer x:Name="contentScrollViewer" VerticalAlignment="Top">
            <Grid>
                <StackPanel>
                    <TextBlock Padding="10,0,10,0" HorizontalAlignment="Left" Name="titleTextBlock" TextWrapping="Wrap" Foreground="#FF2B2929" FontWeight="Bold" />
                    <Image x:Name="contentThumbnail" Source="bild.jpg" Visibility="Visible" Width="400" Height="300" Margin="10" />
                    <TextBlock Padding="10" HorizontalAlignment="Left" Name="statusTextBlock" TextWrapping="Wrap" Foreground="#FF2B2929" />
                    <HyperlinkButton Padding="0,5,0,10" x:Name="WikipeadiaLink" HorizontalAlignment="Left" VerticalAlignment="Bottom" Content="More on Wikipedia" TargetName="_blank"  NavigateUri="" Foreground="Blue" FontSize="18" />
                </StackPanel>
            </Grid>
        </ScrollViewer>
    </StackPanel>
</Grid>

我之前确实遇到过类似的问题，我在Stack Overflow的帮助下设法解决了......但是，我又来了，在同一主题上寻求帮助...... 谢谢你！

更新：根据建议，我删除了StackPanels并将其替换为Grids。格式化是完美的，但我仍然有相同的滚动问题！内容仍然重新开始！

<Grid Name="DetailPane" Margin="0,0,0,65" VerticalAlignment="Bottom" Visibility="Collapsed" Background="White" Opacity="0.85">
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="Auto"/>
    </Grid.RowDefinitions>
    <Grid Grid.Row="0" VerticalAlignment="Top">
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
        </Grid.RowDefinitions>
        <Button Grid.Row="0"  Margin="0" Padding="0" Click="CloseDetailPanel" HorizontalAlignment="Right" >
            <Button.Content>
                <Image Source="images\appbar.close.rest.small.png" Width="20" Height="20"></Image>
            </Button.Content>
        </Button>
    </Grid>
    <Grid Grid.Row="1">
        <ScrollViewer x:Name="contentScrollViewer" VerticalAlignment="Top">
            <Grid>
                <Grid.RowDefinitions>
                    <RowDefinition Height="Auto"/>
                    <RowDefinition Height="Auto"/>
                    <RowDefinition Height="Auto"/>
                    <RowDefinition Height="Auto"/>
                </Grid.RowDefinitions>
                <TextBlock Grid.Row="0" Padding="10,0,10,0" HorizontalAlignment="Left" Name="titleTextBlock" TextWrapping="Wrap" Foreground="#FF2B2929" FontWeight="Bold" />
                <Image x:Name="contentThumbnail" Grid.Row="1" Source="bild.jpg" Visibility="Visible" Width="400" Height="300" Margin="10" />
                <TextBlock Grid.Row="2"  Padding="10" HorizontalAlignment="Left" Name="statusTextBlock" TextWrapping="Wrap" Foreground="#FF2B2929" />
                <HyperlinkButton Grid.Row="3" Padding="0,5,0,10" x:Name="WikipeadiaLink" HorizontalAlignment="Left" VerticalAlignment="Bottom" Content="More on Wikipedia" TargetName="_blank"  NavigateUri="" Foreground="Blue" FontSize="18" />
            </Grid>
        </ScrollViewer> 
    </Grid>
</Grid>

Answer 1

由于stackPanel，请尝试将其替换为Grid之类的内容。

试试这个，我删除了一个冗余网格并为滚动查看器添加了拉伸对齐：

<Grid Name="DetailPane" Margin="0,0,0,65" VerticalAlignment="Bottom" Visibility="Collapsed" Background="White" Opacity="0.85">
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="*"/>
    </Grid.RowDefinitions>

    <Button Grid.Row="0"  Click="CloseDetailPanel" HorizontalAlignment="Right" VerticalAlignment="Top">
        <Button.Content>
            <Image Source="images\appbar.close.rest.small.png" Width="20" Height="20"></Image>
        </Button.Content>
    </Button>


        <ScrollViewer x:Name="contentScrollViewer" VerticalAlignment="Stretch" Grid.Row="1"HorizontalAlignment="Stretch">
            <Grid VerticalAlignment="Stretch" HorizontalAlignment="Stretch">
                <Grid.RowDefinitions>
                    <RowDefinition Height="Auto"/>
                    <RowDefinition Height="Auto"/>
                    <RowDefinition Height="Auto"/>
                    <RowDefinition Height="Auto"/>
                </Grid.RowDefinitions>
                <TextBlock Grid.Row="0" Padding="10,0,10,0" HorizontalAlignment="Left" Name="titleTextBlock" TextWrapping="Wrap" Foreground="#FF2B2929" FontWeight="Bold" />
                <Image x:Name="contentThumbnail" Grid.Row="1" Source="bild.jpg" Visibility="Visible" Width="400" Height="300" Margin="10" />
                <TextBlock Grid.Row="2"  Padding="10" HorizontalAlignment="Left" Name="statusTextBlock" TextWrapping="Wrap" Foreground="#FF2B2929" />
                <HyperlinkButton Grid.Row="3" Padding="0,5,0,10" x:Name="WikipeadiaLink" HorizontalAlignment="Left" VerticalAlignment="Bottom" Content="More on Wikipedia" TargetName="_blank"  NavigateUri="" Foreground="Blue" FontSize="18" />
            </Grid>
        </ScrollViewer>

</Grid>

Answer 2

最终解决了这个问题的方法是向ScrollViewer添加一个静态高度。我意识到没有人能够看到这一点，因为我省略了代码部分，表明这是在PivotItem内。

根据这个讨论：http://forums.create.msdn.com/forums/t/84933.aspx ScrollViewer在Pivot内部时会停止正常工作，除非它定义了静态高度。

真气！

ScrollViewer - 滚动不适用于ScrollViewer中的图像

2 个答案: