टॉगल बटन शैली ओवरराइड

Question

मेरे पास मेरी विंडो में टॉगल बटन है और मेरे संसाधन डिक्शनरी में स्टाइल है। संसाधन डिक्शनरी में इसका कारण यह है कि मेरे पास जल्द से जल्द कई या अधिक 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 कोड पर ऊपर देख सकते हैं) अलग पृष्ठभूमि होगा सच है।

अब इन टॉगल बटन मैं यहाँ क्या किया (मेरी लंगड़ा 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 हो सकता है जैसे, आइकन + पाठ संयुक्त होना आवश्यक है चेक किया गया है (Ischecked = सही)?

यहाँ कुछ छवियों है कि आप सवाल

सामान्य ToggleButton शैली को समझने के लिए सहायक हो सकते हैं

IsChecked = सच शैली

मेरे डिजाइन लक्ष्य एक अलग चिह्न के लिए जब IsChecked = सच है

Answer 1

दोनों छवियों को नियंत्रण टेम्पलेट में जोड़ें, और उनकेको बांधेंसंपत्ति IsChecked संपत्ति (का उपयोग सही/गलत से उचित Visibility enum मान में कनवर्ट करने के लिए करें)।

<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> 

मैं दो कन्वर्टर्स BoolToVisibleConverter और BoolToCollapsedConverter इस्तेमाल किया है, लेकिन आप भी एक ConverterParameter इस्तेमाल कर सकते हैं एक ही बात को पूरा करने के।