XAML/WPF - 里面有 StackPanel 的 ScrollViewer 不滚动 [英] XAML/WPF - ScrollViewer which has StackPanel inside is not scrolling

问题描述

我在 ScrollViewer 中有以下 StackPanel 显示用户控件元素每当特定事件发生时:

I have the following StackPanel inside a ScrollViewer that shows User Control elements Whenever a specific event occurs:

注意:StackPanel 中可能会出现许多 UserControl，这就是我添加滚动查看器的原因

<ScrollViewer 
        VerticalScrollBarVisibility="Auto"
        Grid.Row="2"
        CanContentScroll="True" 
        Grid.ColumnSpan="2">

        <StackPanel Orientation="Vertical">
            <ItemsControl ItemsSource="{Binding UserControls}">
                <ItemsControl.ItemTemplate>
                    <DataTemplate>
                        <views:UserControl/>
                    </DataTemplate>
                </ItemsControl.ItemTemplate>
            </ItemsControl>
        </StackPanel>
</ScrollViewer>

虽然，StackPanel 仍然超出范围并且滚动条不显示并且不起作用！

Although, the StackPanel is still going out of range and the scroll bars doesn't show and doesn't work!

我尝试修复 StackPanel 和 ItemsControl 的高度，但它似乎也不起作用...

I tried fixing the height of both the StackPanel and the ItemsControl but it does't seem to work either...

包含 ScrollViewer 的窗口布局:

<Grid Margin="0,15,0,0">

    <Grid.RowDefinitions>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="Auto"/>
    </Grid.RowDefinitions>

    <Label 
        Content="This is a Label" 
        HorizontalAlignment="Left"
        VerticalAlignment="Top"
        Margin="5,5,0,0"
        FontSize="15"
        Grid.Row="0" Grid.ColumnSpan="2">
    </Label>


    <StackPanel Grid.Row="1" Orientation="Horizontal" Grid.ColumnSpan="2">
        <ComboBox
            ItemsSource="{Binding Something}"
            Text="Confirm with..."
            SelectedItem="{Binding Something}"/>
        <Button
            HorizontalAlignment="Left"
            Margin="5"
            Content="Add new UserControl"
            Command="{Binding Path=AddUserControl}"/>

    </StackPanel>

    <ScrollViewer 
        VerticalScrollBarVisibility="Auto"
        Grid.Row="2"
        CanContentScroll="True"
        HorizontalScrollBarVisibility="Auto">
        <StackPanel Orientation="Vertical">
            <ItemsControl ItemsSource="{Binding UserControls}" Height="300">
                <ItemsControl.ItemTemplate>
                    <DataTemplate>
                        <views:UserControl/>
                    </DataTemplate>
                </ItemsControl.ItemTemplate>
            </ItemsControl>
        </StackPanel>
    </ScrollViewer>

</Grid>

这是我添加到 ScrollViewer 内的 StackPanel 的 UserControl:

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto"/>
    </Grid.RowDefinitions>

    <StackPanel
        Orientation="Horizontal" 
        Grid.Row="0">

        <Button
            Name="DeleteFilter" 
            HorizontalAlignment="Left"
            Margin="5"
            Content="-"/>

        <ComboBox 
            Margin="5"
            IsEditable="False"
            IsReadOnly="True"
            Width="150"
            ItemsSource="{Binding SomeObject}"
            DisplayMemberPath="Name"
            SelectedItem="{Binding SomeObjectProperty}"/>

        <ComboBox 
            Margin="5"
            IsEditable="False"
            IsReadOnly="True"
            Width="150"
            ItemsSource="{Binding AnotherObject}" 
            DisplayMemberPath="Name"
            SelectedItem="{Binding AnotherObjectProperty}"/>

        <TextBox 
            x:Name="Value"
            Text="{Binding TextBoxValueString}"
            TextAlignment="Center"
            Width="100"
            Margin="5"
            Visibility="{Binding TextBoxVisibility}"/>

    </StackPanel>

</Grid>

我是 XAML 和 WPF 的新手.

有什么建议吗?

推荐答案

ScrollViewers 和 StackPanel 不能很好地协同工作.这是因为如果 Orientation 属性设置为 Horizo​​ntal 和无限垂直空间，则 StackPanel 测量其具有无限水平空间的子元素垂直.请在此处参考我的回答以获取更多信息:

ScrollViewers and StackPanel don't work well together. This is because a StackPanel measures its child elements with infinite horizontal space if its Orientation property is set to Horizontal and infinite vertical space if it is set to Vertical. Please refer to my answer here for more information:

如何在堆栈面板中滚动数据网格?

因此您应该将 StackPanel 替换为另一个 Panel 或将其完全删除:

So you should replace the StackPanel with another Panel or remove it altogether:

<ScrollViewer 
        VerticalScrollBarVisibility="Auto"
        Grid.Row="2"
        CanContentScroll="True"
        HorizontalScrollBarVisibility="Auto">
        <ItemsControl ItemsSource="{Binding UserControls}" Height="300">
            <ItemsControl.ItemTemplate>
                <DataTemplate>
                    <views:UserControl/>
                </DataTemplate>
            </ItemsControl.ItemTemplate>
        </ItemsControl>
</ScrollViewer>

这篇关于XAML/WPF - 里面有 StackPanel 的 ScrollViewer 不滚动的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！