当滑块位于 StackPanel 内时如何展开滑块以填充可用空间

Question

在 Grid 中插入 Slider 会扩展它以填充可用空间，但我不想使用网格，原因如下：

我有一个 TextBlock 和 UserControl 中的 Slider，滑块是弹簧加载的，可以点动/往返；必须显示当前值，因为用户不能依赖中性光标的位置，因此文本块。实现此自定义滑块的 **Orientation** 属性需要旋转两个组件并调整它们的相对位置（左/右或上/下），这对于使用网格（除非我错过了一些明显的东西），而它是带有 StackPanel 的。

对 Aviad 评论的回应

Aviad，谢谢，我对造成的痛苦表示歉意；-) 问题在标题中：当滑块位于 StackPanel 内时，如何扩展滑块以填充可用空间？

此用户控件：

<UserControl x:Class="XXX.Preview.SelectionView"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Height="auto" Width="auto">
    <GroupBox Header="Selected">
        <StackPanel Orientation="Horizontal">
            <TextBlock/>
            <Slider/>
        </StackPanel>
    </GroupBox>
</UserControl>

即使包含在具有“*”宽度的行中，也不会在包含在网格中时展开。滑块根本没有长度。

解决方案是在下面的代码中用网格替换堆栈面板，但我不想使用网格，因为当封闭用户控件时，我需要使用堆栈面板的 Orientation 属性来显示垂直堆叠的两个控件方向设置为“垂直”。

Answer 1

非常简单，只需绑定即可！
请注意，StackPanel 为 Horizo​​ntalAlignment="Stretch"
以及绑定积分引用的名称

            <StackPanel HorizontalAlignment="Stretch" VerticalAlignment="Top" Orientation="Horizontal" Name="ParentPanel">
                <Slider Minimum="1" Maximum="999999" Interval="3" Width="{Binding Path=ActualWidth, ElementName=ParentPanel}"></Slider>
            </StackPanel>

@somedust

遵循此链接到类似的问题，并了解如何使用转换器更好地控制绑定。

Answer 2

您可以将滑块嵌入到具有像 Witdh="*" 这样的 ColumnDefinition 的网格列中（即，将分配可用空间）。例如，您可以在下面找到如何获取 TextBlock |滑块| TextBlock 布局，滑块拉伸以填充中间列的可用空间：

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="Auto"/>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="Auto"/>
    </Grid.ColumnDefinitions>
    <TextBlock Grid.Column="0" Text="CutOff Fraction:"/>
    <Slider  Grid.Column="1"  
             x:Name="SliderCutOffFraction"
             IsEnabled="{Binding ElementName=ChkLanczosFilter, Path=IsChecked}"
             HorizontalAlignment="Stretch"
             Margin="2" 
             Minimum="0.5"
             Maximum="5" 
             SmallChange="0.25"
             LargeChange="0.5" 
             TickPlacement="BottomRight" 
             TickFrequency="0.5"
             Value="1"            
             ValueChanged="SliderCutOffFraction_OnValueChanged"/>
    <TextBlock Grid.Column="2" Width="20"
               DockPanel.Dock="Right"
               Text="{Binding ElementName=SliderCutOffFraction, Path=Value}"
               TextAlignment="Center"/>
</Grid>

Answer 3

使用 DockPanel 而不是 StackPanel 可以更好地完成这件事。你可以尝试一下。

检查一下：
http://msdn.microsoft.com/en-us/library/bb628664。 aspx

和 http://www.wpftutorial.net/DockPanel.html

Answer 4

简短的回答是“你不能”。 StackPanel 受到其 ArrangeOverride 和 MeasureOverride 代码的限制。它根本不具备扩展以填充堆叠方向上的可用空间的能力。

当然，您可以子类化 StackPanel，并以不同的方式实现它，但 StackPanel 非常简单，如果您打算这样做，您也可以只子类化 Panel，或者您可以子类化 DockPanel（它具有扩展能力），然后设置DockPanel.Dock 基于其 StackPanel.Orientation 属性在其所有子级上：

public class StackPanelExpanding : DockPanel
{
  public Orientation Orientation
  {
    get { return (Orientation)GetValue(OrientationProperty); }
    set { SetValue(OrientationProperty, value); }
  }
  public static DependencyProperty OrientationProperty =
    StackPanel.OrientationProperty.AddOwner(typeof(StackPanelExpanding));

  protected override MeasureOverride(...)
  {
    var dock = Orientation==Orientation.Vertical ? Dock.Top : Dock.Left;
    foreach(var element in Children)
      SetDock(element, dock);
    base.MeasureOverride(...);
  }
}

您仍然没有弄清楚为什么不能仅使用 DockPanel 并在模板中使用触发器来同步 Orientation 和 DockPanel.Dock。坦率地说，在大多数情况下，我更倾向于采用这种方式，而不是创建自定义面板。