Question

关于SO有很多类似的问题，但到目前为止我还没能解决使用它们的问题。

我在WrapPanel中有一堆控件，而WrapPanel在ScrollViewer中。 ScrollViewer位于网格内。

我正在尝试让WrapPanel中的所有<Border>控件都具有＆＃39; Vertical＆＃39; （这样它们就会向下流动，当没有更多空间垂直留下时，它们会水平缠绕）并且当水平方向上没有剩余空间时会出现HorizontalScrollBar。

到目前为止我的代码如下：

<Grid x:Name="configGrid">
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*" />                            
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
        <RowDefinition Height="*" />
    </Grid.RowDefinitions>

    <ScrollViewer Grid.Row="0" VerticalScrollBarVisibility="Disabled" HorizontalScrollBarVisibility="Auto" Width="{Binding ElementName=configGrid, Path=ActualWidth}" Height="{Binding ElementName=configGrid, Path=ActualHeight}">
        <WrapPanel HorizontalAlignment="Left" Orientation="Vertical" x:Name="ConfigWrapPanel" Width="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type ScrollViewer}}, Path=ActualWidth}">

            <Border BorderBrush="White" BorderThickness="1,1,1,1" CornerRadius="2" Margin="10">
                <Expander IsExpanded="True" BorderThickness="0" Header="General">
                    // some controls here
                </Expander>
            </Border>

            <Border BorderBrush="White" BorderThickness="1,1,1,1" CornerRadius="2" Margin="10">
                <Expander IsExpanded="True" BorderThickness="0" Header="Another Block">
                    // some controls here
                </Expander>
            </Border>

            // many more <border> blocks here....

        </WrapPanel>
    </ScrollViewer>
</Grid>

这个几乎按预期工作，各种内容垂直流动，当底部没有足够的空间时，它向上和向右移动并再次从顶部开始。但我从来没有得到任何水平滚动条，控件只是从屏幕右侧消失。

我确信这是非常简单的事情，但我无法理解这一点。

作为一些进一步的信息，各种Border控件和子元素都是动态宽度和高度（这就是我选择垂直方向WrapPanel而不是Horizontal的原因）

非常感谢任何帮助。

Answer 1

您必须从WrapPanel中删除Width。

该宽度想要拉伸到无穷大，这会阻止ScrollViewer更正地测量WrapPanel的边界，导致从不显示ScrollBar。

下面的代码显示了一个工作示例：

<Grid x:Name="configGrid">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*"></ColumnDefinition>
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition Height="*" />
        </Grid.RowDefinitions>

        <ScrollViewer Grid.Row="0" VerticalScrollBarVisibility="Disabled" HorizontalScrollBarVisibility="Auto"  Height="{Binding ElementName=configGrid, Path=ActualHeight}">
            <WrapPanel HorizontalAlignment="Left" Orientation="Vertical" x:Name="ConfigWrapPanel" >

                <Border BorderBrush="White" BorderThickness="1,1,1,1" CornerRadius="2" Margin="10">
                    <Expander IsExpanded="True" BorderThickness="0" Header="General">
                        // some controls here
                    </Expander>
                </Border>

                <Border BorderBrush="White" BorderThickness="1,1,1,1" CornerRadius="2" Margin="10">
                    <Expander IsExpanded="True" BorderThickness="0" Header="Another Block">
                        // some controls here
                    </Expander>
                </Border>


            </WrapPanel>
        </ScrollViewer>
    </Grid>

ScrollViewer中的WPF WrapPanel问题

1 个答案: