我怎样才能让ScrollViewer在StackPanel中工作？

在下面的WPF XAML ScrollViewer不起作用（它显示一个滚动条，但你不能滚动和内容离开窗口底部）。

我可以改变外面的StackPanel到一个网格，它会工作。

但是，在我的应用程序中，我重现了以下代码，我需要一个外部的StackPanel。 我该怎么做的StackPanel使ScrollViewer显示一个可用的滚动条？ 例如VerticalAlignment =“Stretch”Height =“Auto”不起作用。

<StackPanel> <ScrollViewer> <StackPanel> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> </StackPanel> </ScrollViewer> </StackPanel> 

Answer 1

你不能没有固定的StackPanel的高度。 它的目的是无限期地向一个方向发展。 我build议使用不同的Panel 。 为什么你需要有一个外部的StackPanel ？

Answer 2

这也让我烦了一阵子，诀窍就是把你的stackpanel放到scrollviewer中。

此外，您需要确保将滚动查看器的CanContentScroll属性设置为True，以下是一个示例：

  <ScrollViewer Grid.Row="1" Margin="299,12,34,54" Name="ScrollViewer1" VerticalScrollBarVisibility="Auto" HorizontalScrollBarVisibility="Auto" Height="195" CanContentScroll="True"> <StackPanel Name="StackPanel1" OverridesDefaultStyle="False" Height="193" Width="376" VerticalAlignment="Top" HorizontalAlignment="Left"></StackPanel> </ScrollViewer> 

Answer 3

注意有时你可能没有意识到它有一个StackPanel。 在我的情况下，我有这个代码

 <ScrollViewer> <ItemsControl ItemsSource="{Binding Pages}"/> </ScrollViewer> 

哪些工作正常。 绑定引用的“页面”实际上是不同的，复杂的UserControls，我想只有一些滚动条。 所以我删除了scrollviewer：

  <ItemsControl ItemsSource="{Binding Pages}"/> 

然后我把ScrollViewer作为我想要的那些用户控件的顶层元素。 但是，这不起作用。 内容刚从页面stream出。 起初我不认为这个问题/答案可以帮助我，但是我意识到ItemsControl的默认ItemPanel是StackPanel。 所以我通过指定一个不是StackPanel的ItemsPanel来解决我的问题：

 <ItemsControl ItemsSource="{Binding Pages}"> <ItemsControl.ItemsPanel> <ItemsPanelTemplate> <Grid/> </ItemsPanelTemplate> </ItemsControl.ItemsPanel> </ItemsControl> 

Answer 4

事实上，我解决这个问题的方法是去掉外面的堆叠面板，而是将scrollviewer设置在我想要的位置。

  <Grid Style="{StaticResource LayoutRootStyle}"> <Grid.RowDefinitions> <RowDefinition Height="160"/> <RowDefinition Height="*"/> </Grid.RowDefinitions> <!-- Vertical scrolling grid used in most view states --> <ScrollViewer Grid.Row="1" HorizontalScrollBarVisibility="Auto"> <StackPanel Orientation="Horizontal"> <GridView> ... </GridView> </StackPanel> </ScrollViewer> 

Answer 5

这是如何工作的：

 <Window x:Class="TabControl.MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:local="clr-namespace:TabControl" Title="MainWindow" Height="300" DataContext="{Binding RelativeSource={RelativeSource Self}}" > <StackPanel> <ScrollViewer Height="{Binding RelativeSource={RelativeSource Mode=FindAncestor,AncestorType={x:Type Border}},Path=ActualHeight}" > <StackPanel > <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> <TextBlock Text="This is a test"/> </StackPanel> </ScrollViewer> </StackPanel> 

通过将ScrollViewer的高度绑定到窗口的内部高度。

重新resize的逻辑是我们需要给任何元素固定高度或devise视图使用渲染高度。

输出：

Answer 6

移动Grid.Row =“1”从StackPanel ScrollViewer完全解决了我。

我在一个StackPanel中显示了大约40个项目的列表，但只有前20个显示。

  <ScrollViewer Grid.Row="1" VerticalScrollBarVisibility="Auto"> <StackPanel x:Name="ContentPanel" Margin="12,0,12,0"> <TextBlock Text="{Binding Line1}" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}"/> <TextBlock Text="" Margin="10,-2,10,0" Style="{StaticResource PhoneTextNormalStyle}" /> ... </StackPanel> </ScrollViewer>