2012-09-14 3 views
9

ToggleButton이 내 윈도우에 있고 내 ResourceDictionary 스타일입니다. ResourceDictionary에있는 이유는 같은 모양을 가져야하는 ToggleButton이 여러 개 이상 있기 때문입니다. ToggleButton 스타일 덮어 쓰기

<Style x:Key="Standardbutton" TargetType="{x:Type ToggleButton}"> 
    <Setter Property="FontSize" Value="18" /> 
    <Setter Property="Foreground" Value="White" /> 
    <Setter Property="Background"> 
     <Setter.Value> 
      <ImageBrush ImageSource="Resources/Standard_Button_Normal.png" /> 
     </Setter.Value> 
    </Setter> 
    <Setter Property="Height" Value="56" /> 
    <Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate TargetType="ToggleButton"> 
       <Border Name="border" BorderThickness="0" Padding="0,0" BorderBrush="DarkGray" CornerRadius="0" Background="{TemplateBinding Background}"> 
        <ContentPresenter HorizontalAlignment="Left" VerticalAlignment="Center" Name="content" Margin="15,0,0,0"/> 
       </Border> 
       <ControlTemplate.Triggers> 
        <Trigger Property="IsChecked" Value="True"> 
         <Setter Property="Background"> 
          <Setter.Value> 
           <ImageBrush ImageSource="Resources/Standard_Button_Pressed.png" /> 
          </Setter.Value> 
         </Setter> 
         <Setter Property="Foreground"> 
          <Setter.Value> 
           <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0"> 
            <GradientStop Color="#FFF9CE7B" Offset="0"/> 
            <GradientStop Color="#FFE88C41" Offset="1"/> 
           </LinearGradientBrush> 
          </Setter.Value> 
         </Setter> 
        </Trigger> 
       </ControlTemplate.Triggers> 
      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
</Style> 

지금이 ToggleButton의 스타일은 기본 배경을 가지고 있으며 "의 IsChecked"경우에도 (위 내 XAML 코드에서 볼 수 있듯이), 그것은 다른 배경이있을 것이다 사실이다.

지금 이러한 버튼 내가

<ToggleButton Style="{DynamicResource Standardbutton}" Margin="0,0,0,4"> 
    <StackPanel Orientation="Horizontal"> 
     <Image Source="Resources/scan_26x26.png" /> 
     <TextBlock Text="Scan"/> 
    </StackPanel> 
</ToggleButton> 

문제는 내가 다른 아이콘 때 ToggleButton을가 할 수있는 방법이다 (내 절름발이 XAML 코드에 대한 죄송) 여기에 무슨 짓을했는지처럼 아이콘 + 텍스트가 결합해야하는 전환 (IsChecked = True)가 확인 되었습니까? 여기

는 질문

정상 ToggleButton의 스타일을 이해하는 데 도움이 될 몇 가지 이미지입니다
enter image description here
의 IsChecked = 진정한 스타일
enter image description here
내 디자인 목표는 다른 아이콘이 때의 IsChecked = True입니다
enter image description here

답변

13

두 이미지를 모두 컨트롤 템플릿에 추가하고 Visibility 속성을 IsChecked 속성에 입력합니다 (true/false를 적절한 Visibility enum 값으로 변환하려면 IValueConverter을 사용하십시오).

<ToggleButton Style="{DynamicResource Standardbutton}" Margin="0,0,0,4"> 
    <StackPanel Orientation="Horizontal"> 
     <Image Source="Resources/scan_26x26.png" 
       Visibility="{Binding 
        RelativeSource={RelativeSource AncestorType=ToggleButton}, 
        Path=IsChecked, 
        Converter={StaticResource BoolToVisibleConverter}}" /> 
     <Image Source="Resources/anotherimage.png" 
        Visibility="{Binding 
        RelativeSource={RelativeSource AncestorType=ToggleButton}, 
        Path=IsChecked, 
        Converter={StaticResource BoolToCollapsedConverter}}" /> 
     <TextBlock Text="Scan"/> 
    </StackPanel> 
</ToggleButton> 

나는 두 개의 컨버터 BoolToVisibleConverterBoolToCollapsedConverter을 사용하지만, 당신은 또한 같은 일을 수행하기 위해 ConverterParameter를 사용할 수 있습니다.

+0

awesomeness! 감사! –

+0

굉장한, 좋은 물건! –