1

我在 silverlight 应用程序中使用了这个出色的CollapsibleGridSplitter。控制模板如下。

我想做的是当拆分器是垂直或水平时,更改 CollapsibleGridSplitter 的背景。例如,当 VerticalAlignment=Stretch 时将 Background 设置为 SplitterBackgroundV,当 Horizo​​ntalAlignment=Stretch 时将 Background 设置为 SplitterBackgroundH。

在此处输入图像描述

(请参阅设置默认背景的样式的第一行<Setter Property="Background" Value="{StaticResource SplitterBackgroundV}" />

由于这是 Silverlight,我需要使用 VisualStateManager(我对它的了解比 WPF 触发器少得多)。

有什么建议么?

提前致谢!

  <LinearGradientBrush x:Key="SplitterBackgroundV" StartPoint="0,0" EndPoint="1,0">
    <GradientStop Color="#FFC3C3C3"/>
    <GradientStop Color="#FFDDDDDD" Offset="0.4"/>
    <GradientStop Color="#FFDDDDDD" Offset="0.6"/>
    <GradientStop Color="#FFC3C3C3" Offset="1"/>
  </LinearGradientBrush>

  <LinearGradientBrush x:Key="SplitterBackgroundH" StartPoint="0,0" EndPoint="0,1">
    <GradientStop Color="#FFC3C3C3"/>
    <GradientStop Color="#FFDDDDDD" Offset="0.4"/>
    <GradientStop Color="#FFDDDDDD" Offset="0.6"/>
    <GradientStop Color="#FFC3C3C3" Offset="1"/>
  </LinearGradientBrush>

  <Style TargetType="Controls:CollapsibleGridSplitter">
    <Setter Property="Background" Value="{StaticResource SplitterBackgroundV}" />
    <Setter Property="IsTabStop" Value="False" />
    <Setter Property="PreviewStyle" Value="{StaticResource GridSplitterPreviewStyle}" />
    <Setter Property="VerticalHandleStyle" Value="{StaticResource VerticalGridSplitterHandleStyle}" />
    <Setter Property="HorizontalHandleStyle" Value="{StaticResource HorizontalGridSplitterHandleStyle}" />
    <Setter Property="HorizontalAlignment" Value="Center" />
    <Setter Property="Template">
      <Setter.Value>
        <ControlTemplate TargetType="Controls:CollapsibleGridSplitter">
          <Grid x:Name="Root" IsHitTestVisible="{TemplateBinding IsEnabled}">
            <VisualStateManager.VisualStateGroups>
              <VisualStateGroup x:Name="CommonStates">
                <VisualState x:Name="Normal" />
                <VisualState x:Name="MouseOver" />
                <VisualState x:Name="Disabled"/>
              </VisualStateGroup>
              <VisualStateGroup x:Name="FocusStates">
                <VisualStateGroup.Transitions>
                  <VisualTransition GeneratedDuration="0" />
                </VisualStateGroup.Transitions>
                <VisualState x:Name="Unfocused" />
                <VisualState x:Name="Focused">
                  <Storyboard>
                    <DoubleAnimation Storyboard.TargetName="FocusVisual" Storyboard.TargetProperty="Opacity" To="1" Duration="0" />
                  </Storyboard>
                </VisualState>
              </VisualStateGroup>
            </VisualStateManager.VisualStateGroups>
            <Border x:Name="SplitterBackground" BorderThickness="1,0,1,0" BorderBrush="#FF999999" 
                    DataContext="{TemplateBinding IsCollapsed}"
                    IsHitTestVisible="{Binding Converter={StaticResource InverseBooleanConverter}}"
                    Opacity="{Binding Converter={StaticResource BooleanToValueConverter}}"
                    Background="{TemplateBinding Background}">
            </Border>
            <Grid x:Name="HorizontalTemplate">
              <Grid.ColumnDefinitions>
                <ColumnDefinition Width="*" />
                <ColumnDefinition Width="50" />
                <ColumnDefinition Width="*" />
              </Grid.ColumnDefinitions>
              <ToggleButton x:Name="HorizontalGridSplitterHandle" Grid.Column="1" IsHitTestVisible="True" Style="{TemplateBinding HorizontalHandleStyle}" RenderTransformOrigin="0.5,0.5" IsChecked="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=IsCollapsed, Mode=TwoWay}">
                <ToggleButton.RenderTransform>
                  <ScaleTransform ScaleY="1" />
                </ToggleButton.RenderTransform>
              </ToggleButton>
            </Grid>
            <Grid x:Name="VerticalTemplate" Visibility="Collapsed">
              <Grid.RowDefinitions>
                <RowDefinition Height="*" />
                <RowDefinition Height="50" />
                <RowDefinition Height="*" />
              </Grid.RowDefinitions>
              <ToggleButton x:Name="VerticalGridSplitterHandle" Grid.Row="1" IsHitTestVisible="True" Style="{TemplateBinding VerticalHandleStyle}" RenderTransformOrigin="0.5,0.5" IsChecked="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=IsCollapsed, Mode=TwoWay}">
                <ToggleButton.RenderTransform>
                  <ScaleTransform ScaleX="1" />
                </ToggleButton.RenderTransform>
              </ToggleButton>
            </Grid>
            <Rectangle x:Name="FocusVisual" Stroke="#FF6DBDD1" StrokeThickness="1" Opacity="0" IsHitTestVisible="false" />
          </Grid>
        </ControlTemplate>
      </Setter.Value>
    </Setter>
  </Style>
4

2 回答 2

1

复制“SplitterBackground”边框并将其粘贴到模板的网格中两次 - 为每个实例命名不同(并记住相应地设置Grid.ColumnSpanGrid.RowSpan。对于每个新边框,设置您需要的背景。

于 2012-05-09T17:56:12.503 回答
1

我不认为 VisualStateManager 是正确的方法。相反,将控件子类化,然后重写 OnApplyTemplate,然后自己设置背景属性。另一种方法是声明一个附加属性,该属性侦听 PropertyChanged 事件并相应地交换背景。

于 2012-05-09T23:18:18.823 回答