XAML將標題添加到單選按鈕

Question

因此，我希望能夠製作一個GroupBox，它就像一個單選按鈕。標題部分將作爲子彈。我花了一些代碼從這個問題

Styling a GroupBox

那是我希望它看起來。但我想把它作爲一個單選按鈕。所以我把這個代碼（請注意，我只一直在做WPF一個星期或2現在）

<Style TargetType="{x:Type RadioButton}" > 
     <Setter Property="Template"> 
      <Setter.Value> 
       <ControlTemplate TargetType="{x:Type RadioButton}"> 
        <BulletDecorator> 
         <BulletDecorator.Bullet> 
          <Grid> 
           <Grid.RowDefinitions> 
            <RowDefinition Height="Auto" /> 
            <RowDefinition Height="*" /> 
           </Grid.RowDefinitions> 
           <Border x:Name="SelectedBorder" 
             Grid.Row="0" 
             Margin="4" 
             BorderBrush="Black" 
             BorderThickness="1" 
             Background="#25A0DA"> 
            <Label x:Name="SelectedLabel" Foreground="Wheat"> 
             <ContentPresenter Margin="4" /> 
            </Label> 
           </Border> 
           <Border> 

           </Border> 
          </Grid> 
         </BulletDecorator.Bullet> 
        </BulletDecorator> 
        <ControlTemplate.Triggers> 
         <Trigger Property="IsChecked" Value="true"> 
          <Setter TargetName="SelectedBorder" Property="Background" Value="PaleGreen"/> 
          <Setter TargetName="SelectedLabel" 
            Property="Foreground" 
            Value="Black" /> 
         </Trigger> 

        </ControlTemplate.Triggers> 
       </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
    </Style> 

我有一種感覺，我可以將標籤添加到我的網格的第二行，但隨後我不知道如何訪問它。我有一個在Window.Resources部分測試項目模板（我打算將它移動到資源字典在我的主要項目） 的XAML我的窗口是這個

<Grid> 
    <GroupBox Name="grpDoor" Margin ="8" Grid.Row="0" Grid.Column="0"> 
     <GroupBox.Header> 
      WPF RadioButton Template 
     </GroupBox.Header> 
     <StackPanel Margin ="8"> 
      <RadioButton FontSize="15" Content="Dhaka" Margin="4" IsChecked="False"/> 
      <RadioButton FontSize="15" Content="Munshiganj" Margin="4" IsChecked="True" /> 
      <RadioButton FontSize="15" Content="Gazipur" Margin="4" IsChecked="False" /> 
     </StackPanel> 
    </GroupBox> 
</Grid> 

話，我希望這樣的事情這（不知道我怎麼會做這些事雖然）

<Grid> 
    <GroupBox Name="grpDoor" Margin ="8" Grid.Row="0" Grid.Column="0"> 
     <GroupBox.Header> 
      WPF RadioButton Template 
     </GroupBox.Header> 
     <StackPanel Margin ="8"> 
      <RadioButton FontSize="15" 
          Content="Dhaka" 
          Margin="4" 
          IsChecked="False"> 
       <RadioButton.Description> 
        This is a description that would show under my Header 
       </RadioButton.Description> 
      </RadioButton> 
      <RadioButton FontSize="15" 
          Content="Munshiganj" 
          Margin="4" 
          IsChecked="True"> 
       <RadioButton.Description> 
        This is a description that would show under my Header 
       </RadioButton.Description> 
      </RadioButton> 
      <RadioButton FontSize="15" 
          Content="Gazipur" 
          Margin="4" 
          IsChecked="False"> 
       <RadioButton.Description> 
        This is a description that would show under my Header 
       </RadioButton.Description> 
      </RadioButton> 
     </StackPanel> 
    </GroupBox> 
</Grid> 

Answer 1

根據您的澄清，這裏是一個非常簡單的例子，一個單選按鈕，看起來像一個分組框。

<Window x:Class="MainWindow" 
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
     xmlns:local="clr-namespace:WpfApplication1" 
     Title="MainWindow" Height="350" Width="525"> 
    <Window.DataContext> 
     <local:SimpleViewModel/> 
    </Window.DataContext> 
    <Window.Resources> 
     <DataTemplate DataType="{x:Type local:SimpleOption}"> 
      <RadioButton GroupName="choice" IsChecked="{Binding Path=IsSelected, Mode=TwoWay}"> 
       <RadioButton.Template> 
        <ControlTemplate TargetType="{x:Type RadioButton}"> 
         <GroupBox x:Name="OptionBox" Header="{Binding Path=DisplayName, Mode=OneWay}"> 
          <TextBlock Text="{Binding Path=Description, Mode=OneWay}"/> 
         </GroupBox> 
         <ControlTemplate.Triggers> 
          <DataTrigger Binding="{Binding Path=IsSelected, Mode=OneWay}" Value="True"> 
           <Setter TargetName="OptionBox" Property="Background" Value="Blue"/> 
          </DataTrigger> 
         </ControlTemplate.Triggers> 
        </ControlTemplate> 
       </RadioButton.Template> 
      </RadioButton> 
     </DataTemplate> 
    </Window.Resources> 
    <Grid> 
     <ListBox ItemsSource="{Binding Path=Options, Mode=OneWay}"/> 
    </Grid> 
</Window> 

public class SimpleViewModel 
{ 

    public SimpleViewModel() 
    { 
     Options = new ObservableCollection<SimpleOption>(); 
     var _with1 = Options; 
     _with1.Add(new SimpleOption { 
      DisplayName = "Dhaka", 
      Description = "This is a description for Dhaka." 
     }); 
     _with1.Add(new SimpleOption { 
      DisplayName = "Munshiganj", 
      Description = "This is a description for Munshiganj.", 
      IsSelected = true 
     }); 
     _with1.Add(new SimpleOption { 
      DisplayName = "Gazipur", 
      Description = "This is a description for Gazipur." 
     }); 
    } 

    public ObservableCollection<SimpleOption> Options { get; set; } 

} 

public class SimpleOption : INotifyPropertyChanged 
{ 

    public string DisplayName { 
     get { return _displayName; } 
     set { 
      _displayName = value; 
      NotifyPropertyChanged("DisplayName"); 
     } 
    } 

    private string _displayName; 
    public string Description { 
     get { return _description; } 
     set { 
      _description = value; 
      NotifyPropertyChanged("Description"); 
     } 
    } 

    private string _description; 
    public bool IsSelected { 
     get { return _isSelected; } 
     set { 
      _isSelected = value; 
      NotifyPropertyChanged("IsSelected"); 
     } 
    } 

    private bool _isSelected; 
    private void NotifyPropertyChanged(string propertyName) 
    { 
     if (PropertyChanged != null) { 
      PropertyChanged(this, new PropertyChangedEventArgs(propertyName)); 
     } 
    } 
    public event PropertyChangedEventHandler INotifyPropertyChanged.PropertyChanged; 
    public delegate void PropertyChangedEventHandler(object sender, PropertyChangedEventArgs e); 

} 

Answer 2

我會做一個自定義附加屬性。這樣，您可以從ViewModel綁定到它，或直接在XAML中應用它。

首先，在你Style組件創建一個新的類：

public static class RadioButtonExtender 
{ 
    public static readonly DependencyProperty DescriptionProperty = DependencyProperty.RegisterAttached(
     "Description", 
     typeof(string), 
     typeof(RadioButtonExtender), 
     new FrameworkPropertyMetadata(null)); 

    [AttachedPropertyBrowsableForType(typeof(RadioButton))] 
    public static string GetDescription(RadioButton obj) 
    { 
     return (string)obj.GetValue(DescriptionProperty); 
    } 

    public static void SetDescription(RadioButton obj, string value) 
    { 
     obj.SetValue(DescriptionProperty, value); 
    } 
} 

和你的風格的Bullet會改變，這樣的標籤是：

<Label x:Name="SelectedLabel" 
     Foreground="Wheat" 
     Content="{Binding (prop:RadioButtonExtender.Description), RelativeSource={RelativeSource TemplatedParent}} /> 

然後，您可以使用它在最終的XAML ：

<RadioButton FontSize="15" 
      Content="Dhaka" 
      Margin="4" 
      IsChecked="False"> 
    <prop:RadioButtonExtender.Description> 
     This is a description that would show under my Header 
    </prop:RadioButtonExtender.Description> 
</RadioButton> 

作爲額外的好處，由於您創建了Style在單獨的程序集中，您可以創建custom XAML namespace以使您的財產更容易使用。