डब्ल्यूपीएफ रेडियोबटन/टॉगलबटन स्टाइल

Question

मैं नीचे छवि में टॉगलबूटन के समूह के लिए एक शैली की नकल करना चाहता हूं। बटनों में से केवल एक ही समय में "चेक किया जा सकता है"।

मेरा प्रश्न स्टाइल से संबंधित है:

• मैं सबसे बाईं ओर के बटन और छवि में के रूप में सबसे दायीं ओर का बटन पर गोलाकार कोनों करना चाहते हैं, लेकिन अगर वहाँ के बीच एक बटन है (छवि की तरह), कि गोलाकार कोनों नहीं होना चाहिए। कभी-कभी टॉगल करने के लिए केवल दो बटन हो सकते हैं।
• मुझे विभिन्न राज्यों के लिए शैली की आवश्यकता है: न्यूनतम पर "सामान्य/अनचेक", "माउसओवर", "दबाया गया" और "चेक किया गया"।

वर्तमान नियंत्रण मैं इस के लिए उपयोग कर रहा हूँ इस तरह से किया जाता है:

<StackPanel Orientation="Horizontal" > 
    <RadioButton Style="{StaticResource {x:Type ToggleButton}}" Content="All" Padding="12,8,12,8" GroupName="View" /> 
    <RadioButton Style="{StaticResource {x:Type ToggleButton}}" Content="Geolocated" Padding="12,8,12,8" GroupName="View" /> 
    <RadioButton Style="{StaticResource {x:Type ToggleButton}}" Content="Non Geolocated" Padding="12,8,12,8" GroupName="View" /> 
</StackPanel> 

StackPanel संसाधन मैं ToggleButton के लिए शैली स्थापित करने के लिए कोशिश कर रहा हूँ में, लेकिन मैं बहुत खो रहा हूँ कैसे के रूप में परिणाम प्राप्त करने के उपरोक्त छवि में।

Answer 1

यह सबसे आसान/सबसे अच्छा तरीका नहीं हो सकता है, लेकिन मैं कुछ ControlTemplates ऊपर दस्तक पर एक चाकू ले लिया Kaxaml का उपयोग कर, कुछ है कि इस तरह दिखता है निर्माण करने के लिए:

आप में इन टेम्पलेट्स संग्रहीत कर सकती है ResourceDictionary और आवश्यकता होने पर उन्हें लागू करें, या यदि आप फ्लाई पर अपनी बटन सूची बना रहे हैं तो उनका उपयोग करें।

मैंने वास्तव में तीन अलग-अलग शैलियों का निर्माण किया, एक बाएं और दाएं बटन के लिए, और बीच में एक (आप विस्तार/विरासत शैलियों के साथ इसे सरल बनाने में सक्षम हो सकते हैं)। कुछ दोहराया कोड छोड़ा गया।

<Grid> 
    <Grid.Resources> 
     <!-- Brushes for colours/backgrounds --> 
     <SolidColorBrush x:Key="FontBrush" Color="#DDDDDD"/> 

     <LinearGradientBrush x:Key="BgBrush1" StartPoint="0,0" EndPoint="0,1"> 
      <GradientStop Offset="0" Color="#888888"/> 
      <GradientStop Offset="1" Color="#222222"/> 
     </LinearGradientBrush> 

     <SolidColorBrush x:Key="BorderBrush1" Color="#333333"/> 
     <LinearGradientBrush x:Key="CheckedBrush" StartPoint="0,0" EndPoint="0,1"> 
      <GradientStop Offset="0" Color="#555555"/> 
      <GradientStop Offset="1" Color="#111111"/> 
     </LinearGradientBrush> 

     <!-- Left Button Template --> 
     <ControlTemplate x:Key="ToggleButtonLeft" TargetType="{x:Type ToggleButton}"> 
      <Border 
       Name="Border" 
       Background="{StaticResource BgBrush1}" 
       BorderBrush="{StaticResource BorderBrush1}" 
       BorderThickness="1" 
       CornerRadius="5,0,0,5"> 
       <ContentPresenter 
        HorizontalAlignment="Center" 
        Margin="{TemplateBinding Padding}" 
        VerticalAlignment="Center" 
        Content="{TemplateBinding Content}" 
        TextBlock.FontWeight="Bold" 
        TextBlock.Foreground="{StaticResource FontBrush}"/> 
      </Border> 
      <ControlTemplate.Triggers> 
       <Trigger Property="ToggleButton.IsMouseOver" Value="true"> 
        <Setter TargetName="Border" Property="Background" Value="#808080"/> 
       </Trigger> 
       <Trigger Property="IsChecked" Value="true"> 
        <Setter TargetName="Border" Property="Background" Value="{StaticResource CheckedBrush}"/> 
       </Trigger> 
      </ControlTemplate.Triggers> 
     </ControlTemplate> 

     <!-- Middle Button(s) Template --> 
     <ControlTemplate x:Key="ToggleButtonMid" TargetType="{x:Type ToggleButton}"> 
      <Border 
       Name="Border" 
       Background="{StaticResource BgBrush1}" 
       BorderBrush="{StaticResource BorderBrush1}" 
       BorderThickness="0,1,0,1" 
       CornerRadius="0" /> 
     <!-- Other code identical to Left Button Template -->  
     </ControlTemplate> 

     <!-- Right Button Template --> 
     <ControlTemplate x:Key="ToggleButtonRight" TargetType="{x:Type ToggleButton}"> 
      <Border 
       Name="Border" 
       Background="{StaticResource BgBrush1}" 
       BorderBrush="{StaticResource BorderBrush1}" 
       BorderThickness="1" 
       CornerRadius="0, 5, 5, 0" /> 
     <!-- Other code identical to Left Button Template --> 
     </ControlTemplate> 
    </Grid.Resources> 

    <!-- Example Usage --> 
    <Grid Background="#555555"> 
     <StackPanel Height="25" Orientation="Horizontal" Margin="5"> 
      <RadioButton Content="All" GroupName="View" Padding="2" Template="{DynamicResource ToggleButtonLeft}"/> 
      <RadioButton Content="Geolocated" GroupName="View" Padding="2" Template="{DynamicResource ToggleButtonMid}"/> 
      <RadioButton Content="Non Geolocated" GroupName="View" Padding="2" Template="{DynamicResource ToggleButtonRight}"/> 
     </StackPanel> 
    </Grid> 
</Grid> 

आप के लिए होता है IsPressed राज्य के लिए अतिरिक्त Triggers आदि को जोड़ने के लिए, और किसी भी अन्य लोगों की आवश्यकता (उदाहरण, IsEnabled)।