首页 文章

WPF包装面板和滚动

提问于
浏览
18

我有一个简单的 WrapPanel ,其中包含许多宽控件 . 当我调整 WindowWidth 时,一切都按预期工作 . 如果有足够的空间,控件将在一行上进行,或者如果没有,则控件将在下一行中包含 .

但是,我需要发生的是,如果所有控件基本上都是垂直堆叠的(因为没有更多的水平空间)并且 WindowWidth 更加减少,则会出现一个水平滚动条,以便我可以滚动查看如果我愿意,整个控制 . 下面是我的xaml . 我尝试将 WrapPanel 包裹在 ScrollViewer 中,但我无法达到目标 .

<Window x:Class="WpfQuotes.Window1"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="Window1" Height="Auto" Width="600" Foreground="White">
    <WrapPanel>
      <Button Width="250">1</Button>
      <Button Width="250">2</Button>
      <Button Width="250">3</Button>
    </WrapPanel>
</Window>

因此,如果将上述 WindowWidth 减少到最小值,您将无法看到按钮的文本 . 我想要一个水平滚动条出现,以便我可以滚动查看文本,但不会干扰通常的包装功能 .

谢谢 .

Update: 我已按照下面的保罗建议,水平滚动条现在按预期显示 . 但是,我也想要垂直滚动,所以我设置 VerticalScrollBarVisibility="Auto" . 问题是,如果我调整窗口大小以便显示垂直滚动条,即使不需要(也有足够的水平空间来查看整个控件),也会始终显示水平滚动条 . 好像出现的垂直滚动条会弄乱滚动查看器的宽度 . 有没有办法纠正这个问题,除非实际需要水平滚动条,否则不会出现?

下面是我的xaml和我在 CustomWrapPanel 中添加的唯一代码:

<Window x:Class="Window1"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:cwp="clr-namespace:CustomWrapPanelExample"
        Title="Window1" Height="Auto" Width="300" Foreground="White" Name="mainPanel">
  <ScrollViewer x:Name="MyScrollViewer" HorizontalScrollBarVisibility="Auto"
                VerticalScrollBarVisibility="Auto">
    <cwp:CustomWrapPanel Width="{Binding ElementName=MyScrollViewer, Path=ActualWidth}">
      <Button Width="250">1</Button>
      <Button Width="250">2</Button>
      <Button Width="250">3</Button>
      <Button Width="250">4</Button>
      <Button Width="250">5</Button>
      <Button Width="250">6</Button>
      <Button Width="250">7</Button>
      <Button Width="250">8</Button>
      <Button Width="250">9</Button>
    </cwp:CustomWrapPanel>
  </ScrollViewer>
</Window>

在_1520954中唯一被覆盖的东西:

protected override Size MeasureOverride(Size availableSize)
{
  double maxChildWidth = 0;
  if (Children.Count > 0)
  {
    foreach (UIElement el in Children)
    {
      if (el.DesiredSize.Width > maxChildWidth)
      {
        maxChildWidth = el.DesiredSize.Width;
      }
    }
  }      
  MinWidth = maxChildWidth;
  return base.MeasureOverride(availableSize);
}

1 回答

  • 47

    这就是事情,如果你要使用一个包装面板,它会做两件事,它会在一个方向上占用尽可能多的可用空间,并在另一个方向上根据需要进行扩展 . 例如,如果你将它放在一个窗口内,就像你拥有它一样,它会占用尽可能多的水平空间,然后根据需要向下扩展,这就是垂直滚动条可以工作的原因,父容器说“这是我有多宽,但是你可以让自己变得像你想要的一样大“,如果你把它改成水平滚动条,滚动查看器基本上是说”这是你有多高,但你可以像你想要“在这种情况下,包装面板不会换行,因为没有水平约束 .

    一个可能的解决方案是改变包裹面板从水平到垂直的方向,这样(这可能不是理想或预期的行为):

    <ScrollViewer HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Disabled">
            <WrapPanel Orientation="Vertical">
                <Button Width="250">1</Button>
                <Button Width="250">2</Button>
                <Button Width="250">3</Button>
            </WrapPanel>
        </ScrollViewer>
    

    为了获得您期望的行为,您将不得不做更接近这一点的事情:

    <ScrollViewer x:Name="MyScrollViewer" HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Disabled">
            <WrapPanel MinWidth="250" Width="{Binding ElementName=MyScrollViewer, Path=ViewportWidth}">
                <Button Width="250">1</Button>
                <Button Width="250">2</Button>
                <Button Width="250">3</Button>
            </WrapPanel>
        </ScrollViewer>
    

    但是,第二个解决方案只有在您已经知道子元素的宽度时才有效,理想情况下您希望将最大宽度设置为最大子项的实际宽度,但为了做到这一点,您必须创建一个自定义控件派生自包装面板并自己编写代码以检查它 .

相关问题