2012-03-08 12 views
0

アイコンを表示する代わりにチェックボックスをオンにしたときにチェックボックスの背景色を変更したいが、これを行う方法がわからない。私は別の背景色で新しい "Rectangle"を作成しようとしましたが、VisualStateで "Checked"と呼んでいますが、それは機能しませんでした。Silverlight CheckBox

マイコード:

<Style TargetType="CheckBox"> 
    <Setter Property="Background" Value="{StaticResource CheckBoxBackgroundBrush}" /> 
    <Setter Property="BorderBrush" Value="{StaticResource CheckBoxBorderBrush}" /> 
    <Setter Property="Foreground" Value="{StaticResource NormalFontBrush}" /> 
    <Setter Property="HorizontalContentAlignment" Value="Left" /> 
    <Setter Property="Padding" Value="6,1,0,0" /> 
    <Setter Property="VerticalContentAlignment" Value="Center" /> 
    <Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate TargetType="CheckBox"> 
       <Grid> 
        <Grid.ColumnDefinitions> 
         <ColumnDefinition Width="13" /> 
         <ColumnDefinition Width="*" /> 
        </Grid.ColumnDefinitions> 
        <VisualStateManager.VisualStateGroups> 
         <VisualStateGroup x:Name="CommonStates"> 
          <VisualState x:Name="Normal" /> 
          <VisualState x:Name="MouseOver"> 
           <Storyboard> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="MouseOverBorder"> 
             <DiscreteObjectKeyFrame KeyTime="0" Value="Visible" /> 
            </ObjectAnimationUsingKeyFrames> 
           </Storyboard> 
          </VisualState> 
          <VisualState x:Name="Pressed"> 
           <Storyboard> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="PressedBorder"> 
             <DiscreteObjectKeyFrame KeyTime="0" Value="Visible" /> 
            </ObjectAnimationUsingKeyFrames> 
           </Storyboard> 
          </VisualState> 
          <VisualState x:Name="Disabled"> 
           <Storyboard> 
            <DoubleAnimation Duration="0" To=".55" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="contentPresenter" /> 
            <DoubleAnimation Duration="0" To="0.55" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="DisabledVisualElement" /> 
           </Storyboard> 
          </VisualState> 
         </VisualStateGroup> 
         <VisualStateGroup x:Name="CheckStates"> 
          <VisualState x:Name="Checked"> 
           <Storyboard> 
            <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="CheckIcon" /> 
           </Storyboard> 
          </VisualState> 
          <VisualState x:Name="Unchecked" /> 
          <VisualState x:Name="Indeterminate"> 
           <Storyboard> 
            <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="IndeterminateIcon" /> 
           </Storyboard> 
          </VisualState> 
         </VisualStateGroup> 
         <VisualStateGroup x:Name="FocusStates"> 
          <VisualState x:Name="Focused"> 
           <Storyboard> 
            <DoubleAnimation Duration="0" Storyboard.TargetName="FocusVisualElement" Storyboard.TargetProperty="(FrameworkElement.Opacity)" To="1" /> 
           </Storyboard> 
          </VisualState> 
          <VisualState x:Name="Unfocused" /> 
         </VisualStateGroup> 
         <VisualStateGroup x:Name="ValidationStates"> 
          <VisualState x:Name="Valid" /> 
          <VisualState x:Name="InvalidUnfocused"> 
           <Storyboard> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" Storyboard.TargetName="ValidationErrorElement"> 
             <DiscreteObjectKeyFrame KeyTime="0" Value="Visible" /> 
            </ObjectAnimationUsingKeyFrames> 
           </Storyboard> 
          </VisualState> 
          <VisualState x:Name="InvalidFocused"> 
           <Storyboard> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" Storyboard.TargetName="ValidationErrorElement"> 
             <DiscreteObjectKeyFrame KeyTime="0" Value="Visible" /> 
            </ObjectAnimationUsingKeyFrames> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="IsOpen" Storyboard.TargetName="validationTooltip"> 
             <DiscreteObjectKeyFrame KeyTime="0"> 
              <DiscreteObjectKeyFrame.Value> 
               <System:Boolean>True</System:Boolean> 
              </DiscreteObjectKeyFrame.Value> 
             </DiscreteObjectKeyFrame> 
            </ObjectAnimationUsingKeyFrames> 
           </Storyboard> 
          </VisualState> 
         </VisualStateGroup> 
        </VisualStateManager.VisualStateGroups> 
        <Grid Height="12" HorizontalAlignment="Left" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" Width="12"> 
         <Rectangle x:Name="Background" Fill="{TemplateBinding Background}" Height="12" Stroke="{TemplateBinding BorderBrush}" Width="12" /> 
         <Border x:Name="OuterHighlight" BorderBrush="{StaticResource ControlOuterHighlightBrush}" BorderThickness="0,0,1,1" CornerRadius="1,0,1,0" Margin="1,1,-1,-1" /> 
         <Border x:Name="InnerShadow" BorderBrush="{StaticResource CheckBoxInnerShadowBrush}" BorderThickness="1,1,0,0" CornerRadius="0.5" Margin="1,1,0,0" /> 
         <Border x:Name="MouseOverBorder" BorderBrush="{StaticResource ColorAccentBrush}" BorderThickness="1" Margin="1" Visibility="Collapsed" /> 
         <Border x:Name="PressedBorder" BorderBrush="{StaticResource ColorAccentSubduedBrush}" BorderThickness="1" Margin="1" Visibility="Collapsed" /> 
         <Path x:Name="CheckIcon" Data="M0.5625,5.0625 L1.5,3.9375 L2.9575791,4.9549685 C2.9575791,4.9549685 5.75,1.125 5.75,1.125 C5.75,1.125 6.9375,2 6.9375,2 C6.9375,2 3.186887,7.0000076 3.186887,7.0000076 z" Fill="{StaticResource CheckBoxColorAccentHighlightBrush}" FlowDirection="LeftToRight" Margin="2,2,0,1" Opacity="0"/> 
         <Rectangle x:Name="IndeterminateIcon" Fill="{StaticResource ColorAccentHighlightBrush}" Height="2" Opacity="0" Width="6" /> 
         <Rectangle x:Name="DisabledVisualElement" Fill="{StaticResource DisabledBrush}" Height="12" Opacity="0" Width="12" /> 
         <Rectangle x:Name="FocusVisualElement" IsHitTestVisible="False" Margin="2" Opacity="0" Stroke="{StaticResource FocusVisualBrush}" StrokeThickness="{StaticResource FocusVisualStrokeThickness}" /> 
         <Border x:Name="ValidationErrorElement" BorderBrush="{StaticResource ErrorBrush}" BorderThickness="1" Margin="1" ToolTipService.PlacementTarget="{Binding RelativeSource={RelativeSource TemplatedParent}}" Visibility="Collapsed"> 
          <ToolTipService.ToolTip> 
           <ToolTip x:Name="validationTooltip" DataContext="{Binding RelativeSource={RelativeSource TemplatedParent}}" Placement="Right" PlacementTarget="{Binding RelativeSource={RelativeSource TemplatedParent}}" Template="{StaticResource ValidationToolTipTemplate}"> 
            <ToolTip.Triggers> 
             <EventTrigger RoutedEvent="Canvas.Loaded"> 
              <BeginStoryboard> 
               <Storyboard> 
                <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="IsHitTestVisible" Storyboard.TargetName="validationTooltip"> 
                 <DiscreteObjectKeyFrame KeyTime="0"> 
                  <DiscreteObjectKeyFrame.Value> 
                   <System:Boolean>true</System:Boolean> 
                  </DiscreteObjectKeyFrame.Value> 
                 </DiscreteObjectKeyFrame> 
                </ObjectAnimationUsingKeyFrames> 
               </Storyboard> 
              </BeginStoryboard> 
             </EventTrigger> 
            </ToolTip.Triggers> 
           </ToolTip> 
          </ToolTipService.ToolTip> 
          <Grid Background="Transparent" HorizontalAlignment="Right" Height="10" Margin="0,-4,-4,0" VerticalAlignment="Top" Width="10"> 
           <Path Data="M 1,0 L5,0 A 2,2 90 0 1 7,2 L7,6 z" Fill="{StaticResource ErrorBrush}" Margin="0,3,0,0" /> 
          </Grid> 
         </Border> 
        </Grid> 
        <ContentPresenter x:Name="contentPresenter" Content="{TemplateBinding Content}" ContentTemplate="{TemplateBinding ContentTemplate}" Grid.Column="1" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" /> 
       </Grid> 
      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
</Style> 

ありがとう!

答えて

1

あなたは正しい方向にあります。 Checked状態で、不透明度を1にアニメートします。または、VisibilityをCollapsedに設定し、Pressed状態でPressedBorder要素がアニメートされる方法と同様の可視性をアニメートします。 PressedBorder

VSMで
<Border x:Name="CheckedBorder" BorderThickness="1" Margin="1" Background="Green" Visibility="Collapsed" /> 

の下

<VisualState x:Name="Pressed"> 
    <Storyboard> 
     <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="PressedBorder"> 
      <DiscreteObjectKeyFrame KeyTime="0" Value="Visible" /> 
     </ObjectAnimationUsingKeyFrames> 
    </Storyboard> 
</VisualState> 
+0

それは働きました!ありがとう。 – Vinicius