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

VisualStateManager が正しいアプローチだとは思いません。代わりに、コントロールをサブクラス化し、OnApplyTemplate をオーバーライドしてから、background プロパティを自分で設定します。別の方法は、PropertyChanged イベントをリッスンし、それに応じて背景を交換する添付プロパティを宣言することです。

于 2012-05-09T23:18:18.823 に答える
1

「SplitterBackground」境界線をコピーし、テンプレートのグリッドに 2 回貼り付けます - インスタンスごとに異なる名前を付けます (設定を忘れずGrid.ColumnSpanGrid.RowSpan)。新しい境界線ごとに、必要な背景を設定します。

于 2012-05-09T17:56:12.503 に答える