更改GridSplitter预览的高度

时间:2011-02-16 20:28:28

标签: wpf wpf-controls controltemplate

我有一个WPF GridSplitter,其中一个controltemplate用于添加夹点和按钮。高度设置为20px。当我拖动分割器来调整网格大小时,预览也是20px。我想在拖动时更改预览的高度。

有一种简单的方法可以实现这一目标吗?

<Style TargetType="{x:Type GridSplitter}" x:Key="AdvancedGridSplitter">
    <Setter Property="Background" Value="{DynamicResource {x:Static themes:PropertyGridCommonDictionary.SummarySplitterBackgroundBrushKey}}" />
    <Setter Property="BorderBrush" Value="{DynamicResource {x:Static themes:DockingCommonDictionary.DocumentTabBorderNormalBrushKey}}" />
    <Setter Property="BorderThickness" Value="0,1" />
    <Setter Property="Height" Value="20" />
    <Setter Property="HorizontalAlignment" Value="Stretch" />
    <Setter Property="ResizeBehavior" Value="PreviousAndNext" />
    <Setter Property="VerticalAlignment" Value="Center" />
    <Setter Property="UIElement.SnapsToDevicePixels" Value="True" />
    <Setter Property="UIElement.Focusable" Value="False" />
    <Setter Property="ShowsPreview" Value="True" />
    <Setter Property="Control.Template">
        <Setter.Value>
            <ControlTemplate>
                <Border x:Name="Root" BorderThickness="{TemplateBinding Border.BorderThickness}" BorderBrush="{TemplateBinding Border.BorderBrush}" Background="{TemplateBinding Panel.Background}">                        
                    <Grid>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="Auto" />
                            <ColumnDefinition Width="*" />
                            <ColumnDefinition Width="Auto" />
                            <ColumnDefinition Width="*" />
                            <ColumnDefinition Width="Auto" />
                        </Grid.ColumnDefinitions>

                        <StackPanel Grid.Column="0" HorizontalAlignment="Center" Margin="2,0,0,0" Orientation="Horizontal" VerticalAlignment="Center">
                            <ribbon:Button Context="StatusBarItem" Cursor="Arrow" ImageSourceSmall="/Resources/Splitter/SplitterSwitch.png" ImageSourceSmallSize="11,11" Padding="2,0" />
                        </StackPanel>

                        <Grid Grid.Column="1" />

                        <StackPanel Grid.Column="2" HorizontalAlignment="Center" Orientation="Vertical" VerticalAlignment="Center" x:Name="Grip">
                            <Rectangle Fill="{DynamicResource {x:Static themes:PropertyGridCommonDictionary.BorderBrushKey}}" Height="1" Margin="1" Width="50">
                                <Rectangle.Effect>
                                    <DropShadowEffect BlurRadius="1" Color="White" Direction="90" Opacity=".8" ShadowDepth="1" />
                                </Rectangle.Effect>
                            </Rectangle>
                            <Rectangle Fill="{DynamicResource {x:Static themes:PropertyGridCommonDictionary.BorderBrushKey}}" Height="1" Margin="1" Width="50">
                                <Rectangle.Effect>
                                    <DropShadowEffect BlurRadius="1" Color="White" Direction="90" Opacity=".8" ShadowDepth="1" />
                                </Rectangle.Effect>
                            </Rectangle>
                        </StackPanel>

                        <Grid Grid.Column="3" />

                        <StackPanel Grid.Column="4" HorizontalAlignment="Center" Margin="0,0,2,0" Orientation="Horizontal" VerticalAlignment="Center">
                            <ribbon:Button Context="StatusBarItem" Cursor="Arrow" ImageSourceSmall="/Resources/Splitter/SplitterVertical.png" ImageSourceSmallSize="11,11" Padding="2,0" />
                            <ribbon:Button Context="StatusBarItem" Cursor="Arrow" ImageSourceSmall="/Resources/Splitter/SplitterHorizontal.png" ImageSourceSmallSize="11,11" IsChecked="True" Padding="2,0" />
                            <ribbon:Button Context="StatusBarItem" Cursor="Arrow" ImageSourceSmall="/Resources/Splitter/SplitterMinimize.png" ImageSourceSmallSize="11,11" Padding="2,0" />
                        </StackPanel>
                    </Grid>
                </Border>

                <ControlTemplate.Triggers>
                    <Trigger Property="VerticalAlignment" Value="Stretch">
                        <Setter TargetName="Grip" Property="Orientation" Value="Vertical"/>
                        <Setter TargetName="Grip" Property="Visibility" Value="Visible"/>
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

1 个答案:

答案 0 :(得分:3)

您需要在GridSplitter上设置PreviewStyle:

PreviewStyle="{StaticResource AdvancedGridSplitterPreview}"

合适的风格可能是:

<Style TargetType="{x:Type Control}" x:Key="AdvancedGridSplitterPreview">
    <Setter Property="Height" Value="4"/>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate>
                <Grid>
                    <Rectangle>
                        <Rectangle.Fill>
                            <SolidColorBrush Opacity="0.4" Color="Black"/>
                        </Rectangle.Fill>
                    </Rectangle>
                </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

有关示例的其他说明,请参阅here in the MSDN

希望这有帮助。